0
Мне очень жаль, что заголовок плохо сформулирован и, если нужно, измените его, но этого я и пытаюсь достичь.Отображение одного элемента в combobox из comboboxitems
Я стилизованных выпадающий и добавлены некоторые элементы:
Когда элемент выбран, я хочу только название, которое будет отображаться, в данный момент отображается весь контент:
Я играл с помощью тегов, чтобы определить текстовый блок с текстом «Заголовок» в качестве заголовка и отображения, что, однако, он не работает :(.
Вот XAML Стилизация в app.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>