Take the 2-minute tour ×
Programmers Stack Exchange is a question and answer site for professional programmers interested in conceptual questions about software development. It's 100% free, no registration required.

HTML

<table border="1" width="400">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$80</td>
  </tr>
</table>

XAML

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
        <RowDefinition Height="28" />
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="200" />
    </Grid.ColumnDefinitions>
    <Label Grid.Row="0" Grid.Column="0" Content="Name:"/>
    <Label Grid.Row="1" Grid.Column="0" Content="E-Mail:"/>
    <Label Grid.Row="2" Grid.Column="0" Content="Comment:"/>
    <TextBox Grid.Column="1" Grid.Row="0" Margin="3" />
    <TextBox Grid.Column="1" Grid.Row="1" Margin="3" />
    <TextBox Grid.Column="1" Grid.Row="2" Margin="3" />
    <Button Grid.Column="1" Grid.Row="3" HorizontalAlignment="Right" 
            MinWidth="80" Margin="3" Content="Send"  />
</Grid>

In HTML, there's some ambiguity on how you set the width of a column. You have to specify it on the th/td, but there are multiple of those within the same column.

WPF solves this problem by introducing "definitions", but then you have to explicitly specify which cell you want to insert each element in to, adding a lot of extra markup. Also, what happens if you miss a cell, or try to put two elements into the same cell?

What about something like this?

<grid>
    <coldefs>
        <coldef width="150" />
        <coldef width="100" />
    </coldefs>
    <rowdefs>
        <rowdef height="50" />
        <remainingrowdef height="auto" />
    </rowdef>

    <cell>Month</cell>
    <cell>Savings</cell>
    <cell>January</cell>
    <cell>$100</cell>
    <cell>February</cell>
    <cell>$80</cell>
</grid>

Where the cells just fill left to right, top to bottom? Pros/cons? Other options?


Better yet, you can specify the fill order too! Just add an extra argument <grid fill_order="left-right,top-bottom">

share|improve this question
    
I think it would make more sense to label the XAML example XAML (since it applies to both WPF and Silverlight). But nice question, I will watch this. –  Matěj Zábský Apr 16 '11 at 21:43
    
@mzabsky: good point. fixed. –  Mark Apr 16 '11 at 21:55
    
It depends if you want to serialise objects, does .Net favour attribute or element based serialisation? ;) –  Carnotaurus Apr 17 '11 at 1:29
    
@Carnotaurus: Eh? Not concerned about serialization. Why does it matter what .net favors? –  Mark Apr 17 '11 at 4:53
add comment

1 Answer

I think a good table definition should fit very well with XSLT, so you can derive your HTML and XAML examples easily. Your proposal looks good, maybe this would be easier to transform:

<grid>
    <coldefs>
        <coldef width="150" />
        <coldef width="100" />
    </coldefs>
    <rowdef height="auto" />

    <row height="50">
        <cell>Month</cell>
        <cell>Savings</cell>
    </row>
    <row>
        <cell>January</cell>
        <cell>$100</cell>
    </row>
    <row>
        <cell>February</cell>
        <cell>$80</cell>
    </row>
</grid>
share|improve this answer
    
Looks easier to read, but it's harder to output when you're in a loop. You always have to check if you're in the first col, then output a <row> then if you're in the last col, output a </row> and then make sure everything's properly closed at the end. Without the <rows> you wouldn't have to worry about any of that. Also, if you have a grid of images for example, and you wanted to add one more col, you'd just have to add one more coldef rather than having to try and shuffle all the <rows> around. –  Mark Apr 30 '11 at 19:39
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.