如何在 itemscontrol 的用户控件中绑定特定属性

Question

我有以下用户控件：

<Grid x:Name="LayoutRoot">
    <CheckBox x:Name="seat" Margin="2,2,2,2.901" BorderBrush="#FF003FFF" Content="{Binding Path=TypeSSeat, ElementName=UserControl}"  />
</Grid>

有了这个代码隐藏：

    [DefaultValue(Nothing)]
public enum TypeSeat
{
   Nothing,FirstClass, businessclass , economyclass ,NoSeat
}
public partial class UCSeat : UserControl
{
    public TypeSeat TypeSSeat
    {

        get
        {
            return (TypeSeat)GetValue(ItemTextProperty);
        }
        set
        {
            SetValue(ItemTextProperty, value);
        }

    }
    public static readonly DependencyProperty ItemTextProperty =
   DependencyProperty.Register("TypeSSeat", typeof(TypeSeat), typeof(UCSeat), new PropertyMetadata(default(TypeSeat)));

我想用这个用户控件填充 itemscontrol 但在运行之后我 只有一个复选框 .

这是我的 windows 代码：

        <ItemsControl Name="icName" Height="366"  VerticalAlignment="Top"  ItemsSource="{Binding Path=UCSeat}" >
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Grid Margin="0,0,0,5">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="20" />
                        <ColumnDefinition Width="20" />

                    </Grid.ColumnDefinitions>
                    <local:UCSeat HorizontalAlignment="Left" Width="156.8" TypeSSeat="{Binding seat1}" ToolTip="1"/>
                    <local:UCSeat HorizontalAlignment="Left" Width="156.8" TypeSSeat="{Binding seat2}" ToolTip="2"/>

后面还有这段代码：

           List<SeatList> lst = new List<SeatList>();
         lst.Add(new SeatList { seat1 = TypeSeat.FirstClass, seat2 = TypeSeat.FirstClass, seat3 = TypeSeat.NoSeat, seat4 = TypeSeat.FirstClass, seat5 = TypeSeat.FirstClass, seat6 = TypeSeat.Nothing, seat7 = TypeSeat.Nothing, seat8 = TypeSeat.Nothing, seat9 = TypeSeat.Nothing, seat10 = TypeSeat.Nothing, seat11 = TypeSeat.Nothing, seat12 = TypeSeat.Nothing, seat13 = TypeSeat.Nothing, seat14 = TypeSeat.Nothing });
         icName.ItemsSource = lst;

Answer 1

您拥有所有物品，但它们都堆叠在一起。

要正确布置项目，您需要将 ItemsPanelTemplate 设置为您放置项目的任何容器（例如 Grid），并使用 ItemContainerStyle 设置任何您项目的特定属性（例如 Grid.Row 和 Grid.Column

这里有一些示例 XAML 来自 my blog post about the ItemsControl

<ItemsControl ItemsSource="{Binding MyCollection}">
    <!-- ItemsPanelTemplate -->
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition />
                    <RowDefinition />
                    <RowDefinition />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition />
                    <ColumnDefinition />
                    <ColumnDefinition />
                </Grid.ColumnDefinitions>
            </Grid>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>

    <!-- ItemContainerStyle -->
    <ItemsControl.ItemContainerStyle>
        <Style>
            <Setter Property="Grid.Column"
                    Value="{Binding ColumnIndex}" />
            <Setter Property="Grid.Row"
                    Value="{Binding RowIndex}" />
        </Style>
    </ItemsControl.ItemContainerStyle>

    <!-- ItemTemplate -->
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Button Content="{Binding Name}" />
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

这假设您要绑定到看起来像这样的对象集合：

public class MyObjectModel
{
    public string Name { get; set; }
    public int ColumnIndex{ get; set; }
    public int RowIndex{ get; set; }
}

结果是这样的：

如果您是 ItemsControl 的新手，我强烈建议您也阅读实际的 post :)

Answer 2

您的 DataTemplate 使用网格作为布局控件。两个 UCSeat 用户控件放置在此网格中，但未指定它们应位于哪一列。

这意味着两个 UCSeat 控件被放置在彼此之上，这可能使它看起来好像只显示一个复选框。

要么更改第二个 UCSeat 条目以包含 Grid.Column="1" 以使第二个用户控件显示在第二列中

或使用 StackPanel 容器和 Orientation="Horizontal" 而不是 Grid 容器，这意味着两者都将自动水平布局

如何在 itemscontrol 的用户控件中绑定特定属性

how to bind specific property in user control in itemscontrol

c#

data-binding

wpf

user-controls

itemscontrol

如何在 itemscontrol 的用户控件中绑定特定 属性

how to bind specific property in user control in itemscontrol

c#

data-binding

wpf

user-controls

itemscontrol

如何在 itemscontrol 的用户控件中绑定特定属性