Quantcast
Channel: Xamarin.Forms — Xamarin Community Forums
Viewing all articles
Browse latest Browse all 58056

Can't convert simple HTML table to XAML Grid

$
0
0

I can't figure out how to convert this simple HTML table (ignore the border attribute):

<table border="1">
    <tr>
        <td colspan="2" align="center">1234567</td>
        <td rowspan="3">$1,500</td>
    </tr>
    <tr>
        <td>Customer:</td>
        <td>ACME</td>
    </tr>
    <tr>
        <td>Carrier:</td>
        <td>UPS</td>
    </tr>   
</table>

image

into a XAML Grid:

<Grid VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
<Grid.RowDefinitions>
  <RowDefinition Height="*" />
  <RowDefinition Height="*" />
  <RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
  <ColumnDefinition Width="*" />
  <ColumnDefinition Width="*" />
  <ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>

<Label Text="{Binding ClaimNumber}"
    Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2"
    VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"
    XAlign="Start" YAlign="Center" Font="Bold, Large" TextColor="Black" />

<Label Text="Customer:"
    Grid.Row="2" Grid.Column="1" 
    VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" 
    XAlign="Start" YAlign="Center" Font="Small" TextColor="Gray" />
<Label Text="{Binding Customer}"
    Grid.Row="2" Grid.Column="2" 
    VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" 
    XAlign="Start" YAlign="Center" Font="Small" />

<Label Text="Carrier:"
    Grid.Row="3" Grid.Column="1" 
    VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" 
    XAlign="Start" YAlign="Center" Font="Small" TextColor="Gray" />
<Label Text="{Binding Carrier}"
    Grid.Row="3" Grid.Column="2" 
    VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" 
    XAlign="Start" YAlign="Center" Font="Small" />

<Label Text="{Binding Amount, StringFormat='{0:c}'}"
    Grid.Row="1" Grid.Column="2" Grid.RowSpan="3"
    VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"                                        
    XAlign="End" YAlign="Center" Font="Large" TextColor="Navy" />

</Grid>

image

I'm using Xamarin.Forms v1.2.3.6257. I've tried various combinations of "Auto" vs "*" for the Height and Width attributes. Should I be using StackLayout(s) instead?


Viewing all articles
Browse latest Browse all 58056

Trending Articles