Hello.

There is a button with the text "collapse" and below the Grid.

For some reason, you cannot use C # code. It is necessary that when you click on a button, the button text changes to "Details" and the Grid becomes invisible, and when you press it again, the grid appears and the button name changes back to "Collapse".

Found what can be implemented via EventTrigger

I made the Grid become invisible (Visibility = hidden) and the text on the button changed.

How to make that when pressed again it becomes (Visibility = visible)? And the text changed back to "Collapse"

<Window x:Class="WpfApplication1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="MainWindow" Height="350" Width="525"> <Grid> <Grid.Triggers> <EventTrigger SourceName="button1" RoutedEvent="Button.Click"> <BeginStoryboard> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetName="CollapsedGrid" Storyboard.TargetProperty="Visibility"> <DiscreteObjectKeyFrame KeyTime="0:0:0"> <DiscreteObjectKeyFrame.Value> <Visibility>Hidden</Visibility> </DiscreteObjectKeyFrame.Value> </DiscreteObjectKeyFrame> </ObjectAnimationUsingKeyFrames> <StringAnimationUsingKeyFrames Storyboard.TargetName="button1" Storyboard.TargetProperty="Content"> <DiscreteStringKeyFrame KeyTime="0:0:0" Value="Details"> </DiscreteStringKeyFrame> </StringAnimationUsingKeyFrames> </Storyboard> </BeginStoryboard> </EventTrigger> </Grid.Triggers> <Button Content="Collapse" Height="23" HorizontalAlignment="Left" Margin="54,40,0,0" Name="button1" VerticalAlignment="Top" Width="75"> </Button> <Grid x:Name="CollapsedGrid" Margin="40,97,69,37" Visibility="Visible"> <Border Grid.ColumnSpan='2' BorderThickness='1' BorderBrush='#FFD4D4D4' Padding='10,5'> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width='Auto'/> <ColumnDefinition Width='6'/> <ColumnDefinition Width='*'/> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height='Auto'/> <RowDefinition Height='5'/> <RowDefinition Height='Auto'/> <RowDefinition Height='5'/> <RowDefinition Height='Auto'/> <RowDefinition Height='*'/> </Grid.RowDefinitions> <TextBlock Text='gfgfgfgfgfgfgf:'/> <StackPanel Orientation='Horizontal' Grid.Column='2'> <TextBlock Text='100000000000000000.00' Margin='0,0,6,0'/> <TextBlock Text='eur'/> </StackPanel> <TextBlock Text='tttttttttttttt:' Grid.Row='2'/> <StackPanel Orientation='Horizontal' Grid.Row='2' Grid.Column='2' > <TextBlock Text='0' Margin='0,0,6,0'/> <TextBlock Text='eur'/> </StackPanel> <TextBlock Text='rrrrrrrrrrrrrrrrr:' Grid.Row='4'/> <StackPanel Orientation='Horizontal' Grid.Row='4' Grid.Column='2' > <TextBlock Text='10000000' Margin='0,0,6,0'/> <TextBlock Text='eur'/> </StackPanel> </Grid> </Border> </Grid> </Grid> </Window>

    2 answers 2

    Something like this (Button -> ToogleButton)

     <Window x:Class="WpfApplication1.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" DataContext="{Binding RelativeSource={RelativeSource Self}}" Title="MainWindow" Height="350" Width="525"> <Grid> <ToggleButton Name="YourButton" Height="23" HorizontalAlignment="Left" Margin="54,40,0,0" VerticalAlignment="Top" Width="75"> <ToggleButton.Style> <Style TargetType="ToggleButton"> <Setter Property="Content" Value="Collapse"/> <Style.Triggers> <Trigger Property="IsChecked" Value="True"> <Setter Property="Content" Value="Expand"/> </Trigger> </Style.Triggers> </Style> </ToggleButton.Style> </ToggleButton> <Grid Name="CollapsedGrid" Margin="40,97,69,37"> <Grid.Style> <Style TargetType="Grid"> <Setter Property="Visibility" Value="Visible"/> <Style.Triggers> <DataTrigger Binding="{Binding ElementName=YourButton, Path=IsChecked}" Value="True"> <Setter Property="Visibility" Value="Hidden"/> </DataTrigger> </Style.Triggers> </Style> </Grid.Style> <Border Grid.ColumnSpan='2' BorderThickness='1' BorderBrush='#FFD4D4D4' Padding='10,5'> <Grid> <Grid.ColumnDefinitions> <ColumnDefinition Width='Auto'/> <ColumnDefinition Width='6'/> <ColumnDefinition Width='*'/> </Grid.ColumnDefinitions> <Grid.RowDefinitions> <RowDefinition Height='Auto'/> <RowDefinition Height='5'/> <RowDefinition Height='Auto'/> <RowDefinition Height='5'/> <RowDefinition Height='Auto'/> <RowDefinition Height='*'/> </Grid.RowDefinitions> <TextBlock Text='gfgfgfgfgfgfgf:'/> <StackPanel Orientation='Horizontal' Grid.Column='2'> <TextBlock Text='100000000000000000.00' Margin='0,0,6,0'/> <TextBlock Text='eur'/> </StackPanel> <TextBlock Text='tttttttttttttt:' Grid.Row='2'/> <StackPanel Orientation='Horizontal' Grid.Row='2' Grid.Column='2' > <TextBlock Text='0' Margin='0,0,6,0'/> <TextBlock Text='eur'/> </StackPanel> <TextBlock Text='rrrrrrrrrrrrrrrrr:' Grid.Row='4'/> <StackPanel Orientation='Horizontal' Grid.Row='4' Grid.Column='2' > <TextBlock Text='10000000' Margin='0,0,6,0'/> <TextBlock Text='eur'/> </StackPanel> </Grid> </Border> </Grid> </Grid> </Window> 

       private void Grid_Click(object sender, RoutedEventArgs e) { if (f == 0) { Grid.Visibility = System.Windows.Visibility.Hidden; f = 1; } else { Grid.Visibility = System.Windows.Visibility.Visible; f = 0; } }