绑定属性在 Xamarin 中不起作用答案

【问题标题】：Binding on Property not working in Xamarin绑定属性在 Xamarin 中不起作用
【发布时间】：2020-11-30 11:41:58
【问题描述】：

我正在尝试创建一个自定义 ContentView，它可以在我的 Xamarin.Froms 应用程序中以 de xaml 视图使用。 IconColor 上的绑定不起作用。我遵循了文档ContentView，但它似乎不起作用。 FontImageSource 的颜色从未设置。我在这里错过了什么？

<?xml version="1.0" encoding="UTF-8" ?>
<ContentView
    x:Class="Peripass.Mobile.Framework.UIControls.PeripassIcon"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:d="http://xamarin.com/schemas/2014/forms/design"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
  <ContentView.Resources>
  </ContentView.Resources>
  <ContentView.Content>
    <StackLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
      <Image>
        <Image.Source>
          <FontImageSource x:Name="_icon" Glyph="" Color="{Binding IconColor}" Size="20" FontFamily="{OnPlatform  Android=PeripassIcon.ttf#}" />
        </Image.Source>
      </Image>
    </StackLayout>
  </ContentView.Content>
</ContentView>

using System.Text;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;

namespace Peripass.Mobile.Framework.UIControls {
  [XamlCompilation(XamlCompilationOptions.Compile)]
  public partial class PeripassIcon : ContentView {

    public static readonly BindableProperty IconSizeProperty = BindableProperty.Create(nameof(IconSize), typeof(double), typeof(PeripassIcon), 26.0);
    public static readonly BindableProperty IconColorProperty = BindableProperty.Create(nameof(IconColor), typeof(Color), typeof(PeripassIcon), Color.White);
    public static readonly BindableProperty IconNameProperty = BindableProperty.Create(nameof(IconName), typeof(IconType?), typeof(PeripassIcon));

    public PeripassIcon() {
      InitializeComponent();
    }

    public IconType IconName {
      get => (IconType)GetValue(IconNameProperty);
      set => SetValue(IconNameProperty, value);
    }

    public double IconSize {
      get => (double)GetValue(IconSizeProperty);
      set => SetValue(IconSizeProperty, value);
    }

    public Color IconColor {
      get => (Color)GetValue(IconColorProperty);
      set => SetValue(IconColorProperty, value);
    }

    protected override void OnPropertyChanged(string propertyName = null) {
      base.OnPropertyChanged(propertyName);
      if (propertyName == IconNameProperty.PropertyName) {
        _icon.Glyph = $"&#x{(int)IconName:X4};";
      }
    }
  }
}

<StackLayout Grid.Row="1" Grid.Column="0">
    <uiControls:PeripassIcon IconName="{Binding Model.Icon}" IconColor="#EE4022" IconSize="85.5"/>
</StackLayout>

【问题讨论】：

您可能需要将控件的BindingContext 设置为自身。我对 Xamarin.Forms 不是很熟悉，这里只是猜测一下。
成功了
你可以从stackoverflow.com/questions/64695781/…查看我的回答。

标签： c# xamarin xamarin.forms

【解决方案1】：

我需要像这样设置 BindingContext：

<?xml version="1.0" encoding="UTF-8" ?>
<ContentView
    x:Class="Peripass.Mobile.Framework.UIControls.PeripassIcon"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:d="http://xamarin.com/schemas/2014/forms/design"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    x:Name="this">
  <ContentView.Resources>
  </ContentView.Resources>
  <ContentView.Content>
    <StackLayout BindingContext="{x:Reference this}" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
      <Image>
        <Image.Source>
          <FontImageSource x:Name="_icon" Glyph="" Color="{Binding IconColor}" Size="{Binding IconSize}" FontFamily="{OnPlatform  Android=PeripassIcon.ttf#}" />
        </Image.Source>
      </Image>
    </StackLayout>
  </ContentView.Content>
</ContentView>

【讨论】：

【解决方案2】：

MVVM 中的最佳做法是将 View 与 ViewModel 分开，因此最好的方法是将 BindingContext 设置为 ViewModel（而不是 View via {x:Reference this}）。

确保在 Code behind 或 Xaml 中将页面绑定上下文设置为您的 ViewModel，其余的定义正确。

【讨论】：