Question

我希望listpicker处于全屏模式。但这不是我的问题。我希望listpicker具有数据绑定功能，与Windows Phone的“设置”页面中的“主题颜色”选择列表选择器完全相似。 listpicker应该有一个带颜色填充的正方形和颜色名称。我知道如何使用绑定来获取颜色名称列表，但<Rectangle>中的<DataTemplate>标记不起作用。

这是Listpicker的XAML

       <toolkit:ListPicker x:Name="lpkColor" Grid.Column="1" ExpansionMode="FullScreenOnly"  Margin="8,12,-8,20" FullModeHeader="Select Color" Header="Color">
            <toolkit:ListPicker.FullModeItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <Rectangle Height="50" Width="50" VerticalAlignment="Center" Fill="{Binding color}" Margin="5,30,20,20"></Rectangle>
                        <TextBlock Text="{Binding ColorName}" VerticalAlignment="Center" FontSize="40"></TextBlock>
                    </StackPanel>
                </DataTemplate>
            </toolkit:ListPicker.FullModeItemTemplate>
        </toolkit:ListPicker>

背后的代码如下：

   public class PickerObject
    {


        public string ColorName { get; set; }
        public Color color{get;set;}
        public PickerObject(string cn, Color c)
        {
            ColorName = cn;
            color = c;
        }



    }

并在我的MainPage类中

List<PickerObject> MyColors = new List<PickerObject>();

在我的构造函数中我有：

        MyColors = new List<PickerObject>();
        MyColors.Add(new PickerObject("white",Colors.White));
        MyColors.Add(new PickerObject("black", Colors.Black));
        MyColors.Add(new PickerObject("blue", Colors.Blue));
        MyColors.Add(new PickerObject("yellow", Colors.Yellow));
        MyColors.Add(new PickerObject("red", Colors.Red));
        lpkColor.ItemsSource = MyColors ;

但Listpicker中没有显示Rectangle，也没有显示颜色。我想知道我做错了什么，以及如何正确地做到这一点。

Answer 1

你的意思是这不起作用？

<ListPicker.FullModeItemTemplate>
    <DataTemplate>
        <StackPanel Orientation="Horizontal">
            <Rectangle Margin="0,0,24,0
                       Width="50"
                       Height="50"
                       Fill="Red"/>
            <TextBlock Text="Red"/>
        </StackPanel>
    </DataTemplate>
</ListPicker.FullModeItemTemplate>

或者你有另一个标记？

更新：现在是一个解决方案

不能简单地将矩形的Fill属性绑定到Color类型因为Fill属性的类型为Brush，所以here。

您可以扩展您的标记：

<Rectangle Width="50"
           Height="50">
    <Rectangle.Fill>
        <SolidColorBrush Color="{Binding color}"/>
    </Rectangle.Fill>
</Rectangle>

或者您可以实现Color-To-Brush转换器。像这样：

在你的代码隐藏中包括：

using System.Windows.Data;
using System.Globalization;

public class ColorToBrushConverter : IValueConverter
{
    public object Convert(object value, Type targetType,
                          object parameter, CultureInfo culture)
    {
        if (value is Color)
            return new SolidColorBrush((Color)value);
        return value;
    }

    public object ConvertBack(object value, Type targetType,
                              object parameter, CultureInfo culture)
    {
        return null;
    }
}

然后在你的XAML中包含此代码隐藏的命名空间。类似的东西：

xmlns:local="clr-namespace:YourNamespaceForConverterClass"

还要在您的标记中包含本地资源字典，并参考转换器类并命名为x:Key属性：

<phone:PhoneApplicationPage.Resources>
    <local:ColorToBrushConverter x:Key="convertColorToBrush"/>
</phone:PhoneApplicationPage.Resources>

最后，您可以使用转换器Rectangle使用x:Key名称对其进行寻址：

<Rectangle Width="50"
           Height="50"
           Fill="{Binding color,
                  Converter={StaticResource convertColorToBrush}}"/>

如果您计划经常使用转换，则在应用程序资源词典（ App.xaml 文件）中放置 Converter 类可以节省您的时间，避免重复扩展标记。< / p>

但如果你只是直接使用Brush而不是Color，我认为会更好。

Silverlight中的矩形颜色数据绑定

1 个答案: