Question

对不起，标题措辞严厉，如果必须改变它，但这就是我想要实现的目标。

我设计了一个组合框并添加了一些项目：

当选择某个项目时，我希望仅在显示整个内容时显示标题：

我一直在使用标签来定义带有文字的文本块＆＃34;标题＆＃34;作为标题和显示然而它无法正常工作:(。

这是app.xaml中的XAML样式，我还没有放入资源字典，因为我只是在测试：

<Application x:Class="WpfApplication14.App"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:local="clr-namespace:WpfApplication14"
         StartupUri="MainWindow.xaml">
<Application.Resources>



    <ControlTemplate x:Key="ComboBoxToggleButton" TargetType="{x:Type ToggleButton}">
        <Grid Height="50" Width="200">
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition Width="50" />
            </Grid.ColumnDefinitions>

            <Border x:Name="NormalBorder" 
                                Background="#FF4F4F4F"
                                Grid.ColumnSpan="2"
                                BorderBrush="White"
                                BorderThickness="1.5"
                                CornerRadius="10,10,10,10" 
                            />
            <Border x:Name="MouseOverBorder"
                                Background="#737373"
                                BorderBrush="White"
                                Grid.ColumnSpan="2"
                                BorderThickness="1.5" 
                                CornerRadius="10,10,10,10"
                                Opacity="0"
                            />
            <Border x:Name="PressedBorder"
                                Background="#262626"
                                Grid.ColumnSpan="2"
                                CornerRadius="10,10,10,10"
                                Opacity="0"
                                />
            <Path 
              x:Name="Arrow"
              Grid.Column="1"     
              Fill="White"
              HorizontalAlignment="Center"
              VerticalAlignment="Center"
              Data="M0,0 L0,2 L4,6 L8,2 L8,0 L4,4 z"
            />

            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">

                    <VisualStateGroup.Transitions>

                        <VisualTransition From="Normal" To="MouseOver" GeneratedDuration="0:0:0.15"/>
                        <VisualTransition From="MouseOver" To="Normal" GeneratedDuration="0:0:0.15"/>
                        <VisualTransition From="Normal" To="Checked" GeneratedDuration="0:0:0.05"/>
                        <VisualTransition From="Checked" To="MouseOver" GeneratedDuration="0:0:0.05"/>
                        <VisualTransition From="MouseOver" To="Checked" GeneratedDuration="0:0:0.05"/>
                    </VisualStateGroup.Transitions>

                    <VisualState x:Name="Normal" />

                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="MouseOverBorder" Storyboard.TargetProperty="Opacity">

                                <EasingDoubleKeyFrame Value="1" KeyTime="0:0:0.15"/>

                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>

                    <VisualState x:Name="Checked">
                        <Storyboard>
                            <DoubleAnimationUsingKeyFrames Storyboard.TargetName="PressedBorder" Storyboard.TargetProperty="Opacity">
                                <EasingDoubleKeyFrame Value="1" KeyTime="0:0:0.05"/>
                            </DoubleAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>

                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>

        </Grid>
    </ControlTemplate>


    <Style x:Key="ComboBox" TargetType="ComboBox">

        <Setter Property="Foreground" Value="White"/>

        <Setter Property="Template">

            <Setter.Value>

                <ControlTemplate TargetType="ComboBox">

                    <Grid Height="50" Width="200">

                        <ToggleButton 
                                Name="ToggleButton" 
                                Template="{StaticResource ComboBoxToggleButton}" 
                                Grid.Column="2" 
                             Focusable="false"
                                IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
                                ClickMode="Press">
                        </ToggleButton>

                        <ContentPresenter x:Name="Content" Content="{TemplateBinding SelectionBoxItem}" Margin="5,0,0,0" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Center"/>

                        <Popup 
                        Name="Popup"
                        Placement="Bottom"
                        IsOpen="{TemplateBinding IsDropDownOpen}"
                        AllowsTransparency="True" 
                        Focusable="False"
                            Height="400" Width="190"
                        PopupAnimation="Slide">

                            <Grid Name="DropDown"
                          SnapsToDevicePixels="True">
                                <Border 
                            x:Name="DropDownBorder"
                            Background="#FF3F3F3F"

                            BorderThickness="1"
                            BorderBrush="#888888"/>
                                <ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True">
                                    <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" />
                                </ScrollViewer>
                            </Grid>
                        </Popup>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <Style TargetType="ComboBoxItem" x:Key="ComboBoxItem">

        <Setter Property="Foreground" Value="White"/>
        <Setter Property="Background" Value="#262626"/>
        <Setter Property="Height" Value="50"/>
        <Setter Property="Width" Value="200"/>

        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ComboBoxItem">
                    <Grid Height="50" Width="200" Margin="0,2,0,2">

                        <Border x:Name="DropDownNormalBorder"
                            Background="{TemplateBinding Background}"
                                Height="50" Width="200"
                                />

                        <Border x:Name="DropDownMouseOverBorder"
                                Background="#808080"
                                Grid.ColumnSpan="2"
                                Opacity="0"
                            />


                        <ContentPresenter HorizontalAlignment="Left" VerticalAlignment="Center" />

                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">

                                <VisualStateGroup.Transitions>

                                    <VisualTransition From="Normal" To="MouseOver" GeneratedDuration="0:0:0.15"/>
                                    <VisualTransition From="MouseOver" To="Normal" GeneratedDuration="0:0:0.15"/>
                                </VisualStateGroup.Transitions>


                                <VisualState x:Name="Normal" />

                                <VisualState x:Name="MouseOver">
                                    <Storyboard>
                                        <DoubleAnimationUsingKeyFrames Storyboard.TargetName="DropDownMouseOverBorder" Storyboard.TargetProperty="Opacity">

                                            <EasingDoubleKeyFrame Value="1" KeyTime="0:0:0.15"/>

                                        </DoubleAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>

                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>

                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

</Application.Resources>

这是mainwindow.xaml，组合框项目在上面的屏幕截图中重复了四次：

<Window x:Class="WpfApplication14.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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfApplication14"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">
<Grid Background="Black">

    <ComboBox Style="{DynamicResource ComboBox}" Height="50" Width="200">

        <ComboBoxItem Style="{DynamicResource ComboBoxItem}">
            <Grid>
                <StackPanel Orientation="Horizontal">
                    <Image Source="C:\Users\ceefax\Documents\Visual Studio 2015\Projects\WpfApplication14\WpfApplication14\spanner-clip-art.png"
                       Height="40" Width="40" />

                    <StackPanel Orientation="Vertical" Margin="5,0,0,0">
                        <TextBlock FontWeight="Bold">Title</TextBlock>
                        <TextBlock>Content</TextBlock>
                    </StackPanel>
                </StackPanel>
            </Grid>
        </ComboBoxItem>

    </ComboBox>

</Grid>

Answer 1

您可以使用Combined Template。

<Window x:Class="WpfApplication14.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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfApplication14"
    mc:Ignorable="d"
    Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <ResourceDictionary>
            <DataTemplate x:Key="NormalItemTemplate" >
                <Grid>
                    <StackPanel Orientation="Horizontal">
                        <Image Source="C:\Users\ceefax\Documents\Visual Studio 2015\Projects\WpfApplication14\WpfApplication14\spanner-clip-art.png"
                               Height="40" Width="40" />
                        <StackPanel Orientation="Vertical" Margin="5,0,0,0">
                            <TextBlock FontWeight="Bold">Title</TextBlock>
                            <TextBlock>Content</TextBlock>
                        </StackPanel>
                    </StackPanel>
                </Grid>
            </DataTemplate>
            <DataTemplate x:Key="SelectionBoxTemplate" >
                <Grid>
                    <StackPanel Orientation="Horizontal">
                        <Image Source="C:\Users\ceefax\Documents\Visual Studio 2015\Projects\WpfApplication14\WpfApplication14\spanner-clip-art.png"
                               Height="40" Width="40" />
                        <StackPanel Orientation="Vertical" Margin="5,0,0,0">
                            <TextBlock FontWeight="Bold">Title</TextBlock>
                        </StackPanel>
                    </StackPanel>
                </Grid>
            </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 SelectionBoxTemplate}" />
                    </DataTrigger>
                </DataTemplate.Triggers>
            </DataTemplate>
        </ResourceDictionary>
    </Window.Resources>
    <Grid Background="Black">
        <ComboBox ItemsSource="{Binding Items}" SelectedItem="{Binding Item}"
                  ItemTemplate="{StaticResource CombinedTemplate}"
                  Height="50" Width="200">
        </ComboBox>
    </Grid>
</Window>

注意绑定项目和项目。

在组合框中显示组合框中的一个元素

1 个答案: