根据数据绑定值设置背景色 [英] Set background color depending on data-bound value

问题描述

我以前见过一些答案，但没有任何帮助.

I've seen some answers before but nothing really helped me out.

我还有一个类DecideModel(这是从数据库中检索到的数据集，但出于这个问题的目的，我添加了一个ObservableCollection)，其中包含

I also have a class DecideModel (This will be a dataset retrieved from DB, but for purpose of this question, I have added an ObservableCollection) which contains

static DecideModel()
    {
        All = new ObservableCollection<DecideModel>
        {
            new DecideModel
            {
                DatePerformed = new DateTime(2015, 4, 06),
                Result = "Maybe"
            },
            new DecideModel
            {
                DatePerformed = new DateTime(2015, 4, 05),
                Result = "No"
            },
            new DecideModel
            {
                DatePerformed = new DateTime(2015, 4, 04),
                Result = "Yes"
            }
        };
    }

    public DateTime DatePerformed { set; get; }

    public string  Result { set; get; }

    public static IList<DecideModel> All { set; get; }
}

在我的XAML代码中，

In my XAML code I have

<ContentPage.Resources>
    <ResourceDictionary>
        <Color x:Key="Maybe">#ffddbc21</Color>
        <Color x:Key="Yes">#3CB371</Color>
        <Color x:Key="No">#B22222</Color>
        <Color x:Key="Depends">#ffd78800</Color>
    </ResourceDictionary>
</ContentPage.Resources>

<Label Text="{Binding Result}" HorizontalOptions="FillAndExpand" BackgroundColor="{StaticResource {BindingSource Result}}" />

我正在尝试根据我从对象获得的结果来动态设置标签的背景颜色.

I am trying to dynamically set the background color of the label with respect to what result I have obtained from the Object.

如果您对此有任何想法，请告诉我.我正在寻找任何有用的选项.

Please let me know if you have any idea on how to do it. I am looking for any useful option available.

推荐答案

您可能需要的是ValueConverter.您现在正在做的是将背景颜色设置为可能"，否"或是"，这显然不是颜色.

What you probably need is a ValueConverter. What you are doing now is setting the background color to 'Maybe', 'No' or 'Yes', which clearly isn't a color.

您需要做的就是将该值转换为颜色.您可以这样做.

What you need to do is convert that value to a color. You can do it like this.

创建一个实现IValueConverter接口的新类.它可能看起来像这样:

Create a new class that implements the IValueConverter interface. It will probably look something like this:

public class YesNoMaybeToColorConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
            switch(value.ToString().ToLower())
            {
                    case "yes":
                        return Color.Green;
                    case "no":
                        return Color.Red;
                    case "maybe":
                        return Color.Orange;
            }

            return Color.Gray;
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
    {
            // You probably don't need this, this is used to convert the other way around
            // so from color to yes no or maybe
            throw new NotImplementedException();
    }
}

然后将此类作为静态资源添加到您的XAML页面，如下所示:

Then add this class as a static resource to your XAML page like this:

<ContentPage.Resources>
   <!-- Add this line below -->
   <local:YesNoToBooleanConverter x:Key="YesNoMaybeToColorConverter" />
   <!-- You can remove the underneath -->
    <!--<ResourceDictionary>
        <Color x:Key="Maybe">#ffddbc21</Color>
        <Color x:Key="Yes">#3CB371</Color>
        <Color x:Key="No">#B22222</Color>
        <Color x:Key="Depends">#ffd78800</Color>
    </ResourceDictionary>-->
</ContentPage.Resources>

现在在绑定中，您必须告诉他要使用什么转换器.这样做:

Now in your binding you have to tell him what converter to use. Do it like this:

<Label Text="{Binding Result}" HorizontalOptions="FillAndExpand" BackgroundColor="{Binding Result, Converter={StaticResource YesNoMaybeToColorConverter}}" />

现在它应该在Result字段中看到该值，将其放入您定义的转换器中，并返回与该值相对应的颜色.

It should now see the value in the Result field, put it through the converter you have defined and return the color that you corresponded to that value.

这篇关于根据数据绑定值设置背景色的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！