Custom cell in table using grid via XAML?

JesseLibertyJesseLiberty USInsider, University ✭✭✭

I have a form with a custom viewCell that looks like this:
<?xml version="1.0" encoding="UTF-8"?> <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="EvalUate.DetailsPage" Title="{Binding Name}"> <ContentPage.Content> <ScrollView> <ListView x:Name="CriteriaList" ItemsSource="{Binding Criteria}"> <ListView.ItemTemplate> <DataTemplate> <ViewCell> <ViewCell.View> <StackLayout Orientation="Horizontal"> <Label Text="{Binding Name}" /> <Label Text=" " /> <Label Text="Rated: " /> <Label Text="{Binding Rating}" /> <Label Text=" " /> <Label Text="Value: " /> <Label Text="{Binding Importance}" /> </StackLayout> </ViewCell.View> </ViewCell> </DataTemplate> </ListView.ItemTemplate> </ListView> </ScrollView> </ContentPage.Content> </ContentPage>

the problem is that the columns do not align. I thought I could replace the StackLayout with a Grid, but I can't seem to get that to work. Here is what I tried,

<Grid> <RowDefinitionCollection> <RowDefinition /> </RowDefinitionCollection> <ColumnDefinitionCollection> <ColumnDefinition /> <ColumnDefinition /> <ColumnDefinition /> </ColumnDefinitionCollection> <Label Text="{Binding Name}" Grid.Row="0" Grid.Column="0" /> <StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="1"> <Label Text="Rated: "/> <Label Text="{Binding Rating}"/> </StackLayout> <StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="2"> <Label Text="Value: "/> <Label Text="{Binding Importance}"/> </StackLayout> </Grid>

But this throws an exception. Is there documentation on using a grid in XAML?

Posts

  • rmarinhormarinho PTMember, Insider, Beta Xamurai
    edited June 2014

    Hi @JesseLiberty‌ this one is just like in MS xaml :) problem is you are not specifying the right name on the ColumnDefinitions and RowDefinitions, try this:

    <Grid>  
    <Grid.ColumnDefinitions>
           <ColumnDefinition ></ColumnDefinition>
           <ColumnDefinition ></ColumnDefinition>
           <ColumnDefinition ></ColumnDefinition>
     </Grid.ColumnDefinitions>
     <Grid.RowDefinitions>
            <RowDefinition />
      </Grid.RowDefinitions>
    

  • JesseLibertyJesseLiberty USInsider, University ✭✭✭

    Yes! Of course! I followed the code example too closely and lost my XAML head. Thanks, that fixed it.

Sign In or Register to comment.