Binding in Storyboard

  • WPF

Es gibt 10 Antworten in diesem Thema. Der letzte Beitrag () ist von Nofear23m.

    Binding in Storyboard

    Ich habe mich etwas mit dem Thread 2.1.1.3 Videocast: Controls eine neue Optik verpassen von @Nofear23m beschäftigt.
    Ist es möglich, bei der Animation

    XML-Quellcode

    1. <Storyboardx:Key="OnChecking">
    2. <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="slider" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(TranslateTransform.X)">
    3. <SplineDoubleKeyFrame KeyTime="00:00:00.2" Value="30"/>
    4. </DoubleAnimationUsingKeyFrames>
    5. </Storyboard>
    den Value dynamisch zu gestalten, anstatt einen festen Wert wie hier "30"? Beispielsweise über Binding an ActualWidth von "slider".
    Habe das mal so versucht und bekomme dann einen Error "Cannot freeze this Storyboard..."

    Einen festen Wert finde ich nicht ideal, weil ja dann das Control immer die gleiche Größe haben muss.

    Hallo

    Nur mit dem Schnippsel alleine sehe ich zu wenig um genaueres nachvollziehewn zu können aber ansich ist Binding auf Value kein Problem.

    Hier en Beispiel:

    XML-Quellcode

    1. <Window x:Class="MainWindow"
    2. xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    3. xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    4. xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    5. xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    6. xmlns:local="clr-namespace:WpfApp1"
    7. mc:Ignorable="d"
    8. Title="MainWindow" Height="450" Width="800">
    9. <StackPanel>
    10. <StackPanel Orientation="Horizontal" Margin="10">
    11. <Label>Endgröße</Label>
    12. <TextBox Name="txtEndSize" VerticalContentAlignment="Center" Text="100" Width="60"/>
    13. <Button Content="Go!" Margin="5,0">
    14. <Button.Triggers>
    15. <EventTrigger RoutedEvent="Button.Click">
    16. <BeginStoryboard>
    17. <Storyboard>
    18. <DoubleAnimationUsingKeyFrames Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Width">
    19. <SplineDoubleKeyFrame KeyTime="0:0:1" Value="{Binding ElementName=txtEndSize, Path=Text}" />
    20. </DoubleAnimationUsingKeyFrames>
    21. <DoubleAnimationUsingKeyFrames Storyboard.TargetName="MyRectangle" Storyboard.TargetProperty="Height">
    22. <SplineDoubleKeyFrame KeyTime="0:0:1" Value="{Binding ElementName=txtEndSize, Path=Text}" />
    23. </DoubleAnimationUsingKeyFrames>
    24. </Storyboard>
    25. </BeginStoryboard>
    26. </EventTrigger>
    27. </Button.Triggers>
    28. </Button>
    29. </StackPanel>
    31. <Rectangle Name="MyRectangle" Fill="BlueViolet" Height="50" Width="50">
    33. </Rectangle>
    34. </StackPanel>
    36. </Window>


    Grüße
    Sascha
    If _work = worktype.hard Then Me.Drink(Coffee)
    Seht euch auch meine Tutorialreihe <WPF Lernen/> an oder abonniert meinen YouTube Kanal.

    ## Bitte markiere einen Thread als "Erledigt" wenn deine Frage beantwortet wurde. ##

    Ich habe den Style eines ToggleButtons wie folgt angepasst:

    XML-Quellcode

    1. <ToggleButton x:Name="toggler" Height="30" Width="60">
    2. <ToggleButton.Style>
    3. <Style TargetType="{x:Type ToggleButton}">
    4. <Setter Property="Template">
    5. <Setter.Value>
    6. <ControlTemplate TargetType="{x:Type ToggleButton}">
    7. <ControlTemplate.Resources>
    8. <Storyboard x:Key="OnChecking">
    9. <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Slider" Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.X)">
    10. <SplineDoubleKeyFrame KeyTime="00:00:00.2" Value="27" />
    11. </DoubleAnimationUsingKeyFrames>
    12. </Storyboard>
    13. <Storyboard x:Key="OnUnchecking">
    14. <DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="Slider" Storyboard.TargetProperty="(UIElement.RenderTransform).(TranslateTransform.X)">
    15. <SplineDoubleKeyFrame KeyTime="00:00:00.2" Value="0" />
    16. </DoubleAnimationUsingKeyFrames>
    17. </Storyboard>
    18. </ControlTemplate.Resources>
    19. <Border BorderBrush="{TemplateBinding BorderBrush}" Background="{TemplateBinding Background}">
    20. <Grid>
    21. <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center"/>
    22. <Rectangle Name="Slider" Width="12" HorizontalAlignment="Left" Fill="WhiteSmoke" Stroke="Black">
    23. <Rectangle.RenderTransform>
    24. <TranslateTransform X="0" Y="0" />
    25. </Rectangle.RenderTransform>
    26. </Rectangle>
    27. </Grid>
    28. </Border>
    29. <ControlTemplate.Triggers>
    30. <Trigger Property="IsChecked" Value="True">
    31. <Trigger.ExitActions>
    32. <BeginStoryboard Storyboard="{StaticResource OnUnchecking}" />
    33. </Trigger.ExitActions>
    34. <Trigger.EnterActions>
    35. <BeginStoryboard Storyboard="{StaticResource OnChecking}" />
    36. </Trigger.EnterActions>
    37. </Trigger>
    38. </ControlTemplate.Triggers>
    39. </ControlTemplate>
    40. </Setter.Value>
    41. </Setter>
    42. </Style>
    43. </ToggleButton.Style>
    44. </ToggleButton>

    Beim Storyboard OnChecking passt der Value="27" für die hier exemplarische Width von 60 des Togglebuttons nicht.
    Und beim binden an ActualWidth von "toggler" bekomme ich einen Error

    OK, ich sags nochmal.

    Poste den code der benötigt wird um dein Beispiel auszuführen.
    Wir haben nicht die Zeit um zu versuchen dein Beispiel nachzubauen.

    z.b. die Resourcen OnUnchecking und OnChecking fehlen. (welche ja wichtig sind um das Beispiel nachvollziehen zu können)

    Füge deinen Code in ein leeres Projekt ein und wenn das klappt Poste ihn.

    Grüße
    Sascha
    If _work = worktype.hard Then Me.Drink(Coffee)
    Seht euch auch meine Tutorialreihe <WPF Lernen/> an oder abonniert meinen YouTube Kanal.

    ## Bitte markiere einen Thread als "Erledigt" wenn deine Frage beantwortet wurde. ##

    Bei mir ist das auch bei neuen/leeren Projekten sofort ausführbar. Also einfach den kompletten Code von <ToggleButton ...> bis </ToggleButton>, quasi Zeile 1 bis 44 vom oben eingefügten Code in beispielsweise ein leeres Window oder wo auch immer einfügen und starten.

    Die Resourcen OnChecking und OnUnchecking sollten eigentlich nicht fehlen, die sind ja innerhalb des Templates in

    XML-Quellcode

    1. <ControlTemplate TargetType="{x:Type ToggleButton}">
    2. <ControlTemplate.Resources>... </ControlTemplate.Resources>
    3. ...</ControlTemplate>
    erst festgelegt, nicht außerhalb vom ToggleButton.
    Aber gut, habe es mal in einem neuen Projekt gemacht.
    Dateien

    • WpfApp1.zip

      (16,53 kB, 91 mal heruntergeladen, zuletzt: )

    Hallo

    Sorry, mein Fehler. die Copy&Paste Bremse hat zugeschlagen ;)

    Ich schau mir das am Abend gerne genauer an, das gibts ein threadingproblem, hatte ich bisher auch noch nicht.

    Grüße
    Sascha
    If _work = worktype.hard Then Me.Drink(Coffee)
    Seht euch auch meine Tutorialreihe <WPF Lernen/> an oder abonniert meinen YouTube Kanal.

    ## Bitte markiere einen Thread als "Erledigt" wenn deine Frage beantwortet wurde. ##

    Hallo

    Sorry für meine lange abwesenheit.
    Leider nein, ich hatte bisher nur kurz Zeit und habe es mal schnell testet. Der Fehler ist mir schleierhaft, hatte ich noch nie bei einem meiner Projekte.
    Leider im Moment wegen eines Projekts nicht genug Zeit um das genauer zu Analysieren, ich kann dir im Moment zu einem anderen ansatz raten.

    Sorry, tut mir echt leid. ||

    Grüße
    Sascha
    If _work = worktype.hard Then Me.Drink(Coffee)
    Seht euch auch meine Tutorialreihe <WPF Lernen/> an oder abonniert meinen YouTube Kanal.

    ## Bitte markiere einen Thread als "Erledigt" wenn deine Frage beantwortet wurde. ##

    Schmittmuthelm schrieb:

    Falls irgendwann noch jemand was zu der Storyboard-Geschichte findet, wäre ich auf jeden Fall an einer Lösung interessiert!

    Sobald ich wieder etwas mehr "Luft" habe schau ich mir das auf jeden Fall an. Interessiert mich ja selbst.

    Grüße
    Sascha
    If _work = worktype.hard Then Me.Drink(Coffee)
    Seht euch auch meine Tutorialreihe <WPF Lernen/> an oder abonniert meinen YouTube Kanal.

    ## Bitte markiere einen Thread als "Erledigt" wenn deine Frage beantwortet wurde. ##