繁体   English   中英

Xamarin,XAML。 帮助在 ListView 中绑定颜色

[英]Xamarin, XAML. Help bind color in ListView

如何在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>

你想像下面的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();
        }
    }

问题出在您的 ItemsSource 中。 这里没有名为“TextColor”的属性。 您可以使用以下代码来摆脱这种情况:

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

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM