MultiTrigger 条件到相同的绑定/使用触发器切换控件答案

【问题标题】：MultiTrigger Condition to same binding/ Switch controls using TriggerMultiTrigger 条件到相同的绑定/使用触发器切换控件
【发布时间】：2020-03-04 23:06:14
【问题描述】：

我正在尝试让p:MarqueeTextBlock 仅在TargetType="{x:Type ListBoxItem}" 下滚动ListBox IsSelected。

无法解决添加MultiTrigger 条件（当IsSelected 变为True 或False 时触发）以将p:MarqueeTextBlock 的Property="Scroll" 更改为Off 或LeftTypewriter。另外不确定如何在DataTemplate 中引用p:MarqueeTextBlock；也许如果我提供一个x:Name？但是我得到Template property has already been set on DataTemplate。

我需要以某种方式在x:Key="ListBoxStyle_GAME" 中添加AOTbMain_MARQUEE，例如：

<p:MarqueeTextBlock Text="{Binding Path=Title}" Style="{StaticResource AOTbMain_MARQUEE}"/>

未添加上述参考代码：

<UserControl
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:p="clr-namespace:Plugin.Controls;assembly=Plugin.v1"
    mc:Ignorable="d"
    d:DesignHeight="2160" d:DesignWidth="3840">

    <UserControl.Resources>
        <ResourceDictionary>
            <Style x:Key="ListBoxItemStyle" TargetType="ListBoxItem">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ListBoxItem}">
                            <Grid>
                                <Image x:Name="SelectedGameOverlay" Source="{}pack://siteoforigin:,,,/Images/Selected Game Overlay.png" RenderOptions.BitmapScalingMode="HighQuality" Visibility="Hidden" />
                                <ContentPresenter x:Name="SelectedGameTextColour" HorizontalAlignment="Left" />
                            </Grid>
                            <ControlTemplate.Triggers>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="Selector.IsSelectionActive" Value="False" />
                                        <Condition Property="IsSelected" Value="True" />
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Opacity" Value="1" />
                                    <Setter TargetName="SelectedGameOverlay" Property="Visibility" Value="Visible" />
                                    <Setter TargetName="SelectedGameTextColour" Property="TextElement.Foreground" Value="#FFFFFF" />
                                </MultiTrigger>
                                <MultiTrigger>
                                    <MultiTrigger.Conditions>
                                        <Condition Property="Selector.IsSelectionActive" Value="True" />
                                        <Condition Property="IsSelected" Value="True" />
                                    </MultiTrigger.Conditions>
                                    <Setter Property="Opacity" Value="1" />
                                    <Setter TargetName="SelectedGameOverlay" Property="Visibility" Value="Visible" />
                                    <Setter TargetName="SelectedGameTextColour" Property="TextElement.Foreground" Value="#FFFFFF" />
                                </MultiTrigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <Style x:Key="ListBoxStyle" TargetType="p:AutoscrollListBox">
                <Setter Property="ItemContainerStyle" Value="{StaticResource ListBoxItemStyle}" />
                <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
                <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled" />
                <Setter Property="Background" Value="Transparent" />
                <Setter Property="BorderThickness" Value="0" />
            </Style>

            <Style x:Key="ListBoxStyle_BASE" TargetType="p:AutoscrollListBox" BasedOn="{StaticResource ListBoxStyle}">
                <Setter Property="ScrollMode" Value="Center" />
                <Setter Property="ItemContainerStyle">
                    <Setter.Value>
                        <Style TargetType="ListBoxItem" BasedOn="{StaticResource ListBoxItemStyle}">
                            <Setter Property="Padding" Value="1" />
                        </Style>
                    </Setter.Value>
                </Setter>
            </Style>

            <Style x:Key="AOTbMain_MARQUEE" TargetType="p:MarqueeTextBlock">
                <Setter Property="Scroll" Value="LeftTypewriter" />
                <Setter Property="ScrollDelayBeg" Value="0:0:5" />
                <Setter Property="ScrollDelayEnd" Value="0:0:3" />
                <Setter Property="ScrollSpeed" Value="0:0:5" />
            </Style>

            <Style x:Key="ListBoxStyle_BASE_INDXFADER" TargetType="p:AutoscrollListBox" BasedOn="{StaticResource ListBoxStyle_BASE}">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding IndexVisibility}" Value="Visible">
                        <Setter Property="Opacity" Value="0.1" />
                    </DataTrigger>
                    <DataTrigger Binding="{Binding IndexVisibility}" Value="Hidden">
                        <Setter Property="Opacity" Value="1" />
                    </DataTrigger>
                </Style.Triggers>
            </Style>

            <Style x:Key="ListBoxStyle_BASETB" TargetType="p:AutoscaleTextBlock">
                <Setter Property="TextTrimming" Value="CharacterEllipsis" />
                <Setter Property="TargetFontSize" Value="30" />
            </Style>

            <Style x:Key="ListBoxStyle_GAME" TargetType="p:AutoscrollListBox" BasedOn="{StaticResource ListBoxStyle_BASE_INDXFADER}">
                <Setter Property="ItemTemplate">
                    <Setter.Value>
                        <DataTemplate>
                            <p:AutoscaleTextBlock Text="{Binding Path=Title}" Style="{StaticResource ListBoxStyle_BASETB}" />
                        </DataTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <Style x:Key="ListBoxItemStyleSearch" TargetType="ListBoxItem">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ListBoxItem}">
                            <Grid>
                                <ContentPresenter x:Name="SelectedSearchTextColour" />
                            </Grid>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsSelected" Value="True" />
                                    <Setter Property="Opacity" Value="1" />
                                    <Setter TargetName="SelectedSearchTextColour" Property="TextElement.Foreground" Value="#FFFFFF" />
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>

            <Style x:Key="ListBoxStyleSearch" TargetType="p:AutoscrollListBox">
                <Setter Property="ItemContainerStyle" Value="{StaticResource ListBoxItemStyleSearch}" />
                <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled" />
                <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Disabled" />
                <Setter Property="BorderBrush" Value="Transparent" />
                <Setter Property="Background" Value="Transparent" />
            </Style>

            <Style x:Key="ListBoxStyle_INDX" TargetType="p:AutoscrollListBox" BasedOn="{StaticResource ListBoxStyleSearch}">
                <Setter Property="ItemContainerStyle">
                    <Setter.Value>
                        <Style TargetType="ListBoxItem" BasedOn="{StaticResource ListBoxItemStyleSearch}">
                            <Setter Property="Padding" Value="1" />
                        </Style>
                    </Setter.Value>
                </Setter>
            </Style>
        </ResourceDictionary>
    </UserControl.Resources>

    <Grid>
        <Viewbox HorizontalAlignment="Left">
            <p:AutoscrollListBox Name="Index" Style="{StaticResource ListBoxStyle_INDX}" Visibility="{Binding IndexVisibility}" />
        </Viewbox>

        <p:AutoscrollListBox Name="Items" Style="{StaticResource ListBoxStyle_GAME}" />
    </Grid>
