Is it possible to modify a property in the view model from the view using MVVM?

Question

After avoiding MVVM for weeks, I finally decided to give it another shot. In my head, what I am trying to achieve is relatively simple. I want to shrink a frame, update the text within the frame, then enlarge the frame again to its normal size

In my codebehind, I have a method that scales a frame to 0.1 when the frame is tapped. I have this as a gesture recognizer in the code behind because my understanding was that animations had to be in the view.

In my ViewModel, I have a property called FrameText. This is the value I want to update. I want to update the property before it scales back up. So this is what I came up with.

>await TestFrame.ScaleTo(0.1, 60, Easing.Linear);  
>ViewModels.MainViewModel.FrameText = "new text";  
>await TestFrame.ScaleTo(1, 60, Easing.Linear);

I quickly realized that this is flawed, but after spending a few hours trying to understand how MVVM works I figured it was better to ask. Should I not use MVVM here at all? Am I misunderstanding how MVVM works? Thank you in advance.

"shrink a frame, update the text within the frame, then enlarge the frame" - this all sounds like UI operations that have nothing to do with the underlying data. — Jason, Nov 07 '21 at 13:00
@Jason thanks for the comment, but I think I am misunderstanding something. I have the operations that shrink the frame and enlarge it in my code behind because they are UI operations. I want to update the text between the two animations but the property is in my ViewModel. How would I go about modifying the property in my ViewModel from the view so that it happens between the two animations? Am I approaching this entire thing incorrectly or should I simply not use MVVM and different way to bind the data? I am new to using MVVM so any help would be greatly apreciated. — foxre, Nov 07 '21 at 13:40
why not expose a command in the VM that is triggered when the animation completes, and would update the text? — Jason, Nov 07 '21 at 13:48
How would I go about that? I have a command that would update the text, but I don't know how to trigger it after the animation completes. I know how to trigger a command from XAML, but I did not know it was possible to trigger a command from the codebehind — foxre, Nov 07 '21 at 14:09
https://stackoverflow.com/questions/10126968/call-command-from-code-behind — Jason, Nov 07 '21 at 14:16
oh, thank you so much! sorry for asking a question that was already answered. thanks for the help! — foxre, Nov 07 '21 at 14:33
Alternatively, you can update the text in view, and let two-way binding do the work back to VM? — Shaw, Nov 08 '21 at 02:25

score 0 · Answer 1 · answered Nov 08 '21 at 08:48

I couldn't see other code,but in general, if we want to update UI once changing the value of a property which is binded to a view, we can make our ViewModel implement interface INotifyPropertyChanged. A class that implements this interface generally fires the event when one of its public properties changes value.

Please refer to the following code:

public class MainViewModel: INotifyPropertyChanged
{
    string _frameText;

    public string FrameText
    {
        set { SetProperty(ref _frameText, value); }

        get { return _frameText; }
    }

    bool SetProperty<T>(ref T storage, T value, [CallerMemberName] string propertyName = null)
    {
        if (Object.Equals(storage, value))
            return false;

        storage = value;
        OnPropertyChanged(propertyName);
        return true;
    }

    protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }

    public event PropertyChangedEventHandler PropertyChanged;
}

For more, check:https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/data-binding/binding-mode#viewmodels-and-property-change-notifications

Is it possible to modify a property in the view model from the view using MVVM?

1 Answers1