【问题标题】:Xamarin, XAML. Help bind color in ListViewXamarin,XAML。帮助在 ListView 中绑定颜色
【发布时间】:2020-11-02 19:37:00
【问题描述】:

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

【问题讨论】:

  • 您的TextColor 属性的类型是什么?你能发布你的模型的代码吗?
  • 抱歉,我添加了我的代码

标签: c# xaml xamarin xamarin.forms xamarin.forms.listview


【解决方案1】:

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

&lt;Label Text="{Binding Name}" TextColor="{Binding Source={x:Reference This}, Path=BindingContext.TextColor}"/&gt;

【讨论】:

    【解决方案2】:

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

    【讨论】:

      猜你喜欢
      • 2018-09-28
      • 1970-01-01
      • 1970-01-01
      • 2016-08-07
      • 1970-01-01
      • 2014-09-07
      • 1970-01-01
      • 2017-02-09
      • 1970-01-01
      相关资源
      最近更新 更多