</UserControl>

【问题讨论】：

我在您的 XAML 中找不到 MarqueeTextBlock。只有大量的样式。你的意思是ListBoxItem.IsSelected？ ListBox 没有这样的属性。
MarqueeTextBlock 由TargetType="p:MarqueeTextBlock" 调用。不确定是否可以将其添加到<Trigger Property="IsSelected" Value="True" /> 下的TargetType="{x:Type ListBoxItem}" 部分。 This 是修剪文本后的样子，但我正在尝试对其进行 p:MarqueeTextBlock 效果，因此当它被选中时，您可以看到其余的文本。
样式AOTbMain_MARQUEE 只能应用于MarqueeTextBlock 的实例。您必须在某个时候将其添加到可视化树中。你希望它出现在哪里？如果它应该是ListBoxItem 的一部分，则将其添加到那里。你希望它在哪里？
这就是我的答案应该做的。
如果我能提供帮助，请告诉我。

标签： c# wpf xaml data-binding wpf-controls

【解决方案1】：

以下Style 将AutoscrollListBox 显示为DataTemplate 的内容。一旦选择了ListBoxItem，它将改为显示MarqueeTextBlock。如果未选中，它将切换回AutoscrollListBox。

解决方案 1

<Grid>
  <AutoscrollListBox Name="Items" >
    <AutoscrollListBox.ItemTemplate>
      <DataTemplate>
        <DataTemplate.Resources>
          <AutoscaleTextBlock x:Key="AutoscaleTextBlock" 
                              Text="{Binding Title}" 
                              Style="{StaticResource ListBoxStyle_BASETB}"
                              x:Shared="False" />
          <MarqueeTextBlock x:Key="MarqueeTextBlock"
                            Text="{Binding Title}"                           
                            Style="{StaticResource AOTbMain_MARQUEE}"
                            x:Shared="False" />
        </DataTemplate.Resources>

        <ContentControl x:Name="ContentPresenter" />

        <DataTemplate.Triggers>
          <DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=ListBoxItem}, Path=IsSelected}" 
                       Value="False">
            <Setter TargetName="ContentPresenter" 
                    Property="Content" 
                    Value="{StaticResource AutoscaleTextBlock}"/>
          </DataTrigger>
          <DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=ListBoxItem}, Path=IsSelected}" 
                       Value="True">
            <Setter TargetName="ContentPresenter" 
                    Property="Content" 
                    Value="{StaticResource MarqueeTextBlock}"/>
          </DataTrigger>
        </DataTemplate.Triggers>
      </DataTemplate>
    </AutoscrollListBox.ItemTemplate>
  </AutoscrollListBox>
