N
Nandakumar A
Guest
Hi,
I m newer in wpf design .., i m used some styles in my expander...but in my expander when i click the toggle button that time only it will expand.... now i want to expand my expander both i toggle button and expander header .....
my XAML coding..
<Window x:Class="wpfpayroll.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="Auto" Width="Auto" mc:Ignorable="d" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" designWidth="287" Loaded="Window_Loaded_1
<Window.Background>
<LinearGradientBrush StartPoint="0,0"
EndPoint="0,1
<GradientStop Color="White"/>
</LinearGradientBrush>
</Window.Background>
<Window.Resources>
<LinearGradientBrush x:Key="NormalBrush" StartPoint="0,0" EndPoint="0,1
<GradientStop Color="#202020" Offset="0.0"/>
<GradientStop Color="#444444" Offset="1.0"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="NormalBorderBrush" StartPoint="0,0" EndPoint="0,1
<GradientStop Color="#909090" Offset="0.0"/>
<GradientStop Color="#303030" Offset="1.0"/>
</LinearGradientBrush>
<SolidColorBrush x:Key="GlyphBrush" Color="White" />
<LinearGradientBrush x:Key="HoverBrush" StartPoint="0,0" EndPoint="0,1
<GradientStop Color="#404040" Offset="0.0"/>
<GradientStop Color="#606060" Offset="1.0"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="PressedBrush" StartPoint="0,0" EndPoint="0,1
<GradientStop Color="#202020" Offset="0.0"/>
<GradientStop Color="#404040" Offset="0.1"/>
<GradientStop Color="#707070" Offset="0.9"/>
<GradientStop Color="#808080" Offset="1.0"/>
</LinearGradientBrush>
<SolidColorBrush x:Key="ForegroundBrush" Color="#FFFF" />
<LinearGradientBrush x:Key="HeaderBrush" StartPoint="0,0" EndPoint="0,1
<GradientStop Color="sc#1, 0.19747445, 0.5656454, 0.8154832" Offset="0"/>
<GradientStop Color="sc#1, 0.0365921259, 0.134746253, 0.638337433" Offset="1"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="OpenHeaderBorderBrush" StartPoint="0,0" EndPoint="0,1
<GradientStop Color="White" Offset="0.0"/>
<GradientStop Color="#808080" Offset="1.0"/>
</LinearGradientBrush>
<SolidColorBrush x:Key="GroupBackgroundBrush" Color="Wheat"/>
<SolidColorBrush x:Key="OpenGroupBorderBrush" Color="#808080"/>
<SolidColorBrush x:Key="DisabledBackgroundBrush" Color="Azure" />
<SolidColorBrush x:Key="DisabledBorderBrush" Color="#606060" />
<SolidColorBrush x:Key="DisabledForegroundBrush" Color="#808080" />
<!-- Expander toogle button template -->
<ControlTemplate x:Key="ExpanderToggleButton" TargetType="ToggleButton
<Border
Name="Border"
CornerRadius="20"
Margin="2,4"
Background="Black"
BorderBrush="{StaticResource NormalBorderBrush}"
BorderThickness="1"
>
<Path
Name="Arrow"
Fill="{StaticResource GlyphBrush}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Data="M 0 0 L 4 4 L 8 0 Z"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="ToggleButton.IsMouseOver" Value="true
<Setter TargetName="Border" Property="Background"
Value="{StaticResource HoverBrush}" />
</Trigger>
<Trigger Property="IsPressed" Value="true
<Setter TargetName="Border" Property="Background"
Value="{StaticResource PressedBrush}" />
</Trigger>
<Trigger Property="IsChecked" Value="true
<Setter TargetName="Arrow" Property="Data"
Value="M 0 4 L 4 0 L 8 4 Z" />
</Trigger>
<Trigger Property="IsEnabled" Value="False
<Setter TargetName="Border" Property="Background"
Value="{StaticResource DisabledBackgroundBrush}" />
<Setter TargetName="Border" Property="BorderBrush"
Value="{StaticResource DisabledBorderBrush}" />
<Setter Property="Foreground"
Value="{StaticResource DisabledForegroundBrush}"/>
<Setter TargetName="Arrow" Property="Fill"
Value="{StaticResource DisabledForegroundBrush}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<!-- Expander style -->
<Style TargetType="Expander
<Setter Property="Foreground" Value="{StaticResource ForegroundBrush}"/>
<Setter Property="Template
<Setter.Value>
<ControlTemplate TargetType="Expander
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Name="ContentRow" Height="0"/>
</Grid.RowDefinitions>
<Border
Name="Border"
Grid.Row="0"
Background="{StaticResource HeaderBrush}"
BorderBrush="{StaticResource NormalBorderBrush}"
BorderThickness="1"
CornerRadius="4,4,0,0" >
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="20" />
</Grid.ColumnDefinitions>
<ToggleButton
Grid.Column="1"
IsChecked="{Binding Path=IsExpanded,Mode=TwoWay,
RelativeSource={RelativeSource TemplatedParent}}"
OverridesDefaultStyle="True"
Template="{StaticResource ExpanderToggleButton}"
Background="{StaticResource NormalBrush}" />
<ContentPresenter
Grid.Column="0"
Margin="4"
ContentSource="Header"
RecognizesAccessKey="True" />
</Grid>
</Border>
<Border
Name="Content"
Grid.Row="1"
Background="{StaticResource GroupBackgroundBrush}"
BorderBrush="{StaticResource OpenGroupBorderBrush}"
BorderThickness="1,0,1,1"
CornerRadius="0,0,4,4" >
<ContentPresenter Margin="4" />
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsExpanded" Value="True
<Setter TargetName="ContentRow" Property="Height"
Value="{Binding ElementName=Content,Path=DesiredHeight}" />
<Setter TargetName="Border" Property="BorderBrush"
Value="{StaticResource OpenHeaderBorderBrush}"/>
</Trigger>
<Trigger Property="IsEnabled" Value="False
<Setter TargetName="Border" Property="Background"
Value="{StaticResource DisabledBackgroundBrush}" />
<Setter TargetName="Border" Property="BorderBrush"
Value="{StaticResource DisabledBorderBrush}" />
<Setter Property="Foreground"
Value="{StaticResource DisabledForegroundBrush}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid Background="#FFF2F3FF
<StackPanel HorizontalAlignment="Left" Margin="0,25,0,0" Background="sc#1, 0.0365921259, 0.134746253, 0.638337433
<Expander Name="exemployer" Width="150" Margin="0,0,0,0" Header="Employer" HorizontalAlignment="Left" VerticalAlignment="Top" >
<Border Height="Auto
<StackPanel>
<Button Height="60" HorizontalAlignment="Left" Name="btnemployer" VerticalAlignment="Top" Width="137" Margin="0,5,0,0" "/>
<Button Height="60" HorizontalAlignment="Left" Name="btnlocation" VerticalAlignment="Top" Width="137" Margin="0,0,0,0" />
<Button Height="60" HorizontalAlignment="Left" Name="btndepartment" VerticalAlignment="Top" Width="137" Margin="0,0,0,5" "/>
</StackPanel>
</Border>
</Expander>
</StackPanel>
</Grid>
</Window>
Continue reading...
I m newer in wpf design .., i m used some styles in my expander...but in my expander when i click the toggle button that time only it will expand.... now i want to expand my expander both i toggle button and expander header .....
my XAML coding..
<Window x:Class="wpfpayroll.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="Auto" Width="Auto" mc:Ignorable="d" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" designWidth="287" Loaded="Window_Loaded_1
<Window.Background>
<LinearGradientBrush StartPoint="0,0"
EndPoint="0,1
<GradientStop Color="White"/>
</LinearGradientBrush>
</Window.Background>
<Window.Resources>
<LinearGradientBrush x:Key="NormalBrush" StartPoint="0,0" EndPoint="0,1
<GradientStop Color="#202020" Offset="0.0"/>
<GradientStop Color="#444444" Offset="1.0"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="NormalBorderBrush" StartPoint="0,0" EndPoint="0,1
<GradientStop Color="#909090" Offset="0.0"/>
<GradientStop Color="#303030" Offset="1.0"/>
</LinearGradientBrush>
<SolidColorBrush x:Key="GlyphBrush" Color="White" />
<LinearGradientBrush x:Key="HoverBrush" StartPoint="0,0" EndPoint="0,1
<GradientStop Color="#404040" Offset="0.0"/>
<GradientStop Color="#606060" Offset="1.0"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="PressedBrush" StartPoint="0,0" EndPoint="0,1
<GradientStop Color="#202020" Offset="0.0"/>
<GradientStop Color="#404040" Offset="0.1"/>
<GradientStop Color="#707070" Offset="0.9"/>
<GradientStop Color="#808080" Offset="1.0"/>
</LinearGradientBrush>
<SolidColorBrush x:Key="ForegroundBrush" Color="#FFFF" />
<LinearGradientBrush x:Key="HeaderBrush" StartPoint="0,0" EndPoint="0,1
<GradientStop Color="sc#1, 0.19747445, 0.5656454, 0.8154832" Offset="0"/>
<GradientStop Color="sc#1, 0.0365921259, 0.134746253, 0.638337433" Offset="1"/>
</LinearGradientBrush>
<LinearGradientBrush x:Key="OpenHeaderBorderBrush" StartPoint="0,0" EndPoint="0,1
<GradientStop Color="White" Offset="0.0"/>
<GradientStop Color="#808080" Offset="1.0"/>
</LinearGradientBrush>
<SolidColorBrush x:Key="GroupBackgroundBrush" Color="Wheat"/>
<SolidColorBrush x:Key="OpenGroupBorderBrush" Color="#808080"/>
<SolidColorBrush x:Key="DisabledBackgroundBrush" Color="Azure" />
<SolidColorBrush x:Key="DisabledBorderBrush" Color="#606060" />
<SolidColorBrush x:Key="DisabledForegroundBrush" Color="#808080" />
<!-- Expander toogle button template -->
<ControlTemplate x:Key="ExpanderToggleButton" TargetType="ToggleButton
<Border
Name="Border"
CornerRadius="20"
Margin="2,4"
Background="Black"
BorderBrush="{StaticResource NormalBorderBrush}"
BorderThickness="1"
>
<Path
Name="Arrow"
Fill="{StaticResource GlyphBrush}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Data="M 0 0 L 4 4 L 8 0 Z"/>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="ToggleButton.IsMouseOver" Value="true
<Setter TargetName="Border" Property="Background"
Value="{StaticResource HoverBrush}" />
</Trigger>
<Trigger Property="IsPressed" Value="true
<Setter TargetName="Border" Property="Background"
Value="{StaticResource PressedBrush}" />
</Trigger>
<Trigger Property="IsChecked" Value="true
<Setter TargetName="Arrow" Property="Data"
Value="M 0 4 L 4 0 L 8 4 Z" />
</Trigger>
<Trigger Property="IsEnabled" Value="False
<Setter TargetName="Border" Property="Background"
Value="{StaticResource DisabledBackgroundBrush}" />
<Setter TargetName="Border" Property="BorderBrush"
Value="{StaticResource DisabledBorderBrush}" />
<Setter Property="Foreground"
Value="{StaticResource DisabledForegroundBrush}"/>
<Setter TargetName="Arrow" Property="Fill"
Value="{StaticResource DisabledForegroundBrush}" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
<!-- Expander style -->
<Style TargetType="Expander
<Setter Property="Foreground" Value="{StaticResource ForegroundBrush}"/>
<Setter Property="Template
<Setter.Value>
<ControlTemplate TargetType="Expander
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Name="ContentRow" Height="0"/>
</Grid.RowDefinitions>
<Border
Name="Border"
Grid.Row="0"
Background="{StaticResource HeaderBrush}"
BorderBrush="{StaticResource NormalBorderBrush}"
BorderThickness="1"
CornerRadius="4,4,0,0" >
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="20" />
</Grid.ColumnDefinitions>
<ToggleButton
Grid.Column="1"
IsChecked="{Binding Path=IsExpanded,Mode=TwoWay,
RelativeSource={RelativeSource TemplatedParent}}"
OverridesDefaultStyle="True"
Template="{StaticResource ExpanderToggleButton}"
Background="{StaticResource NormalBrush}" />
<ContentPresenter
Grid.Column="0"
Margin="4"
ContentSource="Header"
RecognizesAccessKey="True" />
</Grid>
</Border>
<Border
Name="Content"
Grid.Row="1"
Background="{StaticResource GroupBackgroundBrush}"
BorderBrush="{StaticResource OpenGroupBorderBrush}"
BorderThickness="1,0,1,1"
CornerRadius="0,0,4,4" >
<ContentPresenter Margin="4" />
</Border>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsExpanded" Value="True
<Setter TargetName="ContentRow" Property="Height"
Value="{Binding ElementName=Content,Path=DesiredHeight}" />
<Setter TargetName="Border" Property="BorderBrush"
Value="{StaticResource OpenHeaderBorderBrush}"/>
</Trigger>
<Trigger Property="IsEnabled" Value="False
<Setter TargetName="Border" Property="Background"
Value="{StaticResource DisabledBackgroundBrush}" />
<Setter TargetName="Border" Property="BorderBrush"
Value="{StaticResource DisabledBorderBrush}" />
<Setter Property="Foreground"
Value="{StaticResource DisabledForegroundBrush}"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</Window.Resources>
<Grid Background="#FFF2F3FF
<StackPanel HorizontalAlignment="Left" Margin="0,25,0,0" Background="sc#1, 0.0365921259, 0.134746253, 0.638337433
<Expander Name="exemployer" Width="150" Margin="0,0,0,0" Header="Employer" HorizontalAlignment="Left" VerticalAlignment="Top" >
<Border Height="Auto
<StackPanel>
<Button Height="60" HorizontalAlignment="Left" Name="btnemployer" VerticalAlignment="Top" Width="137" Margin="0,5,0,0" "/>
<Button Height="60" HorizontalAlignment="Left" Name="btnlocation" VerticalAlignment="Top" Width="137" Margin="0,0,0,0" />
<Button Height="60" HorizontalAlignment="Left" Name="btndepartment" VerticalAlignment="Top" Width="137" Margin="0,0,0,5" "/>
</StackPanel>
</Border>
</Expander>
</StackPanel>
</Grid>
</Window>
Continue reading...