简体   繁体   English

基于属性值的样式

[英]Style based on property value

I am trying to style communication module of my app. 我正在尝试设置应用程序的通信模块样式。 I am getting the some data from extenal API which are bound inside DataTemplate. 我从数据模板内绑定的外部API获取了一些数据。 I would like to change ListView ItemTemplate style based on value of Status property. 我想基于Status属性的值更改ListView ItemTemplate样式。

If the status is "new" then the border of the grid should be 2px Orange, if the status is "read" then the border of the grid should be 1px Gray. 如果状态为“新”,则网格的边界应为2px橙色,如果状态为“已读”,则网格的边界应为1px灰色。

I have achieved this using converters but I bet there is better way. 我已经使用转换器实现了这一目标,但我敢肯定有更好的方法。

XAML file XAML文件

<ListView ItemsSource="{Binding ConversationsList}">
    <ListView.ItemContainerStyle>
        <Style TargetType="ListViewItem">
            <Setter Property="Padding" Value="0,0,0,0"/>
            <Setter Property="Margin" Value="0,0,0,0"/>
        </Style>
    </ListView.ItemContainerStyle>
    <ListView.ItemTemplate>
        <DataTemplate>
            <Grid BorderBrush="{Binding status, Converter={StaticResource StatusToBorder}, ConverterParameter=BorderBrush}"  
                  BorderThickness="{Binding status, Converter={StaticResource StatusToBorder}, ConverterParameter=BorderThickness}"
                  Background="White"
                  Margin="5,5,5,5">

Converter File 转换器文件

class StatusToBorder : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, string language)
    {
        var param = parameter as String;
        var _value = value as String;
        switch (param) {
            case "BorderBrush":
                if (_value == "new")
                    return "#FFFF5917";
                else
                    return "#FFAAAAAA";
            case "BorderThickness":
                if (_value == "new")
                    return new Thickness(2, 2, 2, 2);
                else
                    return new Thickness(1, 1, 1, 1); ;
            default:
                return null;
                break;
        }
    }



    public object ConvertBack(object value, Type targetType, object parameter, string language)
    {
        throw new NotImplementedException();
    }
}

You need to give the Grid a name in xaml. 您需要使用xaml为Grid命名。 In xaml: 在xaml中:

<Grid  x:Name=MyGrid 
  IsRead="{Binding Read}"...>

Then within your code where the grid is marked as read or not: 然后在您的代码中将网格标记为已读或未读:
In Java: 在Java中:

MyGrid.BorderBrush = new SolidColorBrush(Windows.UI.Colors.Orange);
MyGrid.BorderThickness = new Thickness(3);

MyGrid.BorderBrush = new SolidColorBrush(Windows.UI.Colors.Gray);
MyGrid.BorderThickness = new Thickness(1);

I'm assuming you know how to set the datacontext, and resources, etc. If not, this tut covers the data binding more thoroughly: 我假设您知道如何设置数据上下文和资源等。如果没有,那么此教程将更全面地介绍数据绑定:
https://msdn.microsoft.com/en-us/library/windows/apps/jj207023(v=vs.105).aspx https://msdn.microsoft.com/zh-CN/library/windows/apps/jj207023(v=vs.105).aspx

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

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