ListViewTextCell Text vertically not centered Android

[Shalin]

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 ?

[Lance | Senior Manager Technical Support]

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

[Shalin]

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. 

[Lance | Senior Manager Technical Support]

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

[Shalin]

Thank you very much for you answer and explanation.

[Shalin]

And i am curious to know how same thing work perfectly in iOS. Text vertically center aligned 

[Lance | Senior Manager Technical Support]

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