Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
470
Need XAMGrid style for ExpansionIndicatorCellControl
posted

HI 

I am using xamgrid and I have kept one more grid in xamgrid row like nested grid, when I click on the ExpansionIndicator then it will display that nested grid.

By default for me XAMGrid ExpansionIndicator is coming like -> and when I click on arrow it is rotating to 90 degrees and row expands, the arrow is the image here and we have 3 arrow images for 3 sates normal, hover, pressed.

Now I want to same style for + and - images, I have three + images and three - images. I need ExpansionIndicatorCellControl style for the same 

can any one provide me the style for the same and when I click on the indicator, row details are shown from the second column of the xamgrid not from the first column(it's indicator column) is there any way to place the child grid from first column.

below is the existing style

<Style TargetType="ig:ExpansionIndicatorCellControl">
<Setter Property="HorizontalContentAlignment" Value="Center" />
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="Background" Value="{StaticResource CellItemNormalBackgroundBrush}" />
<Setter Property="BorderThickness" Value="0,0,0,1" />
<Setter Property="BorderBrush" Value="{StaticResource CellItemNormalBorderBrush}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ig:ExpansionIndicatorCellControl">
<Grid Background="Transparent">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="MouseOver">
<Storyboard>
<ColorAnimation Duration="00:00:00.0000"
From="White"
Storyboard.TargetName="border"
Storyboard.TargetProperty="(UIElement.Background).(Background.Color)"
To="#FFEBEFF2" />
</Storyboard>
</VisualState>
<VisualState x:Name="Alternate" />
</VisualStateGroup>
<VisualStateGroup x:Name="SelectedStates">
<VisualState x:Name="NotSelected" />
<VisualState x:Name="Selected">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="rowSelected" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="00:00:00" Value="Visible" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="ActiveStates">
<VisualState x:Name="InActive" />
<VisualState x:Name="Active">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ActiveSelected" Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame KeyTime="00:00:00" Value="Visible" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Border x:Name="border"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Visibility="Visible">
<Grid Background="Transparent">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="4" />
<ColumnDefinition Width="14" />
<ColumnDefinition Width="4" />
</Grid.ColumnDefinitions>
<Border x:Name="rowSelected"
Grid.ColumnSpan="3"
Margin="0,0,0,0"
Background="{StaticResource CellItemSelectedBackgroundBrush}"
Visibility="Collapsed" />
<Border x:Name="ActiveSelected"
Grid.ColumnSpan="3"
Margin="0,0,0,0"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
Visibility="Collapsed" />
<igPrim:ExpansionIndicator x:Name="Indicator"
Grid.Column="1"
Margin="{TemplateBinding Padding}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Cursor="Hand"
Visibility="Collapsed"
d:LayoutOverrides="Width">
<igPrim:ExpansionIndicator.Style>
<Style TargetType="igPrim:ExpansionIndicator">
<Setter Property="Foreground" Value="{StaticResource ExpansionIndicatorForegroundBrush}" />
<Setter Property="Width" Value="20" />
<Setter Property="Height" Value="20" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="igPrim:ExpansionIndicator">
<Grid Background="{TemplateBinding Background}">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="ExpansionStates">
<VisualStateGroup.Transitions>
<VisualTransition From="Collapsed"
GeneratedDuration="00:00:00.2000000"
To="Expanded" />
<VisualTransition From="Expanded"
GeneratedDuration="00:00:00.2000000"
To="Collapsed" />
</VisualStateGroup.Transitions>

<VisualState x:Name="Expanded">
<Storyboard>
<DoubleAnimation Duration="0"
Storyboard.TargetName="ExpansionIndicatorGlyph"
Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"
To="90" />
<DoubleAnimation Duration="0"
Storyboard.TargetName="ExpansionIndicatorGlyphHover"
Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"
To="90" />
<DoubleAnimation Duration="0"
Storyboard.TargetName="ExpansionIndicatorGlyphPress"
Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"
To="90" />
<DoubleAnimation Duration="0"
Storyboard.TargetName="ExpansionIndicatorGlyphDis"
Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"
To="90" />
</Storyboard>
</VisualState>
<VisualState x:Name="Collapsed">
<Storyboard>
<DoubleAnimation Duration="0"
Storyboard.TargetName="ExpansionIndicatorGlyph"
Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"
To="0" />
<DoubleAnimation Duration="0"
Storyboard.TargetName="ExpansionIndicatorGlyphHover"
Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"
To="0" />
<DoubleAnimation Duration="0"
Storyboard.TargetName="ExpansionIndicatorGlyphPress"
Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"
To="0" />
<DoubleAnimation Duration="0"
Storyboard.TargetName="ExpansionIndicatorGlyphDis"
Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"
To="0" />
</Storyboard>
</VisualState>
</VisualStateGroup>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal" />
<VisualState x:Name="MouseOver">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ExpansionIndicatorGlyph" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ExpansionIndicatorGlyphHover" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Pressed">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ExpansionIndicatorGlyph" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ExpansionIndicatorGlyphPress" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Disabled">
<Storyboard>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ExpansionIndicatorGlyph" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Collapsed</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ExpansionIndicatorGlyphDis" Storyboard.TargetProperty="(UIElement.Visibility)">
<DiscreteObjectKeyFrame KeyTime="0">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames>
</Storyboard>
</VisualState>
<VisualState x:Name="Alternate" />
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
<Grid x:Name="ExpansionIndicator"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Background="{TemplateBinding Background}">
<Image x:Name="ExpansionIndicatorGlyph"
Width="14"
Height="14"
Source="Images/btn_drilldown_enabled.png"
Visibility="Visible">
<Image.RenderTransform>
<TransformGroup>
<ScaleTransform />
<SkewTransform />
<RotateTransform CenterX="7" CenterY="7" />
<TranslateTransform />
</TransformGroup>
</Image.RenderTransform>
</Image>
<Image x:Name="ExpansionIndicatorGlyphHover"
Width="14"
Height="14"
Source="Images/btn_drilldown_over.png"
Visibility="Collapsed">
<Image.RenderTransform>
<TransformGroup>
<ScaleTransform />
<SkewTransform />
<RotateTransform CenterX="7" CenterY="7" />
<TranslateTransform />
</TransformGroup>
</Image.RenderTransform>
</Image>
<Image x:Name="ExpansionIndicatorGlyphPress"
Width="14"
Height="14"
Source="/Images/btn_drilldown_press.png"
Visibility="Collapsed">
<Image.RenderTransform>
<TransformGroup>
<ScaleTransform />
<SkewTransform />
<RotateTransform CenterX="7" CenterY="7" />
<TranslateTransform />
</TransformGroup>
</Image.RenderTransform>
</Image>
<Image x:Name="ExpansionIndicatorGlyphDis"
Width="14"
Height="14"
Source="Images/btn_drilldown_disabled.png"
Visibility="Collapsed">
<Image.RenderTransform>
<TransformGroup>
<ScaleTransform />
<SkewTransform />
<RotateTransform CenterX="7" CenterY="7" />
<TranslateTransform />
</TransformGroup>
</Image.RenderTransform>
</Image>
</Grid>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</igPrim:ExpansionIndicator.Style>
</igPrim:ExpansionIndicator>