Xamarin.Forms Center ListView Items - xaml

Question

How do I center listview items within a Xamarin.Forms app?
The listview items are currently left-aligned.
I want them to be center-aligned.
I have the following code:
<ListView Grid.Row="1" Grid.Column="0" ItemsSource="{Binding Results}" HorizontalOptions="Center">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.View>
<Grid HorizontalOptions="Center">
<Grid.RowDefinitions>
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<Label Grid.Row="0" Grid.Column="0" Text="{Binding FirstName}" />
<Label Grid.Row="0" Grid.Column="1" Text="{Binding LastName}" />
</Grid>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>

Answer 1

Scott the Grid always expands to occupy 100% of the available space. There is no way as far as I can tell to override this even explicitly setting a widthrequest on the grid doesn't even seem to help.
I assume you have a larger layout requirement your attempting to satisfy as centering first and Last name in a listView would be better accomplished with a Stacklayout instead of a grid.
IE
<ViewCell.View>
<StackLayout Orientation="Horizontal">
<Label Text="{Binding FirstName}" HorizontalOptions="EndAndExpand"/>
<Label Text="{Binding LastName}" HorizontalOptions="StartAndExpand"/>
</StackLayout>
</ViewCell.View>
But assuming you really need a Grid then I can offer only 1 addition to Tomasz's suggestion.
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition />
<ColumnDefinition/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Label Grid.Row="0" Grid.Column="1" Text="{Binding FirstName}" HorizontalOptions="End"/>
<Label Grid.Row="0" Grid.Column="2" Text="{Binding LastName}" />
</Grid>
This create two Columns on the outside to eat up the space forcing the names to the middle.

Answer 2

Without having actually tried it...
Your cell view is <Grid HorizontalOptions="Center">, but the Grid itself is expanded to fit the cell, so the HorizontalOptions there is inconsequential.
You need to put a secondary container inside that Grid that will be centered,
something like:
<ViewCell.View>
<Grid>
<StackPanel Orientation="Horizontal" HorizontalOptions="Center">
<Label Grid.Row="0" Grid.Column="0" Text="{Binding FirstName}" />
<Label Grid.Row="0" Grid.Column="1" Text="{Binding LastName}" />
</StackPanel>
</Grid>
</ViewCell.View>
You could also try (if the above doesn't work) adding 3 columns (and 3 rows for vertical alignment) to the Grid with sizes (auto)-(*)-(auto) and putting the StackPanel in the center cell.

Answer 3

Maybe this way:
<Label Grid.Row="0" Grid.Column="0" Text="{Binding FirstName}" HorizontalOptions="Center"/>
<Label Grid.Row="0" Grid.Column="1" Text="{Binding LastName}" HorizontalOptions="Center"/>
EDITED:
<Grid.ColumnDefinitions>
<ColumnDefinition Width="5*" />
<ColumnDefinition Width="5*" />
</Grid.ColumnDefinitions>
<Label Grid.Row="0" Grid.Column="0" Text="{Binding FirstName}" HorizontalOptions="Center"/>
<Label Grid.Row="0" Grid.Column="1" Text="{Binding LastName}" HorizontalOptions="Center"/>

Answer 4

Just by adding HorizontalOptions="Center" to Label worked for me, good luck
<ListView Grid.Row="1" Grid.Column="0" ItemsSource="{Binding Results}" HorizontalOptions="Center">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.View>
<Grid HorizontalOptions="Center">
<Grid.RowDefinitions>
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="auto" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<Label HorizontalOptions="Center" Grid.Row="0" Grid.Column="0" Text="{Binding FirstName}" />
<Label HorizontalOptions="Center" Grid.Row="0" Grid.Column="1" Text="{Binding LastName}" />
</Grid>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>