具有Bindable屬性的自定義視圖在Xamarin.Forms SAP上無法正確綁定

Question

我有一個復選框，它應該觸發按鈕的IsEnabled事件。 但不知何故，應該這樣做的命令永遠不會被正確綁定並因此被執行。

這是CheckBox.xaml.cs（控件）中的可綁定屬性：

public static readonly BindableProperty CheckBoxCommandProperty =
       BindableProperty.Create<CheckBox, ICommand>(
       checkbox =>
           checkbox.CheckBoxCommand,
           null,
           propertyChanged: (bindable, oldValue, newValue) =>
               {
                   CheckBox checkbox = (CheckBox)bindable;
                   EventHandler<bool> eventHandler = checkbox.CheckedChanged;
                   if (eventHandler != null)
                   {
                       eventHandler(checkbox, checkbox.IsChecked);
                   }
               });

   public event EventHandler<bool> CheckedChanged;

   public ICommand CheckBoxCommand
   {
       get { return (ICommand)GetValue(CheckBoxCommandProperty); }
       set { SetValue(CheckBoxCommandProperty, value); }
   }

這就是我在ViewModel上的內容：

   public ICommand Next_OnClick { get; set; }
   public ICommand OnCheckBoxTapChanged { get; set; }

   public TermsAndConditionsViewModel()
   {
       Next_OnClick = new Command(NextClicked);
       OnCheckBoxTapChanged = new Command(CheckBoxTapped);
   }

   private void CheckBoxTapped()
   {
       if (IsCheckedChanged)
       {
           Next_IsEnabled = true;
       }
       else
       {
           Next_IsEnabled = false;
       }
   }

CheckBoxTapped方法永遠不會被執行，因此我想要設置的按鈕屬性永遠不會改變。

在此先感謝大家！

Answer 1

你可以做的是將這個問題的解決方案分為幾個層次：

首先，為復選框創建一個可綁定屬性，並將其命名為Checked。 我已經為它寫了一個snippit，但沒有真正編譯它所以你可能想要修改它，如果它不起作用

  public static readonly BindableProperty IsCheckedProperty = 
    BindableProperty.Create<CheckBox, bool> (w => w.IsChecked, false);

  public bool IsChecked{
    get { return GetValue (FooProperty); }
    set { SetValue (FooProperty, value); } 
  }

其次，在視圖模型中創建一個具有更改通知的bool屬性

private bool _isChecked;
public bool IsChecked
{
    get 
    { 
        return _isChecked;
    }
    set
    {
        _isChecked = value;
        RaisePropertyChanged("IsChecked");
    }
} 

第三，將復選框“isChecked”的可綁定屬性綁定到xaml中視圖模型中的屬性：

<StackLayout>
    <Checkbox IsChecked = "{Binding IsChecked}"/>
</StackLayout>

第四，Xaml與MVVM中的按鈕綁定命令。 在這些命令中，有一個bool屬性代表“CanExecute”，它基本上啟用或禁用按鈕。 所以你在Xaml中要做的就是將按鈕的命令綁定到View Model中的命令（讓我們稱之為ClickCommand）。 ClickCommand的CanExecute實際上只是一個返回“IsChecked”值的方法。 這將使我們修改“IsChecked”屬性的setter，因此每次更改時都應該通知命令檢查CanExecute屬性。

所以最終的代碼就像是

public TermsAndConditionsViewModel()
   {
       NextCommand = new Command(ExecuteNextCommand,CanExecuteNextCommand);
       OnCheckBoxTapChanged = new Command(CheckBoxTapped);
   }


private bool _isChecked;
public bool IsChecked
{
    get { return _isChecked;}
    set
    {
         _isChecked = value;
    NextCommand.ChangeCanExecute(); //this will actually notify the command to enable/disable
        RaisePropertyChanged("IsChecked");
    }
}


public Command NextCommand {get;set;} // this type is available in Xamarin.Forms library
private bool CanExecuteNextCommand()
{
    return IsChecked;
}
private void ExecuteNextCommand()
{
    // your execution when the button is pressed    
}

而Xaml就像

<StackLayout>
    <Checkbox IsChecked = "{Binding IsChecked}"/>
    <Button Text= "Next" Command = "{Binding NextCommand}"/>
</StackLayout> 

Answer 2

使用Xamarin.Forms.Behavior解決了它。 它允許多個綁定到控件。

例如>

<Entry Placeholder="Enter password"
             Text= "{Binding TxtFirstPasswordInput}"
             IsPassword="true">
        <b:Interaction.Behaviors>
          <b:BehaviorCollection>
            <b:EventToCommand EventName="Unfocused" Command="{Binding entry_Finished}"/>
            <b:EventToCommand EventName="Focused" Command="{Binding entry_Focused}"/>
          </b:BehaviorCollection>
        </b:Interaction.Behaviors>
      </Entry>

並在ViewModel>上

public PasswordInputViewModel()
        {
            entry_Finished = new Command(validateAndContinue);//unfocused
            entry_Focused = new Command(entryFocused); //focused
        }