无法在DropDownButton中

时间:2016-10-10 07:28:29

标签: c# wpf xaml mahapps.metro

摘要

我的DropDownButton包含特定国家/地区的所有联盟。因此,用户基本上从Nation中选择ComboBox,并在Leagues内添加所选Nation的{​​{1}}。直到这里没问题。

我需要做的是:在DropDownButton内为Leagues整理DropDownButton。想象一下,Nation我在这个组织内部:

DropDownButton

项目类型

如何看待该项目是按国家组织的。在解释我为实现这个结果所做的工作之前,我不得不说我使用的是Italy Item1 Item2 Item3 England Item1 Item2 Spain Item1 Item2 ... etc ... 类,它本质上是一个将CheckedListItem绑定到CheckBox项的类。 }。这个课很简单:

DropDownButton

基本上可以使public class CheckedListItem<T> : INotifyPropertyChanged { public event PropertyChangedEventHandler PropertyChanged; private bool isChecked; private T item; public CheckedListItem() { } public CheckedListItem(T item, bool isChecked = false) { this.item = item; this.isChecked = isChecked; } public T Item { get { return item; } set { item = value; PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Item")); } } public bool IsChecked { get { return isChecked; } set { isChecked = value; PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("IsChecked")); } } } 和if被选中。为了使其在Item<T>中正常工作,我在XAML

中编写了此代码
Window.Resources

解释问题

现在要实现<DataTemplate x:Key="NormalItemTemplate"> <CheckBox IsChecked="{Binding IsChecked}" Content="{Binding Item.Name}" x:Name="Leagues" Checked="Leagues_Checked" Unchecked="Leagues_Unchecked" /> </DataTemplate> <DataTemplate x:Key="SelectionBoxTemplate" > <TextBlock Text="{DynamicResource displayedNation}"/> </DataTemplate> <DataTemplate x:Key="CombinedTemplate"> <ContentPresenter x:Name="Presenter" Content="{Binding}" ContentTemplate="{StaticResource NormalItemTemplate}" /> <DataTemplate.Triggers> <DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, Controls:DropDownButton, 1}}" Value="{x:Null}"> <Setter TargetName="Presenter" Property="ContentTemplate" Value="{StaticResource SelectionBoxTemplate}" /> </DataTrigger> </DataTemplate.Triggers> </DataTemplate> <!--This is for the group item !--> <Style TargetType="{x:Type GroupItem}" x:Key="containerStyle"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type GroupItem}"> <!--Here, we tell that each group of item will be placed under Expander control, and this expander control will by default will have style we defined in above code.--> <Expander IsExpanded="False" x:Name="ComboExpander" Header="{TemplateBinding Content}" HeaderTemplate="{TemplateBinding ContentTemplate}"> <ItemsPresenter /> </Expander> </ControlTemplate> </Setter.Value> </Setter> </Style> 中的分组,我首先在DropDownButton中创建CollectionViewSource,如下所示:

Window.Resource

<CollectionViewSource Source="{Binding Leagues}" x:Key="GroupedData"> <CollectionViewSource.GroupDescriptions> <PropertyGroupDescription PropertyName="Item.Country" /> </CollectionViewSource.GroupDescriptions> </CollectionViewSource> <DataTemplate x:Key="GroupHeader"> <TextBlock Text="{Binding Name}" Margin="10,0,0,0" Foreground="#989791"/> </DataTemplate> 我设置了这个结构:

DropDownButton

请注意我使用的是MahApp

基本上我添加了<Controls:DropDownButton Content="Leagues" x:Name="LeagueMenu" ItemsSource="{Binding Source={StaticResource GroupedData}}" ItemTemplate="{StaticResource CombinedTemplate}" > <Controls:DropDownButton.GroupStyle> <GroupStyle ContainerStyle="{StaticResource containerStyle}" HeaderTemplate="{StaticResource GroupHeader}"> </GroupStyle> </Controls:DropDownButton.GroupStyle> </Controls:DropDownButton> 的模板和CheckedListItem ItemSource的模板,您可以从上面的代码中看到GroupedData的{​​{1}} ObservableCollection

数据填充

选择Leagues后,Nation中将添加可用于所选Leagues的{​​{1}}列表,其中包含实现此目的的代码:

Nations

要求添加所选DropDownButton的{​​{1}}的方法是:

private ObservableCollection<CheckedListItem<League>> _leagues = new ObservableCollection<CheckedListItem<League>>();
public ObservableCollection<CheckedListItem<League>> Leagues
{
    get
    {
        return _leagues;
    }
    set
    {
        _leagues = value;
        OnPropertyChanged();
    }
}

基本上我创建League Nation,因为模型包含此属性:

public void GetLeagues(string link, string nation)
{
    Task.Run(() =>
    {
        var leagues = //get some collection

        foreach (var league in leagues)
        {
            var championship = new CheckedListItem<League>();
            championship.Item = new League { Name = league.Name, Link = league.Link, Country = nation };
            _leagues.Add(championship);
        }
    });
}

应该出现的结果是这样的:

enter image description here

采取from this tutorial

但我得到了这个结果:

enter image description here

正如您所看到的,我没有使用CheckedListItem名称进行标题分组。我在XAML或代码中也没有错误,因此我不知道为什么标题不会出现。

我知道问题可能有点复杂,所以对于任何问题或更多细节,请问我,我会尝试回答。

演示解决方案:

https://mega.nz/#!g4YlTL4A!G4WXy1t64Q4yImYNvzgwGbieX1mhKnXO2OiuAO3FDg0

1 个答案:

答案 0 :(得分:4)

我没有试图让第三方控件发挥作用,而是改变了工作ComboBox以满足您的需求:

Champ

<强> MainWindow.xaml

<Controls:MetroWindow x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:Controls="http://metro.mahapps.com/winfx/xaml/controls"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApplication1"
        mc:Ignorable="d"
        Title="MainWindow" Height="700" Width="525">
    <Window.Resources>
        <ResourceDictionary>

            <CollectionViewSource Source="{Binding Leagues}" x:Key="GroupedData">
                <CollectionViewSource.GroupDescriptions>
                    <PropertyGroupDescription PropertyName="Item.Country" />
                </CollectionViewSource.GroupDescriptions>
            </CollectionViewSource>

            <DataTemplate x:Key="GroupHeader">
                <TextBlock Text="{Binding Name}" Margin="10,0,0,0" Foreground="#989791"/>
            </DataTemplate>

            <Style TargetType="{x:Type GroupItem}" x:Key="containerStyle">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type GroupItem}">
                            <Expander   IsExpanded="False" x:Name="ComboExpander" Header="{TemplateBinding Content}"
                                        HeaderTemplate="{StaticResource GroupHeader}">
                                <ItemsPresenter />
                            </Expander>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <DataTemplate x:Key="NormalItemTemplate">
                <CheckBox IsChecked="{Binding IsChecked}" Content="{Binding Item.Name}" x:Name="Leagues" />
            </DataTemplate>
            <DataTemplate x:Key="HeaderTemplate">
                <TextBlock Text="Campionati"/>
            </DataTemplate>
            <DataTemplate x:Key="CombinedTemplate">
                <ContentPresenter x:Name="Presenter" 
                   Content="{Binding}"
                   ContentTemplate="{StaticResource NormalItemTemplate}" />
                <DataTemplate.Triggers>
                    <DataTrigger
                        Binding="{Binding RelativeSource={RelativeSource FindAncestor, ComboBoxItem, 1}}"
                        Value="{x:Null}">
                        <Setter TargetName="Presenter" Property="ContentTemplate"
                            Value="{StaticResource HeaderTemplate}" />
                    </DataTrigger>
                </DataTemplate.Triggers>
            </DataTemplate>
        </ResourceDictionary>

    </Window.Resources>    
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <ComboBox x:Name="LeagueMenuComboBox" 
                  ItemsSource="{Binding Source={StaticResource GroupedData}}"
                  ItemTemplate="{StaticResource CombinedTemplate}"
                  HorizontalContentAlignment="Center">
            <ComboBox.GroupStyle>
                <GroupStyle ContainerStyle="{StaticResource containerStyle}"
                            HeaderTemplate="{StaticResource GroupHeader}">
                </GroupStyle>
            </ComboBox.GroupStyle>
        </ComboBox>
    </Grid>
</Controls:MetroWindow>