CODEWITHSUNDEEP
c#wpfxamldatatemplate
meisenman
meisenman

Reputation: 1838

How can i format data template items into a table like appearance?

I am trying to display dynamically created data template items (bound to objects) into a table format. Both my stack panel and wrap panels will not format how they did when I originally used buttons. I am led to believe that my panel controls are not actually formatting the items that are inside of them.

Here are a few relevant samples of my code:

Code behind main window c#

int numTapeSlots = 16;
public ObservableCollection<Tape> topTapes;

    public MainWindow()
    {
        InitializeComponent();
        topTapes = new ObservableCollection<Tape>();           
        topTapeSlots.ItemsSource = topTapes;            

        //Create Buttons Top Tray
        for (int i = 1; i <= (numTapeSlots / 2); i++)
        {
            topTapes.Add(new Tape(i));
        }
     }

xaml

<Window.Resources>
  <DataTemplate x:Key="TapeSlot">
    <Border  MouseUp="Border_MouseUp"
             BorderBrush="Black"
             BorderThickness="5">
      <Grid>
        <TextBlock x:Name="slotLocation"
                   Text="{Binding Path=tapeLocation}"
                   Height="25"
                   Width="30" />

      </Grid>
    </Border>
  </DataTemplate>
</Window.Resources>

<WrapPanel x:Name="wpTopTray"
           Grid.Column="1"
           Margin="20,20,20,20"
           VerticalAlignment="Top">
  <ItemsControl Name="topTapeSlots"
                ItemTemplate="{StaticResource TapeSlot}" />
</WrapPanel>

Note: WrapPanel worked fine with buttons

What happens now is that the objects are displayed vertically in a line straight down. It is almost ignoring the wrapPanel control properties.

Upvotes: 0

Views: 821

Answers (1)

Bill Zhang
Bill Zhang

Reputation: 1939

What you should do is use ItemsPanel:

        <ItemsControl Name="topTapeSlots" ItemTemplate="{StaticResource TapeSlot}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel/>
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
        </ItemsControl>

Upvotes: 1

Related Questions