Xamarin，XAML。 幫助在 ListView 中綁定顏色

Question

如何在ListView綁定Label顏色？ 我無法以任何方式設置顏色，它顯示標准灰色。 您可以設置某種顏色（例如，紅色），但我需要根據用戶的需要動態更改它。

<ListView
      Style="{StaticResource ListViewStyle}"
      ItemsSource="{Binding Stats}"
      SelectedItem="{Binding CurrentStatParam}"
      HasUnevenRows="true">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"></ColumnDefinition>
                        <ColumnDefinition Width="*"></ColumnDefinition>
                    </Grid.ColumnDefinitions>
                    <Grid Column="0">
                    <Label Text="{Binding Name}" **TextColor="{Binding TextColor}"**/>
                    </Grid>
                    <Grid Column="1">
                    <Label Text="{Binding Value}" **TextColor="{Binding TextColor}"**/>
                    </Grid>
                </Grid>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

public Color TextColor
{
    get => _textColor;
    set
    {
        _textColor = value;
        OnPropertyChanged(nameof(TextColor));
    }
}

<ContentPage.Content>
    <Grid>
        <StackLayout HorizontalOptions="Center" VerticalOptions="Center">
            <Label Text="Back Color" Margin="0,0,0,10" />
            <colorPicker:ColorPickerEntry Color="{Binding BackColor}" />
            <Label Text="Line color" Margin="0,0,0,10" />
            <colorPicker:ColorPickerEntry Color="{Binding LineColor}" />
            <Label Text="Text Color" Margin="0,0,0,10" />
            <colorPicker:ColorPickerEntry Color="{Binding TextColor}" />
        </StackLayout>
        <!--<Button Text="Назад" Command="{Binding BackCmd}"></Button>-->
    </Grid>
</ContentPage.Content>

Answer 1

你想像下面的gif一樣改變顏色嗎？

如果是這樣，首先請實現INotifyPropertyChanged接口。 這是我的模型。

  public class MyModel: INotifyPropertyChanged
    {
        string name;
        public string Name
        {
            set
            {
                if (name != value)
                {
                    name = value;
                    OnPropertyChanged("Name");

                }
            }
            get
            {
                return name;
            }
        }

       
        string _value;
        public string Value
        {
            set
            {
                if (_value != value)
                {
                    _value = value;
                    OnPropertyChanged("Value");

                }
            }
            get
            {
                return _value;
            }
        }


        private Color _textColor=Color.Green;

        public Color TextColor
        {
            get { return _textColor; }
            set
            {
                _textColor = value;

                OnPropertyChanged("TextColor");

            }
        }

       
        public event PropertyChangedEventHandler PropertyChanged;

        protected virtual void OnPropertyChanged(string propertyName)
        {
            PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

當我們更改文本的顏色時，我通過 ViewModel 中的按鈕Command設置它。

   public class MyViewModel
    {
        public ObservableCollection<MyModel> Stats { get; set; }

        public ICommand ColorChangeCommand { protected set; get; }
        public MyViewModel()
        {
            Stats = new ObservableCollection<MyModel>();
            Stats.Add(new MyModel() { Name="test1",  Value="1" });
            Stats.Add(new MyModel() { Name = "test2", Value = "2" });
            Stats.Add(new MyModel() { Name = "test3", Value = "3" });
            ColorChangeCommand = new Command<MyModel>(async (key) =>
            {
                     key.TextColor = Color.Red;

            });

        }
    }

這是我編輯過的 Listview。

 <ListView
             
              ItemsSource="{Binding Stats}"
             x:Name="mylistview"
              HasUnevenRows="true">
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"></ColumnDefinition>
                                <ColumnDefinition Width="*"></ColumnDefinition>
                                <ColumnDefinition Width="*"></ColumnDefinition>
                            </Grid.ColumnDefinitions>
                            <Grid Column="0">
                                <Label Text="{Binding Name}" TextColor="{Binding TextColor}"/>
                            </Grid>
                            <Grid Column="1">
                                <Label Text="{Binding Value}" TextColor="{Binding TextColor}"/>
                            </Grid>
                            <Grid Column="2">
                                <Button Text="change" Command="{Binding BindingContext.ColorChangeCommand, Source={x:Reference Name=mylistview} }"  CommandParameter="{Binding .}"></Button>
                            </Grid>
                           
                        </Grid>
                    </ViewCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

這是我的布局背景代碼。

  public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();

            this.BindingContext = new MyViewModel();
        }
    }

Answer 2

問題出在您的 ItemsSource 中。 這里沒有名為“TextColor”的屬性。 您可以使用以下代碼來擺脫這種情況：

<Label Text="{Binding Name}" TextColor="{Binding Source={x:Reference This}, Path=BindingContext.TextColor}"/>