如何创建颜色的多选列表

本文关键字：列表 颜色 何创建 创建 | 更新日期: 2023-09-27 18:35:53

我一直在尝试使用 WP7.1 中支持的颜色填充多选列表，但我在代码隐藏中生成这些颜色的列表时遇到问题。到目前为止，我的解决方案如下：

颜色列表页面.xaml

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <toolkit:MultiselectList x:Name="ColorList" ItemsSource="{Binding}" Height="88" HorizontalAlignment="Left" VerticalAlignment="Top" >                
            <DataTemplate>
                <StackPanel Orientation="Horizontal" Margin="16,21,0,20">
                    <Rectangle Fill="{Binding}" Width="50" Height="50"/>
                    <TextBlock Text="{Binding}" Margin="12,10,0,0"/>
                </StackPanel>
            </DataTemplate>                
        </toolkit:MultiselectList>

我正在尝试数据绑定到矩形和文本块属性，以便矩形将填充一个纯色画笔值，并且文本块将包含相应纯色画笔的名称。这就是我卡住的地方，因为我不知道如何做到这一点？具体来说，我不是要调用强调色，而是调用所有可用的颜色选项（例如，在设置矩形显式填充时看到，有大量的选项列表）。

如何创建颜色的多选列表

你想要一个多选列表还是一个列表选择器？是否希望用户能够选择多种颜色？下面是一个使用 ListPicker 的示例。要获得颜色，您必须自己创建颜色。下面是使用强调色的示例

ListPicker的 xaml ：

        <toolkit:ListPicker x:Name="ColorPicker" ExpansionMode="FullScreenOnly"
                            FullModeHeader="COLOR"
                            Visibility="Collapsed"
                            ItemsSource="{Binding Brushes}"
                            SelectedItem="{Binding SelectedBrush, Mode=TwoWay}">
            <toolkit:ListPicker.FullModeItemTemplate>
                <DataTemplate>
                    <StackPanel Margin="0 20" Orientation="Horizontal">
                        <Rectangle Width="42" Height="42" Fill="{Binding Brush}"
                               Stroke="{StaticResource PhoneForegroundBrush}"
                               HorizontalAlignment="Left"/>
                        <TextBlock Text="{Binding Name}" Style="{StaticResource PhoneTextExtraLargeStyle}"
                                   HorizontalAlignment="Center" Margin="5,0"/>
                    </StackPanel>
                </DataTemplate>
            </toolkit:ListPicker.FullModeItemTemplate>
        </toolkit:ListPicker>

以及生成颜色集合的代码：

private IList<ColorItem> CreateBrushes()
    {
        var brushes = new List<ColorItem>
        {
            new ColorItem { Brush = new SolidColorBrush(Color.FromArgb(255,27,161,226)), Name = "blue" },    
            new ColorItem { Brush = new SolidColorBrush(Color.FromArgb(255,160,80,0)), Name = "brown" },     
            new ColorItem { Brush = new SolidColorBrush(Color.FromArgb(255, 51,153,51)), Name = "green" },   
            new ColorItem { Brush = new SolidColorBrush(Color.FromArgb(255,162,193,57)), Name = "lime" },   
            new ColorItem { Brush = new SolidColorBrush(Color.FromArgb(255,216,0,115)), Name = "magenta" }, 
            new ColorItem { Brush = new SolidColorBrush(Color.FromArgb(255,240,150,9)), Name = "mango" },   
            new ColorItem { Brush = new SolidColorBrush(Color.FromArgb(255,230,113,184)), Name = "pink" },  
            new ColorItem { Brush = new SolidColorBrush(Color.FromArgb(255,162,0,255)), Name = "purple" },  
            new ColorItem { Brush = new SolidColorBrush(Color.FromArgb(255,229,20,0)), Name = "red" },      
            new ColorItem { Brush = new SolidColorBrush(Color.FromArgb(255,0,171,169)), Name = "teal" },    
        };
        return brushes;
    }

public class ColorItem
{
    public SolidColorBrush Brush { get; set; }
    public string Name { get; set; }
}

您还可以使用反射来获取颜色集合。

        Type t = typeof(Colors);
        var properties = t.GetProperties();
        List<ColorItem> items = new List<ColorItem>();
        for (int i = 0; i < properties.Length; i++)
        {
            var property = properties[i];
            items.Add(new ColorItem
            {
                Name = property.Name,
                Color = new SolidColorBrush((Color)property.GetValue(null, null))
            });
        }
相关文章：