首页 > 解决方案 > 如何知道 ListView 中使用了哪个开关以及如何在 ViewModel 中为其创建和事件?

问题描述

Board.xaml

                <ListView ItemsSource="{Binding SwitchesList}" HasUnevenRows="True" SeparatorColor="White">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <StackLayout Orientation="Horizontal" Padding="5" BackgroundColor="Transparent">
                                <Image Source="{Binding ImageURL}"></Image>
                                <StackLayout HorizontalOptions="StartAndExpand" VerticalOptions="Center">
                                    <Label Text="{Binding Name}" FontSize="22" TextColor="White" VerticalOptions="Center"></Label>
                                </StackLayout>
                                <Switch x:Name="{Binding Name}" IsToggled="{Binding State, Mode=TwoWay}" Toggled="Switch_Toggled"></Switch>
                            </StackLayout>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

Board.xaml.cs

public Board ()
    {
        InitializeComponent ();
        var switchModel = new SwitchModel();
        BindingContext = switchModel;


    }

SwitchModel 作为 ViewModel

public class SwitchModel : INotifyPropertyChanged
{
    public List<SwitchDTO> SwitchesList { get; set; }


    public SwitchModel()
    {
        SwitchesList =new List<SwitchDTO>
        {
            new SwitchDTO { Name = "FanSwitch", ImageURL = "windmill.png" ,State=true},
            new SwitchDTO { Name = "LightSwitch", ImageURL = "plug.png" ,State=false},
            new SwitchDTO { Name = "Switch3", ImageURL = "light.png" ,State=true}
        };
    }


    string _Name;

    public string Name
    {
        get
        {
          return _Name;
        } set
        {
            _Name = value;
        }
    }




    //bool _isOwned;

    //public event PropertyChangedEventHandler PropertyChanged;

    //public bool IsOwned
    //{
    //    get
    //    {
    //        return _isOwned;
    //    }
    //    set
    //    {
    //        _isOwned = value;
    //        var c = Name;

    //        // Do any other stuff you want here
    //    }
    //}




}

我已经通过视图模型在列表视图中动态创建了开关,问题是如何在视图模型中触发开关事件以及如何知道哪个开关是用值打开或关闭切换的。

如果我使用切换事件后面的代码,则每次通过视图模型列表绑定行时都会单击事件

我怎么知道在我的视图模型中切换了风扇或电灯开关,我查找了许多示例,例如https://forums.xamarin.com/discussion/126130/how-to-get-the-id-of-the -toggled-switch-item-in-the-listview但似乎没有提供足够的信息如何做到这一点,而无需在后面的代码中编写代码,例如

标签: xamarin.formsmvvmcross

解决方案


您可以通过将以下代码添加到您的Board.xaml.cs

    void Switch_Toggled(object sender, EventArgs args)
    {
        Switch sw1 = sender as Switch;

        ViewCell vc1 = sw1.Parent.Parent as ViewCell;
        SwitchDTO model = vc1.BindingContext as SwitchDTO;
        Console.WriteLine(model.Name);
        Console.WriteLine(model.State);
        Console.WriteLine(model.ImageURL);
    }

如果你真的不想使用后面的代码,你可以将一些属性绑定到 switch 的 IsToggled 属性的相同值:

         <ViewCell>
                <StackLayout Orientation="Horizontal" Padding="5" BackgroundColor="Transparent">
                    <Image Source="{Binding ImageURL}"></Image>
                    <StackLayout HorizontalOptions="StartAndExpand" VerticalOptions="Center">
                        <Label Text="{Binding Name}" FontSize="22" TextColor="Blue" VerticalOptions="Center" 
                            IsVisible="{Binding State}"></Label>
                    </StackLayout>
                    <Switch x:Name="switch1" IsToggled="{Binding State}" Toggled="Switch_Toggled" ></Switch>
                </StackLayout>
            </ViewCell>

推荐阅读