WPF将额外项添加到绑定集合

时间:2016-04-02 21:34:06

标签: c# wpf

我有ItemsControl个绑定项目。正如您在屏幕截图中看到的那样,这些项目绑定到一个属性,我希望出现一个额外的项目,其行为将与其他项目完全不同。我怎样才能做到这一点(仅限xaml)?

Screenshot for what I want

2 个答案:

答案 0 :(得分:4)

看看Composite Collection。例如herehere

根据评论,这是第一个例子中的示例代码

<ComboBox>
    <ComboBox.ItemsSource>
        <CompositeCollection>
            <ComboBoxItem Content="All" />
            <CollectionContainer Collection="{Binding Source={StaticResource AllBitsSource}}" />
        </CompositeCollection>
    </ComboBox.ItemsSource>
</ComboBox>

编辑 - MVVM

CollectionContainer的问题是无法访问curent DataContext。 StaticResource解决了它

XAML

<Window x:Class="WpfApplication5.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:my="clr-namespace:WpfApplication5"
        Title="MainWindow" Height="300" Width="525" FontSize="25">

    <StackPanel Name="stk">
        <StackPanel.Resources>
            <CollectionViewSource x:Key="cvsBooks" Source="{Binding Path=Books}" />
        </StackPanel.Resources>

        <ListBox>
            <ListBox.ItemsSource>
                <CompositeCollection>
                    <ListBoxItem>
                        <StackPanel>
                            <TextBlock Margin="5,0">Not tagged</TextBlock>
                        </StackPanel>
                    </ListBoxItem>
                    <CollectionContainer Collection="{Binding Source={StaticResource cvsBooks}}"/>
                </CompositeCollection>
            </ListBox.ItemsSource>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Name}"/>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

        <Button Content="Add" Click="Button_Click"/>
    </StackPanel>
</Window>

C#

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        var vm = new ViewModel();
        this.stk.DataContext = vm;
    }

    private void Button_Click(object sender, RoutedEventArgs e)
    {
        //should be Command in MVVM, but this is just example to see that ObservableCollection works
        var btn = sender as Button;
        (btn.DataContext as ViewModel).Books.Add(new Book() { Name = "Book" + DateTime.Now.Second });
    }

}

public class ViewModel
{
    public ViewModel()
    {
        this.Books = new ObservableCollection<Book>();
        this.Books.Add(new Book() { Name = "Book 1" });
        this.Books.Add(new Book() { Name = "Book 2" });
        this.Books.Add(new Book() { Name = "Book 3" });
    }

    public ObservableCollection<Book> Books { get; private set; }
}

public class Book
{
    public string Name { get; set; }
}

答案 1 :(得分:0)

  

与其他项目的行为完全不同。

行为是通过样式完成的。我将提供一个可以翻译为ItemsControl的列表框示例。

比方说,我们有一个public class Order { public string CustomerName { get; set; } public int OrderId { get; set; } public bool InProgress { get; set; } } 类,其中包含这些属性

InProgress

当订单被标记为正在进行时(true = <ListBox ItemsSource="{StaticResource Orders}" x:Name="lbOrders"> <ListBox.Resources> <DataTemplate DataType="{x:Type model:Order}"> <TextBlock Text="{Binding Path=CustomerName}" /> </DataTemplate> <Style TargetType="{x:Type ListBoxItem}"> <Style.Triggers> <DataTrigger Binding="{Binding Path=InProgress}" Value="True"> <Setter Property="Foreground" Value="Red" /> </DataTrigger> </Style.Triggers> </Style> </ListBox.Resources> </ListBox> ),我们希望在列表框中显示红色,表示正在进行的“Alpha”和“Omega”:

enter image description here

ListBox Xaml

以下是绑定到我们数据的Xaml(绑定方式取决于您),并说明了如何使用Style(s),DataTemplateDataTrigger(s) )实现这一点:

<Window.Resources>
    <model:Orders x:Key="Orders">
        <model:Order CustomerName="Alpha"
                        OrderId="997"
                        InProgress="True" />
        <model:Order CustomerName="Beta"
                        OrderId="998"
                        InProgress="False" />
        <model:Order CustomerName="Omega"
                        OrderId="999"
                        InProgress="True" />
        <model:Order CustomerName="Zeta"
                        OrderId="1000"
                        InProgress="False" />
    </model:Orders>
</Window.Resources>

以下是页面资源Xaml中的数据设置,但它可以在后面的代码中创建:

{{1}}

现在只是一个问题,即添加项目将具有什么属性,这将触发不同的风格。