I have a TreeView which is bind to a list of objects:
when I have no theme
treeItem.DisplayMemberPath = "Name"
works well, but when I apply the theme like “BubbleCreme.xaml” instead of “Name” I have “System.DataEntity.DynamicProxies.food45484545…” in my TreeView
Here is the treeView Style in the theme if needed
<!-- Treeview -->
<Style x:Key="{x:Type TreeView}" TargetType="{x:Type TreeView}">
<Setter Property="Background" Value="{StaticResource PrimaryBrush}" />
<Setter Property="Foreground" Value="{StaticResource TextBrush}" />
<Setter Property="HorizontalContentAlignment" Value="Left" />
<Setter Property="VerticalContentAlignment" Value="Top" />
<Setter Property="Cursor" Value="Arrow" />
<Setter Property="BorderThickness" Value="1.5,1.5,.75,.75" />
<Setter Property="Padding" Value="1" />
<Setter Property="BorderBrush">
<Setter.Value>
<LinearGradientBrush EndPoint="0.5,1.5" StartPoint="0.5,0">
<GradientStop Color="{StaticResource SecondaryColor}" />
<GradientStop Color="{StaticResource PrimaryColor}" Offset="1" />
</LinearGradientBrush>
</Setter.Value>
</Setter>
<Setter Property="IsTabStop" Value="False" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TreeView}">
<Border x:Name="Root" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" CornerRadius="4">
<Grid>
<Grid x:Name="InnerShadow" Opacity="0.25" Margin="-1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="6" />
<ColumnDefinition />
<ColumnDefinition Width="6" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="6" />
<RowDefinition />
<RowDefinition Height="6" />
</Grid.RowDefinitions>
<Border Background="{StaticResource SecondaryBrush}" CornerRadius="2.5,0,0,0">
<Border.OpacityMask>
<RadialGradientBrush>
<RadialGradientBrush.RelativeTransform>
<TransformGroup>
<ScaleTransform CenterX="0.5" CenterY="0.5" ScaleX="2" ScaleY="2" />
<TranslateTransform X="0.5" Y="0.5" />
</TransformGroup>
</RadialGradientBrush.RelativeTransform>
<GradientStop />
<GradientStop Color="#FFFFFFFF" Offset="1" />
</RadialGradientBrush>
</Border.OpacityMask>
</Border>
<Border Background="{StaticResource SecondaryBrush}" Grid.Column="1">
<Border.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFFFFFFF" Offset="0" />
<GradientStop Offset="1" />
</LinearGradientBrush>
</Border.OpacityMask>
</Border>
<Border Background="{StaticResource SecondaryBrush}" Grid.Column="2" CornerRadius="0,2.5,0,0">
<Border.OpacityMask>
<RadialGradientBrush>
<RadialGradientBrush.RelativeTransform>
<TransformGroup>
<ScaleTransform CenterX="0.5" CenterY="0.5" ScaleX="2" ScaleY="2" />
<TranslateTransform X="-0.5" Y="0.5" />
</TransformGroup>
</RadialGradientBrush.RelativeTransform>
<GradientStop />
<GradientStop Color="#FFFFFFFF" Offset="1" />
</RadialGradientBrush>
</Border.OpacityMask>
</Border>
<Border Background="{StaticResource SecondaryBrush}" Grid.Row="1">
<Border.OpacityMask>
<LinearGradientBrush EndPoint="1,.5" StartPoint="0,.5">
<GradientStop Color="#00000000" Offset="1" />
<GradientStop Color="#FFFFFFFF" Offset="0" />
</LinearGradientBrush>
</Border.OpacityMask>
</Border>
<Border Background="{StaticResource SecondaryBrush}" Grid.Column="1" Grid.Row="1" OpacityMask="#00000000" />
<Border Background="{StaticResource SecondaryBrush}" Grid.Column="2" Grid.Row="1">
<Border.OpacityMask>
<LinearGradientBrush EndPoint="1,.5" StartPoint="0,.5">
<GradientStop Color="#FF000000" Offset="1" />
<GradientStop Color="#00FFFFFF" Offset="0" />
</LinearGradientBrush>
</Border.OpacityMask>
</Border>
<Border Background="{StaticResource SecondaryBrush}" Grid.Row="2" CornerRadius="0,0,0,2.5">
<Border.OpacityMask>
<RadialGradientBrush>
<RadialGradientBrush.RelativeTransform>
<TransformGroup>
<ScaleTransform CenterX="0.5" CenterY="0.5" ScaleX="2" ScaleY="2" />
<TranslateTransform X="0.5" Y="-0.5" />
</TransformGroup>
</RadialGradientBrush.RelativeTransform>
<GradientStop />
<GradientStop Color="#FFFFFFFF" Offset="1" />
</RadialGradientBrush>
</Border.OpacityMask>
</Border>
<Border Background="{StaticResource SecondaryBrush}" Grid.Column="1" Grid.Row="2">
<Border.OpacityMask>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#00000000" Offset="0" />
<GradientStop Color="#FFFFFFFF" Offset="1" />
</LinearGradientBrush>
</Border.OpacityMask>
</Border>
<Border Background="{StaticResource SecondaryBrush}" Grid.Column="2" Grid.Row="2" CornerRadius="0,0,2.5,0">
<Border.OpacityMask>
<RadialGradientBrush>
<RadialGradientBrush.RelativeTransform>
<TransformGroup>
<ScaleTransform CenterX="0.5" CenterY="0.5" ScaleX="2" ScaleY="2" />
<TranslateTransform X="-0.5" Y="-0.5" />
</TransformGroup>
</RadialGradientBrush.RelativeTransform>
<GradientStop />
<GradientStop Color="#FFFFFFFF" Offset="1" />
</RadialGradientBrush>
</Border.OpacityMask>
</Border>
</Grid>
<ScrollViewer x:Name="ScrollViewer" Background="{x:Null}" BorderBrush="Transparent" BorderThickness="0" IsTabStop="False" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
<ItemsPresenter Margin="5" x:Name="TreeItems" />
</ScrollViewer>
</Grid>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- TreeviewItem -->
<Style x:Key="{x:Type TreeViewItem}" TargetType="{x:Type TreeViewItem}">
<Setter Property="Padding" Value="3" />
<Setter Property="HorizontalContentAlignment" Value="Left" />
<Setter Property="VerticalContentAlignment" Value="Top" />
<Setter Property="Background" Value="Transparent" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="BorderBrush" Value="{StaticResource PrimaryBrush}" />
<Setter Property="Cursor" Value="Arrow" />
<Setter Property="IsTabStop" Value="True" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type TreeViewItem}">
<Grid Background="{x:Null}" x:Name="Root">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="Disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="Header" Storyboard.TargetProperty="Foreground">
<DiscreteObjectKeyFrame KeyTime="0" Value="#FF999999" />
</ObjectAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Duration="00:00:00.001" Storyboard.TargetName="Root" Storyboard.TargetProperty="(UIElement.Opacity)">
<SplineDoubleKeyFrame KeyTime="0" Value="0.75" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="15" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid Grid.Column="1" Opacity="0" x:Name="grid">
<Border x:Name="Background" CornerRadius="12" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness=".5,0.5,1,1">
<Border.Background>
<LinearGradientBrush EndPoint="0.5,1.75" StartPoint="0.5,-.5">
<GradientStop Color="{StaticResource SecondaryColor}" Offset="0" />
<GradientStop Color="{StaticResource PrimaryColor}" Offset=".01" />
<GradientStop Color="{StaticResource PrimaryColor}" Offset=".3" />
<GradientStop Color="{StaticResource SecondaryColor}" Offset="1" />
</LinearGradientBrush>
</Border.Background>
</Border>
<Border x:Name="Halo" CornerRadius="12" Opacity=".65" Background="{StaticResource SecondaryBrush}" OpacityMask="{StaticResource HaloMask}" />
</Grid>
<ToggleButton IsChecked="{Binding Path=IsExpanded, RelativeSource={RelativeSource TemplatedParent}}" ClickMode="Press" HorizontalAlignment="Stretch" x:Name="Expander" VerticalAlignment="Stretch" IsTabStop="False">
<ToggleButton.Template>
<ControlTemplate TargetType="ToggleButton">
<Grid x:Name="Root" Background="Transparent">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="MouseOver">
<Storyboard>
<DoubleAnimationUsingKeyFrames Duration="00:00:00.001" Storyboard.TargetName="Border" Storyboard.TargetProperty="(Shape.StrokeThickness)">
<SplineDoubleKeyFrame KeyTime="0" Value="1.25" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Disabled">
<Storyboard>
<DoubleAnimation Duration="0" Storyboard.TargetName="Root" Storyboard.TargetProperty="Opacity" To=".7" />
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="CheckStates">
<VisualState x:Name="Unchecked" />
<VisualState x:Name="Checked">
<Storyboard>
<DoubleAnimationUsingKeyFrames Duration="00:00:00.001" Storyboard.TargetName="grid" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(RotateTransform.Angle)">
<SplineDoubleKeyFrame KeyTime="0" Value="45" />
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Duration="00:00:00.001" Storyboard.TargetName="Arrow" Storyboard.TargetProperty="(UIElement.Opacity)">
<SplineDoubleKeyFrame KeyTime="0" Value="1" />
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Duration="00:00:00.001" Storyboard.TargetName="Border" Storyboard.TargetProperty="(UIElement.Opacity)">
<SplineDoubleKeyFrame KeyTime="0" Value="0" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid HorizontalAlignment="Right" Margin="2 2 5 2">
<Grid x:Name="grid" HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin=".25,.8" Height="10" Width="5">
<Grid.RenderTransform>
<TransformGroup>
<RotateTransform />
</TransformGroup>
</Grid.RenderTransform>
<Path x:Name="Arrow" Stroke="{x:Null}" StrokeLineJoin="Miter" StrokeThickness=".75" Data="M 0,0 L 0,10 L 5,5 Z" Fill="{StaticResource TextBrush}" Opacity="0" />
<Path x:Name="Border" Stroke="{StaticResource TextBrush}" StrokeLineJoin="Miter" StrokeThickness=".75" Data="M 0,0 L 0,10 L 5,5 Z" Fill="{x:Null}" />
</Grid>
</Grid>
</Grid>
</ControlTemplate>
</ToggleButton.Template>
</ToggleButton>
<Button Cursor="{TemplateBinding Cursor}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" x:Name="Header" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Background="{TemplateBinding Background}" Foreground="{TemplateBinding Foreground}" IsTabStop="False" Grid.Column="1" ClickMode="Hover" Content="{TemplateBinding Header}" ContentTemplate="{TemplateBinding HeaderTemplate}" Padding="8,3,8,3">
<Button.Template>
<ControlTemplate TargetType="Button">
<Grid Background="{TemplateBinding Background}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="Pressed">
<Storyboard>
<DoubleAnimation Duration="0" Storyboard.TargetName="hover" Storyboard.TargetProperty="Opacity" To=".5" />
</Storyboard>
</VisualState>
<VisualState x:Name="Disabled">
<Storyboard>
<DoubleAnimation Duration="0" Storyboard.TargetName="content" Storyboard.TargetProperty="Opacity" To=".55" />
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid x:Name="hover" Opacity="0">
<Border x:Name="Background" CornerRadius="12" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness=".5,0.5,1,1">
<Border.Background>
<LinearGradientBrush EndPoint="0.5,1.75" StartPoint="0.5,-.5">
<GradientStop Color="{StaticResource SecondaryColor}" Offset="0" />
<GradientStop Color="{StaticResource PrimaryColor}" Offset=".01" />
<GradientStop Color="{StaticResource PrimaryColor}" Offset=".3" />
<GradientStop Color="{StaticResource SecondaryColor}" Offset="1" />
</LinearGradientBrush>
</Border.Background>
</Border>
<Border x:Name="Halo" CornerRadius="12" Opacity=".65" Background="{StaticResource SecondaryBrush}" OpacityMask="{StaticResource HaloMask}" />
</Grid>
<ContentPresenter Cursor="{TemplateBinding Cursor}" HorizontalAlignment="Left" Margin="{TemplateBinding Padding}" x:Name="content" Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" />
</Grid>
</ControlTemplate>
</Button.Template>
</Button>
<ItemsPresenter x:Name="ItemsHost" Visibility="Visible" Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="1" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsExpanded" Value="false">
<Setter Property="Visibility" Value="Collapsed" TargetName="ItemsHost" />
</Trigger>
<Trigger Property="HasItems" Value="false">
<Setter Property="Visibility" Value="Hidden" TargetName="Expander" />
</Trigger>
<Trigger Property="IsMouseOver" Value="True">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<!--<DoubleAnimation Duration="00:00:00.3" Storyboard.TargetName="MouseOverGrid" Storyboard.TargetProperty="Opacity" To="0.25" />-->
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<!--<DoubleAnimation Duration="00:00:00.3" Storyboard.TargetName="MouseOverGrid" Storyboard.TargetProperty="Opacity" To="0" />-->
</Storyboard>
</BeginStoryboard>
</Trigger.ExitActions>
</Trigger>
<Trigger Property="IsSelected" Value="true">
<Trigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimationUsingKeyFrames Duration="00:00:00.001" Storyboard.TargetName="grid" Storyboard.TargetProperty="(UIElement.Opacity)">
<SplineDoubleKeyFrame KeyTime="0" Value="1" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</Trigger.EnterActions>
<Trigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimationUsingKeyFrames Duration="00:00:00.001" Storyboard.TargetName="grid" Storyboard.TargetProperty="(UIElement.Opacity)">
<SplineDoubleKeyFrame KeyTime="0" Value="0" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</Trigger.ExitActions>
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsSelected" Value="true" />
<Condition Property="IsSelectionActive" Value="false" />
</MultiTrigger.Conditions>
<MultiTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<!--<DoubleAnimation Duration="0" Storyboard.TargetName="MouseOverGrid" Storyboard.TargetProperty="Opacity" To="0.5" />-->
</Storyboard>
</BeginStoryboard>
</MultiTrigger.EnterActions>
<MultiTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<!--<DoubleAnimation Duration="00:00:00.3" Storyboard.TargetName="MouseOverGrid" Storyboard.TargetProperty="Opacity" To="0" />-->
</Storyboard>
</BeginStoryboard>
</MultiTrigger.ExitActions>
</MultiTrigger>
<Trigger Property="IsEnabled" Value="false">
<Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
Related
When a datagrid row is expanded to show the Row Details, is there a way to change the colour of the very left most portion, that inherits the colouring from the parent row?
i.e. this bit: Row Details
I managed to work it out. The "Main" border being used to colour the normal/alternating row cells, and then a second sub border that handles the events - in this case for Selected/MouseOver_Selected.
Note: The Cyan was because I was testing, it is not a colour scheme choice!!! :-P
EDIT:
I have added some additional code, and another Border - I am then using ControlTemplate.Triggers set on multi to preserve the alternating row colours on a standard mouseover, thereby bypassing the visual state mouseover event entirely.
The overall result is to preserves my alternating colouring at all times - except when the row is selected, at which point I am dictating the colouring for the selected row and the row details.
<Style x:Key="GridRow"
TargetType="{x:Type DataGridRow}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type DataGridRow}">
<Border x:Name="NormalBorder"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
SnapsToDevicePixels="True">
<Border.Background>
<LinearGradientBrush EndPoint="0.5,1"
StartPoint="0.5,0">
<GradientStop Color="Transparent" />
<GradientStop Color="Transparent"
Offset="1" />
</LinearGradientBrush>
</Border.Background>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="NormalBorder"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0"
Value="Black" />
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="NormalBorder"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0"
Value="#BF322828" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Normal_AlternatingRow">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="NormalBorder"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0"
Value="Black" />
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="NormalBorder"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0"
Value="#BF642828" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="MouseOver" />
<VisualState x:Name="Normal_Selected">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="EventBorder"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0"
Value="Green" />
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="EventBorder"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0"
Value="Green" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="MouseOver_Selected">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="EventBorder"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[0].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0"
Value="Green" />
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="EventBorder"
Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0"
Value="Green" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Normal_Editing" />
<VisualState x:Name="MouseOver_Editing" />
<VisualState x:Name="MouseOver_Unfocused_Editing" />
<VisualState x:Name="Unfocused_Editing" />
<VisualState x:Name="Unfocused_Selected" />
<VisualState x:Name="MouseOver_Unfocused_Selected" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Border x:Name="EventBorder"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
SnapsToDevicePixels="True">
<Border.Background>
<LinearGradientBrush EndPoint="0.5,1"
StartPoint="0.5,0">
<GradientStop Color="Transparent" />
<GradientStop Color="Transparent"
Offset="1" />
</LinearGradientBrush>
</Border.Background>
<Border x:Name="AnotherBorder"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
SnapsToDevicePixels="True">
<Border.Background>
<LinearGradientBrush EndPoint="0.5,1"
StartPoint="0.5,0">
<GradientStop Color="Transparent" />
<GradientStop Color="Transparent"
Offset="1" />
</LinearGradientBrush>
</Border.Background>
<SelectiveScrollingGrid>
<SelectiveScrollingGrid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</SelectiveScrollingGrid.ColumnDefinitions>
<SelectiveScrollingGrid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</SelectiveScrollingGrid.RowDefinitions>
<DataGridCellsPresenter Grid.Column="1"
ItemsPanel="{TemplateBinding ItemsPanel}"
SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
<DataGridDetailsPresenter Grid.Column="1"
Grid.Row="1"
Visibility="{TemplateBinding DetailsVisibility}"
SelectiveScrollingGrid.SelectiveScrollingOrientation="{Binding AreRowDetailsFrozen, ConverterParameter={x:Static SelectiveScrollingOrientation.Vertical},
Converter={x:Static DataGrid.RowDetailsScrollingConverter},
RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" />
<DataGridRowHeader Grid.RowSpan="1"
SelectiveScrollingGrid.SelectiveScrollingOrientation="Vertical"
Visibility="{Binding HeadersVisibility,
ConverterParameter={x:Static DataGridHeadersVisibility.Row},
Converter={x:Static DataGrid.HeadersVisibilityConverter},
RelativeSource={RelativeSource AncestorType={x:Type DataGrid}}}" />
</SelectiveScrollingGrid>
</Border>
</Border>
</Border>
<ControlTemplate.Triggers>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver"
Value="True" />
<Condition Property="IsSelected"
Value="False" />
<Condition Property="AlternationIndex"
Value="0" />
</MultiTrigger.Conditions>
<Setter Property="Background"
TargetName="AnotherBorder">
<Setter.Value>
<LinearGradientBrush EndPoint="0.5,1"
StartPoint="0.5,0">
<GradientStop Color="Black" />
<GradientStop Color="#BF322828"
Offset="1" />
</LinearGradientBrush>
</Setter.Value>
</Setter>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver"
Value="True" />
<Condition Property="IsSelected"
Value="False" />
<Condition Property="AlternationIndex"
Value="1" />
</MultiTrigger.Conditions>
<Setter Property="Background"
TargetName="AnotherBorder">
<Setter.Value>
<LinearGradientBrush EndPoint="0.5,1"
StartPoint="0.5,0">
<GradientStop Color="Black" />
<GradientStop Color="#BF642828"
Offset="1" />
</LinearGradientBrush>
</Setter.Value>
</Setter>
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
For some reason when setting the border thickness for a custom progress bar style the border does not retain the same thickness? Why does this happen? The border will ideally be a value of 1. I just set it to 6 so exaggerate the issue.
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfApplication1.Themes">
<Style x:Key="{x:Type ProgressBar}" TargetType="{x:Type ProgressBar}">
<Setter Property="Background" Value="{StaticResource GrayBrush5}" />
<Setter Property="BorderBrush" Value="{StaticResource ControlBorderBrush}" />
<Setter Property="BorderThickness" Value="6" />
<Setter Property="Foreground" Value="{StaticResource AccentLightBrush}" />
<Setter Property="IsTabStop" Value="False" />
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="SnapsToDevicePixels" Value="true"/>
<Setter Property="OverridesDefaultStyle" Value="true"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ProgressBar">
<Grid x:Name="Root">
<Border x:Name="PART_Track"
Margin="0"
SnapsToDevicePixels="True"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}" />
<Grid x:Name="ProgressBarRootGrid">
<Grid x:Name="IndeterminateRoot" Visibility="Collapsed">
<Rectangle x:Name="IndeterminateSolidFill"
Margin="{TemplateBinding BorderThickness}"
Fill="{TemplateBinding Background}"
RenderTransformOrigin="0.5,0.5"
StrokeThickness="0" />
<Rectangle x:Name="IndeterminateGradientFill"
Margin="{TemplateBinding BorderThickness}"
StrokeThickness="0">
<Rectangle.Fill>
<LinearGradientBrush MappingMode="Absolute" SpreadMethod="Repeat" StartPoint="20,1" EndPoint="0,1">
<LinearGradientBrush.Transform>
<TransformGroup>
<TranslateTransform x:Name="xTransform" X="0" />
<SkewTransform AngleX="-30" />
</TransformGroup>
</LinearGradientBrush.Transform>
<GradientStop Offset="0" Color="{StaticResource AccentLightColor}" />
<GradientStop Offset="0.5" Color="{StaticResource AccentLightColor}" />
<GradientStop Offset="0.5" Color="{StaticResource AccentDarkColor}" />
<GradientStop Offset="1.0" Color="{StaticResource AccentDarkColor}" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
</Grid>
<Grid x:Name="DeterminateRoot" Margin="1">
<Border x:Name="PART_Indicator"
Margin="0"
HorizontalAlignment="Left"
Background="{StaticResource AccentLightBrush}">
<Rectangle x:Name="GradientFill" Visibility="Collapsed">
<Rectangle.Fill>
<LinearGradientBrush MappingMode="Absolute" SpreadMethod="Repeat" StartPoint="20,1" EndPoint="0,1">
<LinearGradientBrush.Transform>
<TransformGroup>
<TranslateTransform X="0" />
<SkewTransform AngleX="-30" />
</TransformGroup>
</LinearGradientBrush.Transform>
<GradientStop Offset="0" Color="{StaticResource AccentLightColor}" />
<GradientStop Offset="0.5" Color="{StaticResource AccentLightColor}" />
<GradientStop Offset="0.5" Color="{StaticResource AccentDarkColor}" />
<GradientStop Offset="1.0" Color="{StaticResource AccentDarkColor}" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
</Border>
</Grid>
</Grid>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Determinate" />
<VisualState x:Name="Indeterminate">
<Storyboard RepeatBehavior="Forever">
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="IndeterminateRoot"
Storyboard.TargetProperty="(UIElement.Visibility)"
Duration="00:00:00">
<DiscreteObjectKeyFrame KeyTime="00:00:00">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="DeterminateRoot"
Storyboard.TargetProperty="(UIElement.Visibility)"
Duration="00:00:00">
<DiscreteObjectKeyFrame KeyTime="00:00:00">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetName="xTransform" Storyboard.TargetProperty="X">
<SplineDoubleKeyFrame KeyTime="0" Value="0" />
<SplineDoubleKeyFrame KeyTime="00:00:.35" Value="20" />
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="Orientation" Value="Vertical">
<Setter TargetName="Root" Property="LayoutTransform">
<Setter.Value>
<RotateTransform Angle="-90" />
</Setter.Value>
</Setter>
</Trigger>
<Trigger Property="IsIndeterminate" Value="true">
<Setter TargetName="DeterminateRoot" Property="Visibility" Value="Collapsed" />
<Setter TargetName="IndeterminateRoot" Property="Visibility" Value="Visible" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</ResourceDictionary>
I have a combobox which does not allow text input. Because of this, I don't need the down arrow; just clicking anywhere on the box drops the menu down.
I found this answer: WPF: ComboBox without dropdown button
However, that answer removes the down arrow AND the resulting scrollbar in the drop down menu. I would like to just remove the down arrow, but not the scrollbar in the drop down menu.
How is this possible?
You would have to edit the control template unfortunately.
This template removes the dropdown arrow (warning; it's super long). Feel free to customize the template however you like. I got the original template from MSDN. I Just commented out the lines that show the drop down glyph so that you could see what they originally looked like (Search for "Path" to find them).
<Window
x:Class="comboNoArrow.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:local="clr-namespace:comboNoArrow"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
Title="MainWindow"
Width="525"
Height="350"
mc:Ignorable="d">
<Window.Resources>
<!-- Control colors. -->
<Color x:Key="WindowColor">#FFE8EDF9</Color>
<Color x:Key="ContentAreaColorLight">#FFC5CBF9</Color>
<Color x:Key="ContentAreaColorDark">#FF7381F9</Color>
<Color x:Key="DisabledControlLightColor">#FFE8EDF9</Color>
<Color x:Key="DisabledControlDarkColor">#FFC5CBF9</Color>
<Color x:Key="DisabledForegroundColor">#FF888888</Color>
<Color x:Key="SelectedBackgroundColor">#FFC5CBF9</Color>
<Color x:Key="SelectedUnfocusedColor">#FFDDDDDD</Color>
<Color x:Key="ControlLightColor">White</Color>
<Color x:Key="ControlMediumColor">#FF7381F9</Color>
<Color x:Key="ControlDarkColor">#FF211AA9</Color>
<Color x:Key="ControlMouseOverColor">#FF3843C4</Color>
<Color x:Key="ControlPressedColor">#FF211AA9</Color>
<Color x:Key="GlyphColor">#FF444444</Color>
<Color x:Key="GlyphMouseOver">sc#1, 0.004391443, 0.002428215, 0.242281124</Color>
<!-- Border colors -->
<Color x:Key="BorderLightColor">#FFCCCCCC</Color>
<Color x:Key="BorderMediumColor">#FF888888</Color>
<Color x:Key="BorderDarkColor">#FF444444</Color>
<Color x:Key="PressedBorderLightColor">#FF888888</Color>
<Color x:Key="PressedBorderDarkColor">#FF444444</Color>
<Color x:Key="DisabledBorderLightColor">#FFAAAAAA</Color>
<Color x:Key="DisabledBorderDarkColor">#FF888888</Color>
<Color x:Key="DefaultBorderBrushDarkColor">Black</Color>
<!-- Control-specific resources. -->
<Color x:Key="HeaderTopColor">#FFC5CBF9</Color>
<Color x:Key="DatagridCurrentCellBorderColor">Black</Color>
<Color x:Key="SliderTrackDarkColor">#FFC5CBF9</Color>
<Color x:Key="NavButtonFrameColor">#FF3843C4</Color>
<LinearGradientBrush x:Key="MenuPopupBrush" StartPoint="0.5,0" EndPoint="0.5,1">
<GradientStop Offset="0" Color="{DynamicResource ControlLightColor}" />
<GradientStop Offset="0.5" Color="{DynamicResource ControlMediumColor}" />
<GradientStop Offset="1" Color="{DynamicResource ControlLightColor}" />
</LinearGradientBrush>
<LinearGradientBrush x:Key="ProgressBarIndicatorAnimatedFill" StartPoint="0,0" EndPoint="1,0">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Offset="0" Color="#000000FF" />
<GradientStop Offset="0.4" Color="#600000FF" />
<GradientStop Offset="0.6" Color="#600000FF" />
<GradientStop Offset="1" Color="#000000FF" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
<ControlTemplate x:Key="ComboBoxToggleButton" TargetType="{x:Type ToggleButton}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition Width="20" />
</Grid.ColumnDefinitions>
<Border
x:Name="Border"
Grid.ColumnSpan="2"
BorderThickness="1"
CornerRadius="2">
<Border.BorderBrush>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<GradientStop Offset="0" Color="{DynamicResource BorderLightColor}" />
<GradientStop Offset="1" Color="{DynamicResource BorderDarkColor}" />
</LinearGradientBrush>
</Border.BorderBrush>
<Border.Background>
<LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Color="{DynamicResource ControlLightColor}" />
<GradientStop Offset="1.0" Color="{DynamicResource ControlMediumColor}" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Border.Background>
</Border>
<Border
Grid.Column="0"
Margin="1"
CornerRadius="2,0,0,2">
<Border.Background>
<SolidColorBrush Color="{DynamicResource ControlLightColor}" />
</Border.Background>
</Border>
<!--<Path
x:Name="Arrow"
Grid.Column="1"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Data="M 0 0 L 4 4 L 8 0 Z">
<Path.Fill>
<SolidColorBrush Color="{DynamicResource GlyphColor}" />
</Path.Fill>
</Path>-->
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="MouseOver">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlMouseOverColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Pressed" />
<VisualState x:Name="Disabled">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledControlDarkColor}" />
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="Arrow" Storyboard.TargetProperty="(Shape.Fill).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledForegroundColor}" />
</ColorAnimationUsingKeyFrames>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Border.BorderBrush).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledBorderDarkColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="CheckStates">
<VisualState x:Name="Checked">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Panel.Background).(GradientBrush.GradientStops)[1].(GradientStop.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource ControlPressedColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Unchecked" />
<VisualState x:Name="Indeterminate" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Grid>
</ControlTemplate>
<ControlTemplate x:Key="ComboBoxTextBox" TargetType="{x:Type TextBox}">
<Border
x:Name="PART_ContentHost"
Background="{TemplateBinding Background}"
Focusable="False" />
</ControlTemplate>
<Style x:Key="{x:Type ComboBox}" TargetType="{x:Type ComboBox}">
<Setter Property="SnapsToDevicePixels" Value="true" />
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Auto" />
<Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Auto" />
<Setter Property="ScrollViewer.CanContentScroll" Value="true" />
<Setter Property="MinWidth" Value="120" />
<Setter Property="MinHeight" Value="20" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ComboBox}">
<Grid>
<ToggleButton
x:Name="ToggleButton"
Grid.Column="2"
ClickMode="Press"
Focusable="false"
IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"
Template="{StaticResource ComboBoxToggleButton}" />
<ContentPresenter
x:Name="ContentSite"
Margin="3,3,23,3"
HorizontalAlignment="Left"
VerticalAlignment="Stretch"
Content="{TemplateBinding SelectionBoxItem}"
ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
IsHitTestVisible="False" />
<TextBox
x:Name="PART_EditableTextBox"
Margin="3,3,23,3"
HorizontalAlignment="Left"
VerticalAlignment="Bottom"
Background="Transparent"
Focusable="True"
IsReadOnly="{TemplateBinding IsReadOnly}"
Style="{x:Null}"
Template="{StaticResource ComboBoxTextBox}"
Visibility="Hidden" />
<Popup
x:Name="Popup"
AllowsTransparency="True"
Focusable="False"
IsOpen="{TemplateBinding IsDropDownOpen}"
Placement="Bottom"
PopupAnimation="Slide">
<Grid
x:Name="DropDown"
MinWidth="{TemplateBinding ActualWidth}"
MaxHeight="{TemplateBinding MaxDropDownHeight}"
SnapsToDevicePixels="True">
<Border x:Name="DropDownBorder" BorderThickness="1">
<Border.BorderBrush>
<SolidColorBrush Color="{DynamicResource BorderMediumColor}" />
</Border.BorderBrush>
<Border.Background>
<SolidColorBrush Color="{DynamicResource ControlLightColor}" />
</Border.Background>
</Border>
<ScrollViewer Margin="4,6,4,6" SnapsToDevicePixels="True">
<StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" />
</ScrollViewer>
</Grid>
</Popup>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="MouseOver" />
<VisualState x:Name="Disabled">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="PART_EditableTextBox" Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource DisabledForegroundColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="EditStates">
<VisualState x:Name="Editable">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_EditableTextBox" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Visible}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentSite" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0" Value="{x:Static Visibility.Hidden}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Uneditable" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="HasItems" Value="false">
<Setter TargetName="DropDownBorder" Property="MinHeight" Value="95" />
</Trigger>
<Trigger Property="IsGrouping" Value="true">
<Setter Property="ScrollViewer.CanContentScroll" Value="false" />
</Trigger>
<Trigger SourceName="Popup" Property="AllowsTransparency" Value="true">
<Setter TargetName="DropDownBorder" Property="CornerRadius" Value="4" />
<Setter TargetName="DropDownBorder" Property="Margin" Value="0,2,0,0" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="{x:Type ComboBoxItem}" TargetType="{x:Type ComboBoxItem}">
<Setter Property="SnapsToDevicePixels" Value="true" />
<Setter Property="OverridesDefaultStyle" Value="true" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type ComboBoxItem}">
<Border
x:Name="Border"
Padding="2"
Background="Transparent"
SnapsToDevicePixels="true">
<ContentPresenter />
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="SelectionStates">
<VisualState x:Name="Unselected" />
<VisualState x:Name="Selected">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource SelectedBackgroundColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="SelectedUnfocused">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetName="Border" Storyboard.TargetProperty="(Panel.Background).(SolidColorBrush.Color)">
<EasingColorKeyFrame KeyTime="0" Value="{StaticResource SelectedUnfocusedColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Canvas>
<ComboBox Width="100" />
</Canvas>
</Window>
iam a newby in WPF and i need help again...
I have an expander with Round Corners, but i don't like this and i want rectangular corners. Can anyone tell me how i can solve this problem?
This is my expander
.. Style:
<Style x:Key="exp_AInfo_Style" TargetType="Expander">
<Setter Property="IsExpanded" Value="True"/>
<Setter Property="HorizontalAlignment" Value="Left"/>
<Setter Property="VerticalAlignment" Value="Top"/>
<Setter Property="Margin" Value="18,5,0,0"/>
<Setter Property="Width" Value="259"/>
<Setter Property="Height" Value="29"/>
<Setter Property="FontSize" Value="14"/>
<Style.Triggers>
<Trigger Property="IsExpanded" Value="True">
<Setter Property="Height" Value="155"/>
</Trigger>
</Style.Triggers>
</Style>
and the Object:
<Expander x:Name="exp_AInfo" Header="Allgemeine Info's"
Style="{StaticResource exp_AInfo_Style}" Height="116"
>
<Expander.Background>
<ImageBrush ImageSource="pct/expander.png" Opacity="0.9"/>
</Expander.Background>
<Grid Height="112">
<!--many many objects-->
</Grid>
</Expander>
Thanks 4 help
It's all about the CornerRadius of the ToggleButton ControlTemplate.
There you go:
<ControlTemplate x:Key="ExpanderToggleButton"
TargetType="{x:Type ToggleButton}">
<Border x:Name="Border"
CornerRadius="0,0,0,0"
BorderThickness="1" Background="White" BorderBrush="Black">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="MouseOver">
</VisualState>
<VisualState x:Name="Pressed">
</VisualState>
<VisualState x:Name="Disabled">
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="CheckStates">
<VisualState x:Name="Checked">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)"
Storyboard.TargetName="CollapsedArrow">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{x:Static Visibility.Hidden}" />
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)"
Storyboard.TargetName="ExpandededArrow">
<DiscreteObjectKeyFrame KeyTime="0"
Value="{x:Static Visibility.Visible}" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Unchecked" />
<VisualState x:Name="Indeterminate" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid>
<Path x:Name="CollapsedArrow"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Data="M 0 0 L 4 4 L 8 0 Z">
<Path.Fill>
<SolidColorBrush Color="Black" />
</Path.Fill>
</Path>
<Path x:Name="ExpandededArrow"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Visibility="Collapsed"
Data="M 0 4 L 4 0 L 8 4 Z">
<Path.Fill>
<SolidColorBrush Color="Black" />
</Path.Fill>
</Path>
</Grid>
</Border>
</ControlTemplate>
<Style TargetType="{x:Type Expander}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Expander}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition x:Name="ContentRow"
Height="0" />
</Grid.RowDefinitions>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="MouseOver" />
<VisualState x:Name="Disabled"/>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Border x:Name="Border"
Grid.Row="0"
BorderThickness="1"
CornerRadius="2,2,0,0">
<Border.BorderBrush>
<LinearGradientBrush EndPoint="0,1"
StartPoint="0,0">
<GradientStop Color="White" Offset="0" />
<GradientStop Color="White" Offset="1" />
</LinearGradientBrush>
</Border.BorderBrush>
<Border.Background>
<LinearGradientBrush StartPoint="0,0"
EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Color="White" Offset="0.0" />
<GradientStop Color="White" Offset="1.0" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Border.Background>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<ToggleButton OverridesDefaultStyle="True"
Template="{StaticResource ExpanderToggleButton}"
IsChecked="{Binding IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}">
<ToggleButton.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="White" Offset="0" />
<GradientStop Color="White" Offset="1" />
</LinearGradientBrush>
</ToggleButton.Background>
</ToggleButton>
<ContentPresenter Grid.Column="1"
Margin="4"
ContentSource="Header"
RecognizesAccessKey="True" />
</Grid>
</Border>
<Border x:Name="Content"
Grid.Row="1"
BorderThickness="1,0,1,1"
CornerRadius="0,0,0,0">
<ContentPresenter Margin="4" />
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsExpanded" Value="True">
<Setter TargetName="ContentRow"
Property="Height"
Value="{Binding DesiredHeight, ElementName=Content}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
I am working on an audio player which has two sliders; one serves as a timeline and the other one is for adjusting the volume. I changed the default template of the slider so the sliders look like I wanted them to look. Basically I only changed colors and created two separated styles for the THUMB part of the slider. They are called: SliderThumbStyle and SliderThumbStyleVertical. The horizontal slider works just fine. I have a problem with the vertical slider. It isn't the size that it's supposed to be. I've tried setting the height property in my MainWindow but this doesn't work (changing the width property of the horizontal slider works though).
My edited template looks like (in App.xaml):
<Style x:Key="SliderButtonStyle"
TargetType="{x:Type RepeatButton}">
<Setter Property="SnapsToDevicePixels"
Value="true" />
<Setter Property="OverridesDefaultStyle"
Value="true" />
<Setter Property="IsTabStop"
Value="false" />
<Setter Property="Focusable"
Value="false" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RepeatButton}">
<Border Background="Transparent" />
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<!-- SLIDER THUMB STYLE VERTICAL-->
<Style x:Key="SliderThumbStyleVertical"
TargetType="{x:Type Thumb}">
<Setter Property="SnapsToDevicePixels"
Value="true" />
<Setter Property="OverridesDefaultStyle"
Value="true" />
<Setter Property="Height"
Value="11" />
<Setter Property="Width"
Value="22" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Thumb}">
<Rectangle x:Name="Rectangle"
StrokeThickness="1">
<Rectangle.Stroke>
<LinearGradientBrush StartPoint="0,0"
EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Color="Black"
Offset="0.0" />
<GradientStop Color="Black"
Offset="1.0" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Rectangle.Stroke>
<Rectangle.Fill>
<LinearGradientBrush EndPoint="0.5,1"
StartPoint="0.5,0">
<GradientStop Color="Orange"
Offset="1" />
<GradientStop Color="OrangeRed" />
</LinearGradientBrush>
</Rectangle.Fill>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="MouseOver">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).
(GradientBrush.GradientStops)[0].(GradientStop.Color)"
Storyboard.TargetName="Rectangle">
<EasingColorKeyFrame KeyTime="0"
Value="{StaticResource ControlMouseOverColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Pressed">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).
(GradientBrush.GradientStops)[0].(GradientStop.Color)"
Storyboard.TargetName="Rectangle">
<EasingColorKeyFrame KeyTime="0"
Value="{StaticResource ControlPressedColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Disabled">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).
(GradientBrush.GradientStops)[0].(GradientStop.Color)"
Storyboard.TargetName="Rectangle">
<EasingColorKeyFrame KeyTime="0"
Value="{StaticResource DisabledControlDarkColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Rectangle>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style x:Key="SliderThumbStyle"
TargetType="{x:Type Thumb}">
<Setter Property="SnapsToDevicePixels"
Value="true" />
<Setter Property="OverridesDefaultStyle"
Value="true" />
<Setter Property="Height"
Value="22" />
<Setter Property="Width"
Value="11" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Thumb}">
<Rectangle x:Name="Rectangle"
StrokeThickness="1">
<Rectangle.Stroke>
<LinearGradientBrush StartPoint="0,0"
EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Color="Black"
Offset="0.0" />
<GradientStop Color="Black"
Offset="1.0" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Rectangle.Stroke>
<Rectangle.Fill>
<LinearGradientBrush EndPoint="0.5,1"
StartPoint="0.5,0">
<GradientStop Color="Orange"
Offset="1" />
<GradientStop Color="OrangeRed" />
</LinearGradientBrush>
</Rectangle.Fill>
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="MouseOver">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).
(GradientBrush.GradientStops)[0].(GradientStop.Color)"
Storyboard.TargetName="Rectangle">
<EasingColorKeyFrame KeyTime="0"
Value="{StaticResource ControlMouseOverColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Pressed">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).
(GradientBrush.GradientStops)[0].(GradientStop.Color)"
Storyboard.TargetName="Rectangle">
<EasingColorKeyFrame KeyTime="0"
Value="{StaticResource ControlPressedColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Disabled">
<Storyboard>
<ColorAnimationUsingKeyFrames Storyboard.TargetProperty="(Shape.Fill).
(GradientBrush.GradientStops)[0].(GradientStop.Color)"
Storyboard.TargetName="Rectangle">
<EasingColorKeyFrame KeyTime="0"
Value="{StaticResource DisabledControlDarkColor}" />
</ColorAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Rectangle>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<ControlTemplate x:Key="HorizontalSlider"
TargetType="{x:Type Slider}">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto"
MinHeight="{TemplateBinding MinHeight}" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<TickBar x:Name="TopTick"
SnapsToDevicePixels="True"
Placement="Top"
Height="4"
Visibility="Collapsed">
<TickBar.Fill>
<SolidColorBrush Color="{DynamicResource GlyphColor}" />
</TickBar.Fill>
</TickBar>
<Border x:Name="TrackBackground"
Margin="0"
CornerRadius="0"
Height="7"
Grid.Row="1"
BorderThickness="1">
<Border.BorderBrush>
<LinearGradientBrush StartPoint="0,0"
EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Color="Black"
Offset="0.0" />
<GradientStop Color="Black"
Offset="1.0" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Border.BorderBrush>
<Border.Background>
<LinearGradientBrush StartPoint="0,0"
EndPoint="0,1">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Color="Orange"
Offset="0.0" />
<GradientStop Color="OrangeRed"
Offset="1.0" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Border.Background>
</Border>
<Track Grid.Row="1"
x:Name="PART_Track">
<Track.DecreaseRepeatButton>
<RepeatButton Style="{StaticResource SliderButtonStyle}"
Command="Slider.DecreaseLarge" />
</Track.DecreaseRepeatButton>
<Track.Thumb>
<Thumb Style="{StaticResource SliderThumbStyle}" />
</Track.Thumb>
<Track.IncreaseRepeatButton>
<RepeatButton Style="{StaticResource SliderButtonStyle}"
Command="Slider.IncreaseLarge" />
</Track.IncreaseRepeatButton>
</Track>
<TickBar x:Name="BottomTick"
SnapsToDevicePixels="True"
Grid.Row="2"
Fill="{TemplateBinding Foreground}"
Placement="Bottom"
Height="4"
Visibility="Collapsed" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="TickPlacement"
Value="TopLeft">
<Setter TargetName="TopTick"
Property="Visibility"
Value="Visible" />
</Trigger>
<Trigger Property="TickPlacement"
Value="BottomRight">
<Setter TargetName="BottomTick"
Property="Visibility"
Value="Visible" />
</Trigger>
<Trigger Property="TickPlacement"
Value="Both">
<Setter TargetName="TopTick"
Property="Visibility"
Value="Visible" />
<Setter TargetName="BottomTick"
Property="Visibility"
Value="Visible" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<!-- VERTICAL SLIDER-->
<ControlTemplate x:Key="VerticalSlider"
TargetType="{x:Type Slider}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto"
MinWidth="{TemplateBinding MinWidth}" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<TickBar x:Name="TopTick"
SnapsToDevicePixels="True"
Placement="Left"
Width="4"
Visibility="Collapsed">
<TickBar.Fill>
<SolidColorBrush Color="{DynamicResource GlyphColor}" />
</TickBar.Fill>
</TickBar>
<!-- DOLZINA TRACK BARA -->
<Border x:Name="TrackBackground"
Margin="0"
CornerRadius="0"
Width="7"
Grid.Column="1"
BorderThickness="1">
<Border.BorderBrush>
<LinearGradientBrush StartPoint="0,0"
EndPoint="1,0">
<LinearGradientBrush.GradientStops>
<GradientStopCollection>
<GradientStop Color="Black"
Offset="0.0" />
<GradientStop Color="Black"
Offset="1.0" />
</GradientStopCollection>
</LinearGradientBrush.GradientStops>
</LinearGradientBrush>
</Border.BorderBrush>
<Border.Background>
<LinearGradientBrush EndPoint="1,0"
StartPoint="0.25,0">
<GradientStop Color="Orange"
Offset="0" />
<GradientStop Color="OrangeRed"
Offset="1" />
</LinearGradientBrush>
</Border.Background>
</Border>
<Track Grid.Column="1"
x:Name="PART_Track">
<Track.DecreaseRepeatButton>
<RepeatButton Style="{StaticResource SliderButtonStyle}"
Command="Slider.DecreaseLarge" />
</Track.DecreaseRepeatButton>
<Track.Thumb>
<!--DEFAULT THUMB SLIDER STYLE-->
<Thumb Style="{StaticResource SliderThumbStyleVertical}" />
</Track.Thumb>
<Track.IncreaseRepeatButton>
<RepeatButton Style="{StaticResource SliderButtonStyle}"
Command="Slider.IncreaseLarge" />
</Track.IncreaseRepeatButton>
</Track>
<TickBar x:Name="BottomTick"
SnapsToDevicePixels="True"
Grid.Column="2"
Fill="{TemplateBinding Foreground}"
Placement="Right"
Width="4"
Visibility="Collapsed" />
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="TickPlacement"
Value="TopLeft">
<Setter TargetName="TopTick"
Property="Visibility"
Value="Visible" />
</Trigger>
<Trigger Property="TickPlacement"
Value="BottomRight">
<Setter TargetName="BottomTick"
Property="Visibility"
Value="Visible" />
</Trigger>
<Trigger Property="TickPlacement"
Value="Both">
<Setter TargetName="TopTick"
Property="Visibility"
Value="Visible" />
<Setter TargetName="BottomTick"
Property="Visibility"
Value="Visible" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<Style TargetType="{x:Type Slider}">
<Setter Property="SnapsToDevicePixels"
Value="true" />
<Setter Property="OverridesDefaultStyle"
Value="true" />
<Style.Triggers>
<Trigger Property="Orientation"
Value="Horizontal">
<Setter Property="MinWidth"
Value="104" />
<Setter Property="MinHeight"
Value="21" />
<Setter Property="Template"
Value="{StaticResource HorizontalSlider}" />
</Trigger>
<Trigger Property="Orientation"
Value="Vertical">
<Setter Property="MinWidth"
Value="21" />
<Setter Property="MinHeight"
Value="104" />
<Setter Property="Template"
Value="{StaticResource VerticalSlider}" />
</Trigger>
</Style.Triggers>
</Style>
And the xaml for my two sliders looks like:
<Slider Height="22" HorizontalAlignment="Left" Minimum="0" Maximum="100" Focusable="False" LargeChange="0" Thumb.DragCompleted="slider1_DragCompleted" Margin="16,103,0,0" Name="slider1" VerticalAlignment="Top" Width="469" Grid.ColumnSpan="2" />
<Slider Width="20" Height="52" Minimum="0" Maximum="100" Orientation="Vertical" HorizontalAlignment="Left" Margin="325,41,0,0" Name="slider2" VerticalAlignment="Top" ValueChanged="slider2_ValueChanged" />
I couldn't completely understand what the output you want but just use this below statement and see is that what you expect. If not please excuse me and if you can provide some more information may be i can help you out.
<Slider
Minimum="0"
Maximum="100"
Focusable="False"
LargeChange="0"
Thumb.DragCompleted="slider1_DragCompleted"
Margin="16,103,0,0"
Name="slider1"
Grid.ColumnSpan="2" VerticalAlignment="Center" />
<Slider
Minimum="0"
Maximum="100"
Orientation="Vertical"
Margin="325,0,0,0"
Name="slider2"
ValueChanged="slider2_ValueChanged" HorizontalAlignment="Left" />