I customized a toggle button(x1),border(x2),rectangle(x1) in a stack panel.It has about 1000 lines of code information. And I will copy paste for each approximately 50 times. (What I try to do is create an valve animation when I check the toggle button.) For each valve it will take a lot code lines. I want to add dcitionary and call from them for each button. How is it possible? I couldn't find a way. Thank you.
<pre><StackPanel x:Name="valve1Panel"
Margin="40,84,700,521">
<TextBlock Foreground="#FF353535" FontFamily="century gothic"
FontSize="14" Margin="23,0,16,0">
<TextBlock.Style>
<Style TargetType="{x:Type TextBlock}">
<Style.Triggers>
<DataTrigger Binding="{Binding IsChecked,
ElementName=Valve1Toggle}" Value="True" >
<Setter Property="Text" Value="Valve-1 Open"/>
</DataTrigger>
<DataTrigger Binding="{Binding IsChecked,
ElementName=Valve1Toggle}" Value="false" >
<Setter Property="Text" Value="Valve-1 Close"/>
</DataTrigger>
</Style.Triggers>
</Style>
</TextBlock.Style>
</TextBlock>
<Grid HorizontalAlignment="Left" Width="150">
<Border BorderThickness="1 0 1 0" Width="16" BorderBrush="DimGray"
CornerRadius=" 2 2 0 0" Margin="0,0,51,23"
RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Right"
Height="22" VerticalAlignment="Bottom" >
<Border.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform Angle="90"/>
<TranslateTransform/>
</TransformGroup>
</Border.RenderTransform>
<Border.Style>
<Style TargetType="{x:Type Border}">
<Style.Triggers>
<DataTrigger Binding="{Binding IsChecked,
ElementName=Valve1Toggle}" Value="True">
<Setter Property="BorderBrush" Value="#FF54D8D4"/>
<Setter Property="Effect">
<Setter.Value>
<DropShadowEffect ShadowDepth="0"
BlurRadius="5" RenderingBias="Quality"
Color="#FF54D8D4"/>
</Setter.Value>
</Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</Border.Style>
</Border>
<Border BorderThickness="1 0 1 0" Width="16" BorderBrush="DimGray"
CornerRadius=" 0 0 2 2" Margin="0,0,97,23"
RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Right"
Height="22" VerticalAlignment="Bottom" >
<Border.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform Angle="90"/>
<TranslateTransform/>
</TransformGroup>
</Border.RenderTransform>
<Border.Style>
<Style TargetType="{x:Type Border}">
<Style.Triggers>
<DataTrigger Binding="{Binding IsChecked, ElementName=Valve1Toggle}" Value="True">
<Setter Property="BorderBrush" Value="#FF54D8D4"/>
<Setter Property="Effect">
<Setter.Value>
<DropShadowEffect ShadowDepth="0" BlurRadius="5" RenderingBias="Quality"
Color="#FF54D8D4"/>
</Setter.Value>
</Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</Border.Style>
</Border>
<Border BorderThickness="3 0 3 0" Width="22" BorderBrush="DimGray" CornerRadius=" 2" Margin="0,0,71,18"
RenderTransformOrigin="0.5,0.5" HorizontalAlignment="Right"
Height="32" VerticalAlignment="Bottom" >
<Border.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform Angle="0" x:Name="turn"/>
<TranslateTransform/>
</TransformGroup>
</Border.RenderTransform>
<Border.Style>
<Style TargetType="{x:Type Border}">
<Style.Triggers>
<DataTrigger Binding="{Binding IsChecked, ElementName=Valve1Toggle}" Value="True">
<Setter Property="Effect">
<Setter.Value>
<DropShadowEffect ShadowDepth="0"
BlurRadius="5" RenderingBias="Quality" Color="DarkGray"/>
</Setter.Value>
</Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</Border.Style>
</Border>
<Rectangle x:Name="air" Width="21" Height="10"
Fill="#FF54D8D4" StrokeThickness="0"
Margin="34,25,0,29"
HorizontalAlignment="Left">
<Rectangle.Effect>
<DropShadowEffect ShadowDepth="0" BlurRadius="16" RenderingBias="Quality" Color="#FF54D8D4"/>
</Rectangle.Effect>
</Rectangle>
<ToggleButton x:Name="Valve1Toggle" Background="Transparent"
BorderThickness="0" Margin="0,0,15,0"
Style=" {StaticResource ManualAutoToggleInfo}">
<ToggleButton.Triggers>
<EventTrigger RoutedEvent="ToggleButton.Unchecked">
<BeginStoryboard>
<Storyboard x:Name="HideStackasdPanel">
<DoubleAnimation
Storyboard.TargetName="air"
Storyboard.TargetProperty="Width"
BeginTime="0:0:0"
From="68" To="21"
Duration="0:0:0.3"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="ToggleButton.Checked">
<BeginStoryboard>
<Storyboard x:Name="ShowStacasdkPanel">
<DoubleAnimation
Storyboard.TargetName="air"
Storyboard.TargetProperty="Width"
BeginTime="0:0:0"
From="21" To="68"
Duration="0:0:0.4"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="ToggleButton.Unchecked">
<BeginStoryboard>
<Storyboard x:Name="HideStackasPanel">
<DoubleAnimation
Storyboard.TargetName="turn"
Storyboard.TargetProperty="Angle"
BeginTime="0:0:0"
From="90" To="0"
Duration="0:0:0.3"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
<EventTrigger RoutedEvent="ToggleButton.Checked">
<BeginStoryboard>
<Storyboard x:Name="ShowStadanel">
<DoubleAnimation
Storyboard.TargetName="turn"
Storyboard.TargetProperty="Angle"
BeginTime="0:0:0"
From="0" To="90"
Duration="0:0:0.4"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</ToggleButton.Triggers>
</ToggleButton>
</Grid>
</StackPanel>
What I have tried:
Is there any way? thank you all.
Submit an article or tip