728x90
728x170
CommunityToolkit.Mvvm 을 이용하면 간단한 코드로 Mvvm 구현이 가능하다.
우선 프로젝트의 Nuget 패키지 관리자에서 시험판 포함을 체크하고
CommunityToolkit.Mvvm 를 설치한다.
ViewModel 에서 property 와 command 를 아래처럼 선언하게 되면 view 에서 사용이 가능하게된다.
MainViewModel.cs
using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;
namespace Maui.ToolKitTest.ViewModels
{
[INotifyPropertyChanged]
internal partial class MainViewModel
{
[ObservableProperty]
private string inputText = "";
[RelayCommand]
private void Reset()
{
InputText = "";
}
public MainViewModel()
{
}
}
}
View 에서 inputText 은 InputText 으로 Reset 은 ResetCommand 로 사용할수 있게된다.
MainView.xaml
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Maui.ToolKitTest.Views.MainView">
<ScrollView>
<VerticalStackLayout
Spacing="25"
Padding="30,0"
VerticalOptions="Center">
<Entry
Text="{Binding InputText}"
SemanticProperties.HeadingLevel="Level2"
FontSize="18"
HorizontalOptions="Center" />
<Button
Text="Reset"
SemanticProperties.Hint="Reset Text"
Command="{Binding ResetCommand}"
HorizontalOptions="Center" />
</VerticalStackLayout>
</ScrollView>
</ContentPage>
MainView.xaml.cs
using Maui.ToolKitTest.ViewModels;
namespace Maui.ToolKitTest.Views
{
public partial class MainView : ContentPage
{
public MainView()
{
InitializeComponent();
this.BindingContext = new MainViewModel();
}
}
}
소스
https://github.com/kei-soft/KJunBlog/tree/master/Maui.ToolKitTest
728x90
그리드형
'C# > Xamarin Maui' 카테고리의 다른 글
[.NET MAUI] Lottie 파일 적용하기 (0) | 2022.07.29 |
---|---|
[.NET MAUI] CommunityToolkit.Mvvm 사용하기 2 (0) | 2022.07.27 |
[.NET MAUI] File Picker (0) | 2022.06.28 |
[.NET MAUI] Gallery 사진 파일 가져오기 (0) | 2022.06.28 |
[.NET MAUI] LoginPage 만들기 (0) | 2022.05.31 |