英文:
Binding switch Toggled property
问题
我想知道是否可以绑定开关控件的切换属性,如果可以的话,该如何操作?
<Switch
    Grid.Column="1"
    HorizontalOptions="End"
    VerticalOptions="Center"
    Margin="20,0"
    OnColor="#00CD00"
    ThumbColor="White"
    Toggled="Binding SomeFunction" />
谢谢!
英文:
I would like to know if is possible to bind a Toggled property of switch control, and if so, then how?
<Switch
Grid.Column="1"
HorizontalOptions="End" 
VerticalOptions="Center"
Margin="20,0"
OnColor="#00CD00"
ThumbColor="White"
Toggled="Binding SomeFunction"/>
Thanks
答案1
得分: 1
你可以使用 Maui CommunityToolkit 的 EventToCommandBehavior。
首先,请安装 CommunityToolkit.Maui Nuget 并初始化该包。
在 MauiProgram.cs 中,添加 UseMauiCommunityToolkit():
using CommunityToolkit.Maui;
...
public static class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
        var builder = MauiApp.CreateBuilder();
        builder
            .UseMauiApp<App>()
            .UseMauiCommunityToolkit()
            .ConfigureFonts(fonts =>
            ...
然后,在 XAML 中,将 EventToCommandBehavior 添加到 Switch。这允许我们将 Switch 上的 Toggled 事件映射到 ViewModel 中定义的命令(如果使用 MVVM 方法)。
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
...
     xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
<Switch
   HorizontalOptions="End"
   VerticalOptions="Center"
   Margin="20,0"
   OnColor="#00CD00"
   ThumbColor="White"
   >
   <Switch.Behaviors>
       <toolkit:EventToCommandBehavior
           EventName="Toggled"
           Command="{Binding ToggledCommand}" />
   </Switch.Behaviors>
</Switch>
在 .cs 文件中,为 MainPage 设置 BindingContext:
public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();
        this.BindingContext = new MainPageViewModel();
    }
...
在 ViewModel 文件中,定义 ToggledCommand,类似于以下方式:
public class MainPageViewModel
{
    public Command ToggledCommand
    {
        get
        {
            return new Command(() =>
            {
                // 在这里可以添加你的功能
                Console.WriteLine("123");
            });
        }
    }
}
当你切换开关时,ViewModel 中的 ToggledCommand 中的代码将被执行。
希望这对你有帮助。
英文:
You could use Maui CommunityToolkit EventToCommandBehavior.
First, please install CommunityToolkit.Maui Nuget and initialize the package.
In MauiProgram.cs, add UseMauiCommunityToolkit() :
using CommunityToolkit.Maui;
...
public static class MauiProgram
{
    public static MauiApp CreateMauiApp()
    {
	    var builder = MauiApp.CreateBuilder();
	    builder
		    .UseMauiApp<App>()
		    .UseMauiCommunityToolkit()
            .ConfigureFonts(fonts =>
...
Then in xaml, we add the EventToCommandBehavior to Switch. It allows us to map Toggled event on Switch to a Command defined in viewModel (if use MVVM way).
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
...
     xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit">
<Switch             
   HorizontalOptions="End" 
   VerticalOptions="Center"
   Margin="20,0"
   OnColor="#00CD00"
   ThumbColor="White"
   >
   <Switch.Behaviors>
       <toolkit:EventToCommandBehavior
           EventName="Toggled"
           Command="{Binding ToggledCommand}" />
   </Switch.Behaviors>
</Switch>
In cs file, set the BindingContext for MainPage:
public partial class MainPage : ContentPage
{
    public MainPage()
    {
	    InitializeComponent();
	    this.BindingContext = new MainPageViewModel();
    }
...
In viewModel file, define the ToggledCommand, such like this:
public class MainPageViewModel
{
	public Command ToggledCommand
    {
		get
		{
			return new Command(() =>
			{
                //you could add your function here					
                Console.WriteLine("123");
			});
		}
	}
When you toggle the switch, the code in ToggledCommand in ViewModel will execute.
Hope it works.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。


评论