#wpf #wpf-controls
#wpf #wpf-элементы управления
Вопрос:
Есть ли элемент управления, который я могу использовать для навигации / выбора, подобный тому, что находится в разделе Параметры Outlook (левое «меню») в WPF? Или мне нужно изменить tabcontrol или что-то в этом роде, и если да, есть ли пример, чтобы он выглядел как параметры Outlook?
Ответ №1:
В итоге я изменил стиль ListBox , вот код:
<Grid x:Name="layoutRoot">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100" />
<ColumnDefinition Width="5" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<ListBox>
<ListBox.Resources>
<LinearGradientBrush x:Key="MouseOverBrush" EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFFFFFFF" Offset="0" />
<GradientStop Color="#FFFEF3B5" Offset="0.318" />
<GradientStop Color="#FFFFEB70" Offset="0.488" />
<GradientStop Color="#FFFFE48A" Offset="0.502" />
<GradientStop Color="#FFFFD932" Offset="0.834" />
<GradientStop Color="#FFFFF48B" Offset="1" />
</LinearGradientBrush>
<LinearGradientBrush x:Key="MouseOverBorderBrush" EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFEEE8CF" Offset="0" />
<GradientStop Color="#FFC4AF8C" Offset="0.536" />
<GradientStop Color="#FFDCD1BF" Offset="1" />
</LinearGradientBrush>
<LinearGradientBrush x:Key="PressedBrush" EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFC3BCAE" Offset="0" />
<GradientStop Color="#FFFFE48A" Offset="0.046" />
<GradientStop Color="#FFFFE48A" Offset="0.452" />
<GradientStop Color="#FFFFE48A" Offset="0.461" />
<GradientStop Color="#FFFFD932" Offset="0.724" />
<GradientStop Color="#FFFFF48B" Offset="1" />
</LinearGradientBrush>
<LinearGradientBrush x:Key="PressedBorderBrush" EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFC2762B" Offset="0" />
<GradientStop Color="#FFC29E47" Offset="1" />
</LinearGradientBrush>
<SolidColorBrush x:Key="DisabledForegroundBrush" Color="#888" />
<Style TargetType="{x:Type ListBox}">
<Setter Property="BorderBrush" Value="{DynamicResource {x:Static SystemColors.ActiveBorderBrushKey}}"/>
<Setter Property="Padding" Value="1"/>
</Style>
<Style TargetType="ListBoxItem">
<Setter Property="FocusVisualStyle" Value="{x:Null}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBoxItem">
<Border x:Name="OuterBorder" Margin="1" BorderThickness="1" CornerRadius="3" BorderBrush="Transparent" Background="Transparent">
<Border x:Name="InnerBorder" BorderThickness="1" CornerRadius="2" BorderBrush="Transparent" Background="Transparent">
<ContentPresenter x:Name="Content" Margin="10,3,10,3" />
</Border>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsEnabled" Value="False">
<Setter Property="Foreground" Value="{DynamicResource DisabledForegroundBrush}" />
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="OuterBorder" Property="BorderBrush" Value="{DynamicResource MouseOverBorderBrush}" />
<Setter TargetName="OuterBorder" Property="Background" Value="{DynamicResource MouseOverBrush}" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="True" />
<Condition Property="IsMouseOver" Value="False" />
</MultiTrigger.Conditions>
<Setter TargetName="OuterBorder" Property="BorderBrush" Value="{DynamicResource PressedBorderBrush}" />
<Setter TargetName="OuterBorder" Property="Background" Value="{DynamicResource PressedBrush}" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="True" />
<Condition Property="IsMouseOver" Value="True" />
</MultiTrigger.Conditions>
<Setter TargetName="OuterBorder" Property="BorderBrush" Value="{DynamicResource PressedBorderBrush}" />
<Setter TargetName="OuterBorder" Property="Background" Value="{DynamicResource PressedBrush}" />
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ListBox.Resources>
<ListBoxItem IsSelected="True">Item 1</ListBoxItem>
<ListBoxItem>Item 2</ListBoxItem>
<ListBoxItem>Itme 3</ListBoxItem>
<ListBoxItem>Item 4</ListBoxItem>
<ListBoxItem>Item 5</ListBoxItem>
<ListBoxItem IsEnabled="False">
<Separator Margin="-5,0,-5,0" />
</ListBoxItem>
<ListBoxItem>Item 6</ListBoxItem>
<ListBoxItem IsEnabled="False">Item 7</ListBoxItem>
<ListBoxItem>Item 8</ListBoxItem>
<ListBoxItem>Item 9</ListBoxItem>
</ListBox>
<Border Grid.Column="2" BorderBrush="{DynamicResource {x:Static SystemColors.ActiveBorderBrushKey}}" BorderThickness="1">
<Grid></Grid>
</Border>
</Grid>
Ответ №2:
Это элемент управления WPF, который инкапсулирует функциональность панели навигации MS Outlook.
Взгляните на эту ссылку http://navigationpane.codeplex.com/Он полностью поддерживает стиль WPF, поэтому вы можете стилизовать его под свои собственные графические предпочтения, если вы художник по натуре. Он поставляется со стилем по умолчанию, который больше похож на Outllok 2010.
Комментарии:
1. Это не очень похоже на навигацию внутри окна параметров в Outlook 2010, и это то, что я ищу. Если мне нужно изменить стиль, вероятно, было бы проще использовать элемент управления tab.
2. Вы можете увидеть навигацию, которую я ищу, на этом изображении: ссылка