网格项目未在行和列的正确位置呈现

时间:2013-06-10 14:54:18

标签: c# silverlight binding grid itemscontrol

我在将数据绑定到Grid时出现问题,生成了元素,但没有生成正确的行和列

当在那时分配源时,所有数据都将存在但不在正确的网格的行和列中,所有控件将在第0列和第0行中呈现

enter image description here

我的代码如下 Xaml

<UserControl.Resources>
    <DataTemplate x:Name="DTItemTemp">
        <Border Width="200" Height="Auto" BorderBrush="Red" BorderThickness="2" Grid.Row="{Binding Grow}" Grid.Column="{Binding Gcol}" Margin="5">
            <StackPanel Orientation="Vertical" >
                <TextBlock Text="{Binding Name, Mode=OneWay}"></TextBlock>
                <TextBlock Text="{Binding Grow, Mode=OneWay, StringFormat='Row {0}'}"></TextBlock>
                <TextBlock Text="{Binding Gcol, Mode=OneWay, StringFormat='Col {0}'}"></TextBlock>
            </StackPanel>
        </Border>
    </DataTemplate>
    <DataTemplate x:Name="DTGridTemp">
        <StackPanel Orientation="Vertical">
            <TextBlock Text="{Binding Name, Mode=OneWay}"></TextBlock>
            <Grid ShowGridLines="True" Margin="10">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition></ColumnDefinition>
                    <ColumnDefinition></ColumnDefinition>
                    <ColumnDefinition></ColumnDefinition>
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"></RowDefinition>
                </Grid.RowDefinitions>
                <ItemsControl   ItemsSource="{Binding MyItem,Mode=TwoWay}" 
                            ItemTemplate="{StaticResource DTItemTemp}" 
                            HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                            HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" />
            </Grid>
        </StackPanel>
    </DataTemplate>
    <DataTemplate x:Name="DTStack">

    </DataTemplate>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" Background="White">

    <ItemsControl x:Name="stksource"   ItemTemplate="{StaticResource DTGridTemp}" 
                    HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                    HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" />

</Grid>

Cs档案

public partial class MainPage : UserControl
{
    public MainPage()
    {         
        InitializeComponent();           
        mydata data = new mydata();
        data.DTGrid = new List<Grids>();
        for (int i = 0; i < 3; i++)
        {
            Grids grd = new Grids();
            grd.MyItem = new List<Items>();
            grd.Name = string.Format("Grid of {0}", i);
            for (int j = 0; j < 3; j++)
            {
                Items it = new Items();
                it.Name = string.Format("Item {0} of {1}", i, j);

                it.Grow = 0;
                it.Gcol = j;

                grd.MyItem.Add(it);
            }
            data.DTGrid.Add(grd);
        }            
        stksource.ItemsSource = data.DTGrid;
    }
}

public class mydata
{
    public List<Grids> DTGrid { get; set; }
}
public class Grids
{
    public string Name { get; set; }
    public List<Items> MyItem { get; set; }
}
public class Items
{
    public string Name { get; set; }
    public int Grow { get; set; }
    public int Gcol { get; set; }
}

1 个答案:

答案 0 :(得分:0)

经过多次来回,这是我的最终答案。将Style ContentPresenter添加到ItemsControl的资源中。

<ItemsControl x:Name="stksource"
            HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
            HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" >
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Vertical">
                <TextBlock Text="{Binding Name, Mode=OneWay}"></TextBlock>
                <ItemsControl ItemsSource="{Binding MyItem}" 
                    HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
                    HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch">

                    <!-- The ItemsPanel property tells the ItemsControl2 what type of container to use for all items -->
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <Grid ShowGridLines="True" Margin="10">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition></ColumnDefinition>
                                    <ColumnDefinition></ColumnDefinition>
                                    <ColumnDefinition></ColumnDefinition>
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="*"></RowDefinition>
                                </Grid.RowDefinitions>
                            </Grid>
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>

                    <!-- The ItemTemplate property tells the ItemsControl2 how each data item will be represented in the UI -->
                    <ItemsControl.ItemTemplate>
                        <DataTemplate>
                            <Border Width="200" Height="Auto" BorderBrush="Red" BorderThickness="2" Margin="5">
                                <StackPanel Orientation="Vertical" >
                                    <TextBlock Text="{Binding Name, Mode=OneWay}"></TextBlock>
                                    <TextBlock Text="{Binding Grow, Mode=OneWay, StringFormat='Row {0}'}"></TextBlock>
                                    <TextBlock Text="{Binding Gcol, Mode=OneWay, StringFormat='Col {0}'}"></TextBlock>
                                </StackPanel>
                            </Border>
                        </DataTemplate>
                    </ItemsControl.ItemTemplate>

                    <!-- The style for ContentPresenter will target the item containers -->
                    <ItemsControl.Resources>
                        <Style TargetType="ContentPresenter">
                            <Setter Property="Grid.Row" Value="{Binding Grow}" />
                            <Setter Property="Grid.Column" Value="{Binding Gcol}" />
                        </Style>
                    </ItemsControl.Resources>

                </ItemsControl>
            </StackPanel>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>