ListViewTextCell Text vertically not centered Android

7 posts, 0 answers
  1. Shalin
    Shalin avatar
    61 posts
    Member since:
    May 2015

    Posted 21 May 2018 Link to this post

    I have RadListView which has default item template ListViewTextCell and LayoutDefinition of ListViewGridLayout.

    In Android devices ListViewTextCell text are not vertically center align, but in iOS it is ok. It seems like even without using "Detail" section, ui rendere keeps space for that. ListViewLinearLayout also has same problem. i'll post xaml here...

    <telerikDataControls:RadListView
                                                         ItemsSource="{Binding EventStatusList}" SelectedItem="{Binding SelectedEventStatus}"
                                                         SelectionMode="Single">
                            <telerikDataControls:RadListView.ItemTemplate>
                                <DataTemplate>
                                    <telerikListView:ListViewTextCell Text="{Binding EventStatusDescription}"/>
                                </DataTemplate>
                            </telerikDataControls:RadListView.ItemTemplate>
                            <telerikDataControls:RadListView.LayoutDefinition>
                                <telerikListView:ListViewGridLayout HorizontalItemSpacing="2" VerticalItemSpacing="2" SpanCount="3"/>
                            </telerikDataControls:RadListView.LayoutDefinition>
                            <telerikDataControls:RadListView.ItemStyle>
                                <telerikListView:ListViewItemStyle BackgroundColor="{StaticResource BrandColorDarker}" 
                                                                   BorderWidth="0"    TextCellTextColor="White"
                                                                   BorderLocation="None"
                                                                   BorderColor="Transparent"/>
                            </telerikDataControls:RadListView.ItemStyle>
                            <telerikDataControls:RadListView.SelectedItemStyle>
                                <telerikListView:ListViewItemStyle TextCellTextColor="{StaticResource BrandColor}"
                                                                   BackgroundColor="White"
                                                                   BorderColor="Transparent" BorderWidth="0"
                                                                   BorderLocation="None"/>
                            </telerikDataControls:RadListView.SelectedItemStyle>
                            <telerikDataControls:RadListView.PressedItemStyle>
                                <telerikListView:ListViewItemStyle TextCellTextColor="{StaticResource BrandColor}"
                                                                   BorderColor="White" BorderWidth="5" BorderLocation="All"/>
                            </telerikDataControls:RadListView.PressedItemStyle>
                        </telerikDataControls:RadListView>

     

    I can not find a way to attach images to this thread. how to remove extra space under text in Android ?

  2. Lance | Manager Technical Support
    Admin
    Lance | Manager Technical Support avatar
    1186 posts

    Posted 24 May 2018 Link to this post

    Hi Shalin,

    The ListViewTextCell is meant for quick and easy rendering of Text and Detail properties, with a couple other simple properties like color. It doesn't expose Padding and Margin properties for the Labels in the cell.

    For this level of fine tuning, we recommend switching to a ListViewTemplateCell. By defining the DataTemplate in the ListViewTemplateCell, you can explicitly set the padding and margins around the Labels being used.

    Regards,
    Lance | Tech Support Engineer, Sr.
    Progress Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. Shalin
    Shalin avatar
    61 posts
    Member since:
    May 2015

    Posted 24 May 2018 in reply to Lance | Manager Technical Support Link to this post

    Text in text cell need to be vertically centered even i specify it or not. In ios that is how it is. Only in android it’s not centered. This could be a bug in list view textcell text not vertically centered. 
  4. Lance | Manager Technical Support
    Admin
    Lance | Manager Technical Support avatar
    1186 posts

    Posted 24 May 2018 Link to this post

    Hi Shalin,

    I do understand where you're coming from as the Xamarin.Forms TextCell uses Center for it's vertical position. In the case of the ListViewTextCell, the default value of the item container is Start (vertical and horizontal). 

    If you'd like to have the dev team reconsider changing it to Center, or instead add a VerticalContentAlignment property to the ListViewItemStyle, please submit a Feature Request to the UI for Xamarin Feedback Portal.  The development team uses that portal to prioritize feature requests and issue fixes. 

    Note: If you feel it should be considered a Bug Report instead of a Feature Request , you can choose that option from the drop down when submitting it.

    Regards,
    Lance | Tech Support Engineer, Sr.
    Progress Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  5. Shalin
    Shalin avatar
    61 posts
    Member since:
    May 2015

    Posted 24 May 2018 in reply to Lance | Manager Technical Support Link to this post

    Thank you very much for you answer and explanation.
  6. Shalin
    Shalin avatar
    61 posts
    Member since:
    May 2015

    Posted 24 May 2018 Link to this post

    And i am curious to know how same thing work perfectly in iOS. Text vertically center aligned 
  7. Lance | Manager Technical Support
    Admin
    Lance | Manager Technical Support avatar
    1186 posts

    Posted 24 May 2018 Link to this post

    Hi Shalin,

    The underlying components for each platform are different. The UI for Xamarin.Forms RadListView uses the following controls:

    - Android: UI for Xamairn.Android RadListView
    - iOS: UI for Xamairn.iOS TKListView

    You could go and create a custom renderer to override the Android RadListView, but that's significantly more work than just using a ListViewTemplateCell and position the Labels where you want them.

    Regards,
    Lance | Tech Support Engineer, Sr.
    Progress Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top