Skip to content

Instantly share code, notes, and snippets.

@Char0394
Created February 13, 2018 12:55
Show Gist options
  • Star 4 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save Char0394/f2c7f5e8a83144ab26a8b3863f36a4bc to your computer and use it in GitHub Desktop.
Save Char0394/f2c7f5e8a83144ab26a8b3863f36a4bc to your computer and use it in GitHub Desktop.
<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:GridSample"
x:Class="GridSample.GridSamplePage">
<ContentPage.Resources>
<ResourceDictionary>
<Style x:Key="headerTablet" TargetType="Label">
<Setter Property="TextColor" Value="White" />
<Setter Property="FontAttributes" Value="Bold" />
<Setter Property="BackgroundColor" Value="Silver" />
<Setter Property="VerticalTextAlignment" Value="Center" />
<Setter Property="HorizontalTextAlignment" Value="Center" />
</Style>
<Style x:Key="detailTablet" TargetType="Label">
<Setter Property="TextColor" Value="Black" />
<Setter Property="BackgroundColor" Value="White" />
<Setter Property="VerticalTextAlignment" Value="Center" />
<Setter Property="HorizontalTextAlignment" Value="Center" />
</Style>
</ResourceDictionary>
</ContentPage.Resources>
<Grid VerticalOptions="CenterAndExpand" Margin="10" Padding="1" BackgroundColor="Silver" RowSpacing="1" ColumnSpacing="1">
<Grid.RowDefinitions>
<RowDefinition Height="40" />
<RowDefinition Height="40" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="4*" />
<ColumnDefinition Width="4*" />
<ColumnDefinition Width="2*" />
</Grid.ColumnDefinitions>
<Label Text="First name" Grid.Row="0" Style="{DynamicResource headerTablet}"/>
<Label Text="Last name" Grid.Column="1" Grid.Row="0" Style="{DynamicResource headerTablet}"/>
<Label Text="Gender" Grid.Column="2" Grid.Row="0" Style="{DynamicResource headerTablet}"/>
<Label Text="Charlin" Grid.Column="0" Grid.Row="1" Style="{DynamicResource detailTablet}"/>
<Label Text="Agramonte" Grid.Column="1" Grid.Row="1" Style="{DynamicResource detailTablet}"/>
<Label Text="Female" Grid.Column="2" Grid.Row="1" Style="{DynamicResource detailTablet}"/>
</Grid>
</ContentPage>
@arvindrajachourasiya
Copy link

@charlin,
This layout looks beautiful. Here from 2nd row onward if I want to bind data dynamically how could I do that?

@renan-throsa
Copy link

Really nice table layout.

@RajuGadda
Copy link

you made my day. Really nice table layout.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment