none
Checkbox soll Animation steuern RRS feed

  • Frage

  • Hallo!

    Ich drehe mich gerade im Kreis. 

    Eine Checkbox soll ein Border in der Höhe animieren. Checkbox ISChecked -> Border-Hight von 0 zu 200 ISUnchecked -> von 200 zu 0.

    Als Erstes habe ich (versucht) einen Eventtrigger zu benutzen:

    <CheckBox x:Name="cb1" Grid.Row="1" Content="Auf/Zu">
        <CheckBox.Style>
            <Style TargetType="CheckBox">
                <Style.Triggers>
                    <EventTrigger RoutedEvent="CheckBox.IsChecked">
                        <BeginStoryboard>
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="b1" Storyboard.TargetProperty="Height" From="0" To="200" Duration="0:0:2"/>
                            </Storyboard>
                        </BeginStoryboard>
                    </EventTrigger>
                </Style.Triggers>
            </Style>
        </CheckBox.Style>
    </CheckBox>

    Dabei kann nicht auf das Event zugegriffen werden:

    Das Element "IsChecked" wurde nicht erkannt, oder es kann nicht auf das Element zugegriffen werden.


    Dann versuchte ich es mit einem Datentrigger:

    <CheckBox x:Name="cb1" Grid.Row="1" Content="Auf/Zu">
        <CheckBox.Style>
            <Style TargetType="CheckBox">
                <Style.Triggers>
                    <DataTrigger Binding="{Binding ElementName=cb1, Path=IsChecked}" Value="True">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="b1" Storyboard.TargetProperty="Height" From="0" To="200" Duration="0:0:2"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </CheckBox.Style>
    </CheckBox>


    Dabei wird mir aber mitgeteilt, dass die TargetName Eigenschaft nicht verwendet werden kann:

    TargetName-Eigenschaft kann nicht für einen "Style Setter" festgelegt werden.


    Wie kann ich denn diese "einfache" Aufgabe lösen ?

    Als Testvorlage:

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <Border x:Name="b1" Background="Red" />
        <CheckBox x:Name="cb1" Grid.Row="1" Content="Auf/Zu">
            <CheckBox.Style>
                <Style TargetType="CheckBox">
                    <Style.Triggers>
                        <EventTrigger RoutedEvent="CheckBox.IsChecked">
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="b1" Storyboard.TargetProperty="Height" From="0" To="200" Duration="0:0:2"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </EventTrigger>
    
                        <!--<DataTrigger Binding="{Binding ElementName=cb1, Path=IsChecked}" Value="True">
                        <DataTrigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="b1" Storyboard.TargetProperty="Height" From="0" To="200" Duration="0:0:2"/>
                                </Storyboard>
                            </BeginStoryboard>
                        </DataTrigger.EnterActions>
                    </DataTrigger>-->
                    </Style.Triggers>
                </Style>
            </CheckBox.Style>
        </CheckBox>
    </Grid>
    

    • Bearbeitet perlfred Montag, 21. Januar 2019 10:24 Testvorlage
    Montag, 21. Januar 2019 08:56

Antworten

  • Hallo!

    Der Event-Name der CheckBox von Checked ist ToggleButton.Checked!

    <CheckBox x:Name="cb1" Grid.Row="1" Content="Auf/Zu">
        <CheckBox.Triggers>
            <EventTrigger RoutedEvent="ToggleButton.Checked">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="b1" Storyboard.TargetProperty="Height" From="0" To="200" Duration="0:0:2"/>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
    
            <EventTrigger RoutedEvent="ToggleButton.Unchecked">
                <BeginStoryboard>
                    <Storyboard>
                        <DoubleAnimation Storyboard.TargetName="b1" Storyboard.TargetProperty="Height" From="200" To="0" Duration="0:0:2"/>
                    </Storyboard>
                </BeginStoryboard>
            </EventTrigger>
        </CheckBox.Triggers>
    </CheckBox>



    • Als Antwort markiert perlfred Montag, 21. Januar 2019 11:22
    • Bearbeitet perlfred Montag, 21. Januar 2019 14:51
    Montag, 21. Januar 2019 11:22