Forum Xamarin.Forms

How to use animation in viewModels?

lescperlescper Member ✭✭✭✭✭

I created a viewmodel for the xaml page.

there is a stackLayout in the xaml I want to animate it in the viewmodels how to do it?

Tagged:

Best Answer

  • LeonLuLeonLu Member, Xamarin Team Xamurai
    Accepted Answer

    You can transfer page when bindingContext.

     public partial class HorizontalGridPage : ContentPage
        {
            public HorizontalGridPage()
            {
                InitializeComponent();
                BindingContext = new MonkeysViewModel(this);
            }
    

    Then you can get this ContentPage in the ViewModel's constructor. get the control that you want to add animation

     public MonkeysViewModel(HorizontalGridPage horizontalGridPage)
            {
                this.horizontalGridPage = horizontalGridPage;
            }
    
    

Answers

  • AlessandroCaliaroAlessandroCaliaro ITMember ✭✭✭✭✭

    You can use something like
    https://stackoverflow.com/a/59152091

    but you should not have "Button" inside your ViewModel... So, your ViewModel could use an Action to execute a method in your xaml.cs that execute the animation.

    there is also https://github.com/jsuarezruiz/Xamanimation#progress-animations that can help you

  • LeonLuLeonLu Member, Xamarin Team Xamurai
    Accepted Answer

    You can transfer page when bindingContext.

     public partial class HorizontalGridPage : ContentPage
        {
            public HorizontalGridPage()
            {
                InitializeComponent();
                BindingContext = new MonkeysViewModel(this);
            }
    

    Then you can get this ContentPage in the ViewModel's constructor. get the control that you want to add animation

     public MonkeysViewModel(HorizontalGridPage horizontalGridPage)
            {
                this.horizontalGridPage = horizontalGridPage;
            }
    
    
  • LeonLuLeonLu Member, Xamarin Team Xamurai

    If I have StackLayout I add Name.

     <StackLayout x:Name="mySl" Margin="20">
    

    Then I can get it like following code.

      public MonkeysViewModel(HorizontalGridPage horizontalGridPage)
            {
                this.horizontalGridPage = horizontalGridPage;
    
             var sl=   horizontalGridPage.Content.FindByName("mySl");
            }
    
  • JohnHardmanJohnHardman GBUniversity admin

    @lescper said:
    I created a viewmodel for the xaml page.

    there is a stackLayout in the xaml I want to animate it in the viewmodels how to do it?

    Animation should not be done in View Models. Animation is a purely UI thing, so should be in either the XAML or code behind (remembering too that the user should be able to disable animation from accessibility settings).

    If you want animation to start/stop as a result of a state change in the View Model, have the View Model raise an event and then have the View react to that event.

  • JohnHardmanJohnHardman GBUniversity admin

    @LeonLu said:
    You can transfer page when bindingContext.

     public partial class HorizontalGridPage : ContentPage
        {
            public HorizontalGridPage()
            {
                InitializeComponent();
                BindingContext = new MonkeysViewModel(this);
            }
    

    Then you can get this ContentPage in the ViewModel's constructor. get the control that you want to add animation

     public MonkeysViewModel(HorizontalGridPage horizontalGridPage)
            {
                this.horizontalGridPage = horizontalGridPage;
            }
    
    

    @lescper

    Doing this breaks MVVM, introduces a circular dependency and increases the likelihood of a memory leak if things are not cleaned up appropriately.

    View Models should not contain UI logic.

Sign In or Register to comment.