基于特定条件的 WPF 控件..完全使用 Xaml 完成

本文关键字：Xaml 完成 控件 特定条件 WPF | 更新日期: 2023-09-27 18:35:31

这是我的Xaml ListView 

  <ListView x:Name="duplicateVarsInCompXMLListView" ItemsSource="{Binding}"  HorizontalAlignment="Left"  VerticalAlignment="Top" Width="306">
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Vertical">
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="ComponentID: " FontWeight="Bold" Foreground="Brown" />
                        <TextBlock Text="{Binding Name}"/>
                    </StackPanel>                                                                   
                    <ItemsControl ItemsSource="{Binding Parameters}">
                        <ItemsControl.ItemTemplate>
                            <DataTemplate>
                                <StackPanel>                 
                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock Text="Variable Name: " Foreground="Green"/>
                                        <TextBlock Text="{Binding Name}"/>
                                    </StackPanel>                                    
                                    <StackPanel Orientation="Horizontal">
                                        <TextBlock Text="Variable Value: " Foreground="Blue"/>
                                        <TextBlock Text="{Binding Value}"/>
                                    </StackPanel>
                                </StackPanel>                                
                            </DataTemplate>                               
                        </ItemsControl.ItemTemplate>
                    </ItemsControl>                    
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

代码隐藏 

        private ObservableCollection<Component> mastercomponentcollection;
        mastercomponentcollection = //code to populate the collection 
        duplicateVarsInCompXMLListView.DataContext = this.mastercomponentcollection;

涉及的类 

    public class Component
    {
    private ObservableCollection<ComponentParameter> parameters = new ObservableCollection<ComponentParameter>();
    public string Name
    {
        get;
        set;
    }
    public ObservableCollection<ComponentParameter> Parameters
    {
        get{return parameters;}
        set{parameters = value;}
    }
}

public class ComponentParameter
{
    public string Name
    {
        get;set;
    }
    public string Value
    {
        get;set;
    }
    public bool HasErrors
    {
        get;
        set;
    }
    public bool IsDuplicate
    {
        get; set;
    }
    public bool IsMissing
    {
        get;set;
    }

在这里，我只想显示IsDuplicate设置为 true 的那些集合项的绑定。我相信DataTemplate.Triggers是要走的路，但我无法弄清楚使其工作的确切语法。有什么建议吗？

基于特定条件的 WPF 控件..完全使用 Xaml 完成

这是

您的ItemsControl隐藏重复为假的项目ItemContainerStyle。

  <ItemsControl ItemsSource="{Binding Parameters}">
        <ItemsControl.ItemContainerStyle>
            <Style >
                <Style.Triggers>
                    <DataTrigger Binding="{Binding IsDuplicate}" Value="false">
                        <Setter Property="UIElement.Visibility" Value="Collapsed"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </ItemsControl.ItemContainerStyle>

如果要根据IsDuplicate属性显示两个不同的DataTemplate，可以使用 DataTemplateSelector。

创建从DataTemplateSelector派生的类，用于选择DataTemplate 

public class MyTemplateSelector : DataTemplateSelector
{
      public DataTemplate FirstTemplate { get; set; }
      public DataTemplate SecondTemplate { get; set; }
      public override System.Windows.DataTemplate SelectTemplate(object item, System.Windows.DependencyObject container)
      {
               var model = item as ComponentParameter;
               if (model.IsDuplicated)
                    return FirstTemplate;
              return SecondTemplate;
      }
}

在资源中创建它，并在 xaml 中定义模板：

<local:MyTemplateSelector x:Key="itemTemplateSelector">
        <local:MyTemplateSelector.FirstTemplate>
            <DataTemplate>
                  <StackPanel>                 
                         <StackPanel Orientation="Horizontal">
                               <TextBlock Text="Variable Name: " Foreground="Green"/>
                               <TextBlock Text="{Binding Name}"/>
                          </StackPanel>                                    
                          <StackPanel Orientation="Horizontal">
                               <TextBlock Text="Variable Value: " Foreground="Blue"/>
                               <TextBlock Text="{Binding Value}"/>
                          </StackPanel>
                   </StackPanel>                                
             </DataTemplate>                  
        </local:MyTemplateSelector.FirstTemplate>
        <local:MyTemplateSelector.SecondTemplate>
            <DataTemplate>
                <!-- Implementation without bindings goes here -->
            </DataTemplate>
        </local:MyTemplateSelector.SecondTemplate>
</local:MyTemplateSelector>

并在您的ListView中使用它：

 <ListView.ItemTemplate>
        <DataTemplate>
            <StackPanel Orientation="Vertical">
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="ComponentID: " FontWeight="Bold" Foreground="Brown" />
                    <TextBlock Text="{Binding Name}"/>
                </StackPanel>                                                                   
                <ItemsControl ItemsSource="{Binding Parameters}" ItemTemplateSelector="{StaticResource itemTemplateSelector}"/>
            </StackPanel>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>
相关文章：