Rive Animation and Events
Posted: 22 Jul 2023, 10:34
Hello,
After a long period with out playing with Noesis, i come back to test the rive new feature, for me it works just like magic !
I tried to test the rating animation that is a demo animation from there website. I could import it and run it without any problems.
https://drive.google.com/file/d/1Loa5ra ... sp=sharing
I could to binding the the value from the animation to set it from my user control. But the animation is interactive and it seam that i couldn't have my clic on the rating to set my value in my usercontrol. I set my binding in mode two ways and nothing.
this is my code :
MY XAML
To be perfectly clear i wan't to be able to click on my animation to set my rating value in my usercontrol !
Thanks you for your time
After a long period with out playing with Noesis, i come back to test the rive new feature, for me it works just like magic !
I tried to test the rating animation that is a demo animation from there website. I could import it and run it without any problems.
https://drive.google.com/file/d/1Loa5ra ... sp=sharing
I could to binding the the value from the animation to set it from my user control. But the animation is interactive and it seam that i couldn't have my clic on the rating to set my value in my usercontrol. I set my binding in mode two ways and nothing.
this is my code :
Code: Select all
#if UNITY_5_3_OR_NEWER
#define NOESIS
using Noesis;
using System;
#else
using System.Windows;
using System.Windows.Controls;
#endif
namespace Testing
{
public partial class UserControl: Noesis.UserControl
{
public UserControl()
{
InitializeComponent();
}
public int Counter
{
get { return (int)GetValue(CounterProperty); }
set { SetValue(CounterProperty, value); }
}
public static readonly DependencyProperty CounterProperty = DependencyProperty.Register(
"Counter", typeof(int), typeof(UserControl), new PropertyMetadata(0));
//rating rive test animation and data WORKS JUST IN ONE WAY C# => View
public float Rating
{
get { return (float)GetValue(RatingProperty); }
set { SetValue(RatingProperty, value); }
}
public static readonly DependencyProperty RatingProperty = DependencyProperty.Register(
"Rating", typeof(float), typeof(UserControl), new PropertyMetadata(0f));
#if NOESIS
protected override bool ConnectEvent(object source, string eventName, string handlerName)
{
if (eventName == "Click" && handlerName == "Button_Click")
{
((Button)source).Click += this.Button_Click;
return true;
}
else if (eventName == "MouseEnter" && handlerName == "Rv_MouseOn")//test event on rive animation WORKS
{
((RiveControl)source).MouseEnter += this.Rv_MouseOn;
return true;
}
else if (eventName == "GotMouseCapture" && handlerName == "Rv_MouseCapture")//test event on rive animation NOT WORKS
{
((RiveControl)source).GotMouseCapture += this.Rv_MouseCapture;
return true;
}
else if (eventName == "MouseLeftButtonUp" && handlerName == "Rv_MouseClickDown")//test event on rive animation NOT WORKS
{
((RiveControl)source).MouseLeftButtonUp += this.Rv_MouseClickDown;
return true;
}
return false;
}
private void InitializeComponent()
{
NoesisUnity.LoadComponent(this);
//retreive the rive animation
RiveControl rv = (RiveControl)FindName("Rating_Animation");
rv.Visibility = Visibility.Visible;
Rating = 3f;
}
private void Rv_MouseOn(object sender, MouseEventArgs args)
{
UnityEngine.Debug.Log("enter : "+args.LeftButton);
}
private void Rv_MouseCapture(object sender, MouseEventArgs args)
{
UnityEngine.Debug.Log("capture : " + args.LeftButton);
}
private void Rv_MouseClickDown(object sender, MouseButtonEventArgs args)
{
UnityEngine.Debug.Log("click");
}
#endif
private void Button_Click(object sender, RoutedEventArgs args)
{
Counter++;
UnityEngine.Debug.Log("enter : " + Rating);
if (Rating < 5)
Rating++;
else Rating = 0;
}
}}Code: Select all
<UserControl
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:NoesisGUIExtensions="clr-namespace:NoesisGUIExtensions;assembly=Noesis.GUI.Extensions" mc:Ignorable="d" x:Class="Testing.UserControl"
x:Name="Root"
d:DesignWidth="1920" d:DesignHeight="1080"
>
<UserControl.Resources>
<Storyboard x:Key="OnLoaded1">
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[3].(TranslateTransform.X)" Storyboard.TargetName="stackPanel">
<EasingDoubleKeyFrame KeyTime="0" Value="-200"/>
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="0">
<EasingDoubleKeyFrame.EasingFunction>
<CircleEase EasingMode="EaseOut"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
<DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="stackPanel">
<EasingDoubleKeyFrame KeyTime="0" Value="0"/>
<EasingDoubleKeyFrame KeyTime="0:0:1" Value="1">
<EasingDoubleKeyFrame.EasingFunction>
<CircleEase EasingMode="EaseOut"/>
</EasingDoubleKeyFrame.EasingFunction>
</EasingDoubleKeyFrame>
</DoubleAnimationUsingKeyFrames>
</Storyboard>
</UserControl.Resources>
<UserControl.Triggers>
<EventTrigger RoutedEvent="FrameworkElement.Loaded">
<BeginStoryboard Storyboard="{StaticResource OnLoaded1}"/>
</EventTrigger>
</UserControl.Triggers>
<Grid>
<StackPanel x:Name="stackPanel" Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center" RenderTransformOrigin="0.5,0.5" d:LayoutOverrides="LeftMargin, RightMargin, TopMargin, BottomMargin">
<StackPanel.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform/>
<TranslateTransform/>
</TransformGroup>
</StackPanel.RenderTransform>
<Button Content="Click me" Click="Button_Click" Width="200" Height="100" FontSize="20"/>
<TextBlock Text="{Binding Counter, ElementName=Root, StringFormat=Button clicked \{0\} time(s)}" Margin="5,0,0,0" VerticalAlignment="Center"/>
</StackPanel>
<NoesisGUIExtensions:RiveControl MouseEnter="Rv_MouseOn" GotMouseCapture="Rv_MouseCapture" MouseLeftButtonUp="Rv_MouseClickDown" x:Name="Rating_Animation" Width="846.4" Source="rating_animation.riv" Height="324.8" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="100,100,0,0">
<NoesisGUIExtensions:RiveInput InputName="rating" InputValue="{Binding Rating, ElementName=Root, Mode=TwoWay}"/>
</NoesisGUIExtensions:RiveControl>
</Grid>
</UserControl>Thanks you for your time