</Grid>

解决方案 2
如果您正在使用嵌套资源字典并且无法应用 x:Shared 属性，您可以直接从 Trigger 交换控件：

<Grid>
  <AutoscrollListBox Name="Items" >
    <AutoscrollListBox.ItemTemplate>
      <DataTemplate>
        <ContentControl x:Name="ContentPresenter" />

        <DataTemplate.Triggers>
          <DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=ListBoxItem}, Path=IsSelected}" 
                       Value="False">
            <Setter TargetName="ContentPresenter" 
                    Property="Content">
              <Setter.Value>
                <AutoscaleTextBlock Text="{Binding Title}"                           
                                    Style="{StaticResource AOTbMain_MARQUEE}" />
               </Setter.Value>
             </Setter>
          </DataTrigger>
          <DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=ListBoxItem}, Path=IsSelected}" 
                       Value="True">
            <Setter TargetName="ContentPresenter" 
                    Property="Content">
              <Setter.Value>
                <MarqueeTextBlock Text="{Binding Title}"                           
                                  Style="{StaticResource AOTbMain_MARQUEE}"/>
               </Setter.Value>
             </Setter>
          </DataTrigger>
        </DataTemplate.Triggers>
      </DataTemplate>
    </AutoscrollListBox.ItemTemplate>
  </AutoscrollListBox>
</Grid>

解决方案 3
或切换Visibility：

<Grid>
  <AutoscrollListBox Name="Items" >
    <AutoscrollListBox.ItemTemplate>
      <DataTemplate>
        <Grid>
          <AutoscaleTextBlock x:Name="AutoscaleTextBlock" 
                              Text="{Binding Title}"                           
                              Style="{StaticResource AOTbMain_MARQUEE}"
                              Visibilty="Visible" />
           <MarqueeTextBlock x:Name="MarqueeTextBlock" 
                             Text="{Binding Title}"                           
                             Style="{StaticResource AOTbMain_MARQUEE}"
                             Visibilty="Collapsed" />
        </Grid>

        <DataTemplate.Triggers>
          <DataTrigger Binding="{Binding RelativeSource={RelativeSource FindAncestor, AncestorType=ListBoxItem}, Path=IsSelected}" 
                       Value="True">
            <Setter TargetName="AutoscaleTextBlock" 
                    Property="Visibility"
                    Value="Collapsed" />
            <Setter TargetName="MarqueeTextBlock" 
                    Property="Visibility"
                    Value="Visible" />
          </DataTrigger>
        </DataTemplate.Triggers>
      </DataTemplate>
    </AutoscrollListBox.ItemTemplate>
  </AutoscrollListBox>
</Grid>

【讨论】：

评论不用于扩展讨论；这个对话是moved to chat。
感谢您抽出宝贵时间帮我解决这个问题！
我很乐意提供帮助。你看起来不错。如果您需要更多帮助，请告诉我。我不确定 Visual Studio 2019 社区是否仍然免费。但是 2017 年是免费的。如果它仍然免费，您应该尝试一下。特别是对于 WPF 和 XAML，您可以获得更多的生产力支持，例如非常有用的代码建议。也许你试一试。