Silverlight Dynamically sized table

Question

I'm very new to Silverlight so I apologise if this question is obvious but I want to create something similar to a HTML table that can have any number of rows from 1 to x.

I need the table to grow with the number of rows added to it. Additionally, I would like to be able to set the width and height of the table as a whole and have all the text in each row to dynamically resize appropriately.

What would the XAML for something like this look like?

Cheers, Chris.

EDIT:

Thanks for the responses, it appears that what I want is a mixture of all the suggestions made to archive this:

  <Grid x:Name="ExampleGrid" Height="150" Width="300" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
  <Grid.RowDefinitions>
      <RowDefinition Height="*"/>
      <RowDefinition Height="*"/>
      <RowDefinition Height="*"/>
  </Grid.RowDefinitions>
  <Viewbox Stretch="Fill"  Grid.Row="0">
    <!-- Two column header -->
    <StackPanel Orientation="Horizontal">
        <TextBlock Text="Text One" Height="Auto" />
        <TextBlock Text="Text One" Height="Auto" />
    </StackPanel>
  </Viewbox>
  <Viewbox Stretch="Fill"  Grid.Row="1">
    <TextBlock Text="Text Two" Height="Auto" />
  </Viewbox>
  <Viewbox Stretch="Fill"  Grid.Row="2">
    <TextBlock Text="Text Three" Height="Auto"/>
  </Viewbox>

Answer 1

I'm fairly new to XAML myself, but I'm pretty sure that you don't need to do anything in XAML itself but rather in code. XAML gets compiled to BAML (binary) and your code works with the .NET objects defined within the BAML, the XAML itself is just a human-readable design time language.

What you're probably after is programmitically adding row definitions, which would be something along the lines of:

Grid g = this.Grid1
g.RowDefinitions.Add(new RowDefinition)

of course you can loop to keep adding RowDefinitions to the RowDefinitions collection, and also set other properties on the RowDefinition before or after adding them to the grid

Answer 2

You should probably look into the ListBox (or DataGrid)

Here is a good Silverlight Tutorial by Scott GU:

http://weblogs.asp.net/scottgu/pages/silverlight-tutorial-part-5-using-the-listbox-and-databinding-to-display-list-data.aspx

Answer 3

You want to use a Grid in your XAML file. Here is an example: Once you have the Grid Defined you can easilly and and remove columns and rows just the the previous post says. Setting the alignment to Stretch will allow the Grid to resize with the browser.

<Grid x:Name="grdName"HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >

One thing I found a little hard to figure out is how to changea row or column and set it to Auto Width. Here is an example of that.

Dim objCol As ColumnDefinition = Nothing

objCol = grdName.ColumnDefinitions.Item(0) objCol.Width = New GridLength(Double.NaN)

If you want to set the width to any other value just put the number in the place oof the Double.NaN.

Oh all that code is VB.net.

Answer 4

The first question that comes to mind is when would you be adding the rows. Is it purely design time? or is it a run time requirement?

<Grid x:Name="ExampleGrid" Height="20" Width="200">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <TextBlock Text="Text One" Height="Auto" Grid.Row="0"/>
    <TextBlock Text="Text Two" Height="Auto" Grid.Row="1"/>
    <TextBlock Text="Text Three" Height="Auto" Grid.Row="2"/>
</Grid>

This will create a three row grid. With each grid getting an equal share of available space. (the star in height means split available space)

If you were to add a row at runtime.

ExampleGrid.RowDefinitions.Add(new RowDefinition() { Height = new GridLength(1, GridUnitType.Star) });

TextBlock block = new TextBlock() { Text = "Text Four" };
Grid.SetRow(block, 3);

ExampleGrid.Children.Add(block);

The problem comes with getting the text itself to scale up or down to fit the available space, and i'm not sure how to do that.