如何将两个不同的集合绑定到两个不同的ListPickers

时间:2014-03-07 15:33:35

标签: c# xaml windows-phone-8

我是Windows Phone开发的新手。

我试图将两个不同的集合绑定到两个列表选择器。当我点击任一列表选择器时,颜色或便便类型的名称不会像我预期的那样显示。我总是得到这样的错误

  

System.Windows.Data错误:BindingExpression路径错误:'Maroon''System.String'上找不到'colors'属性(HashCode = 68540248)。 BindingExpression:Path ='colors'DataItem ='Maroon'(HashCode = 68540248); target元素是'System.Windows.Controls.TextBlock'(Name =''); target属性是'Text'(类型'System.String')..

这是我的代码

public partial class Poop_info_page : PhoneApplicationPage
{
    public Poop_info_page()
    {
        InitializeComponent();

        //DataContext = ColorExtensions.AccentColors();
        //DataContext = ShapeData.ShapeNames();
        var colors = ColorExtensions.AccentColors();
        colorPicker.ItemsSource = colors;
        var poopType = ShapeData.ShapeNames();
        shapePicker.ItemsSource = poopType;

    }
}

数据1

public static class ShapeData
{
    private static string[] _shapeNames = { "Separated hard lumps",
                                           "Lumpy sausage",
                                           "Sausage with cracks surface",
                                           "Smooth soft snake",
                                           "Soft blobs with clear cut",
                                           "Mushy and fluffy pieces",
                                           "Entirely liquid" };

    public static ReadOnlyCollection<string> ShapeNames()
    {
        return new ReadOnlyCollection<string>(_shapeNames);
    }

}

数据2

public static class ColorExtensions
{
    /// <summary>
    /// An array of all the names of the accent colors.
    /// </summary>
    private static string[] _accentColors = { "Maroon", 
                                              "Medium Brown",
                                              "Light Brown", 
                                              "Orange", 
                                              "Yellow", 
                                              "Red", 
                                              "Dark Green",
                                              "Clay",
                                              "Black" };


    /// <summary>
    /// Returns an array of all the names of the accent colors.
    /// </summary>
    public static ReadOnlyCollection<string> AccentColors()
    {
        return new ReadOnlyCollection<string>(_accentColors);
    }
}

XML

<phone:PhoneApplicationPage.Resources>
    <data:AccentColorNameToBrush x:Key="ColorNameToBrushConverter" />
    <data:ShapeTypeToImg x:Key="ShapeNameToImg" />
</phone:PhoneApplicationPage.Resources>

<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="White">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition/>
        <RowDefinition Height="Auto"/>
    </Grid.RowDefinitions>

    <!--TitlePanel contains the name of the application and page title-->
    <StackPanel Grid.Row="0" Margin="12,17,0,0">
        <TextBlock Text="POOPOR" Style="{StaticResource PhoneTextNormalStyle}" FontSize="24" Foreground="#FF787B7C"/>
        <TextBlock Text="New poop" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}" FontSize="78.667" Foreground="#FF787B7C" FontFamily="Segoe WP SemiLight"/>
    </StackPanel>

    <!--ContentPanel - place additional content here-->
    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid Margin="0,15">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <toolkit:ListPicker x:Name="colorPicker" ItemsSource="{Binding colors}" FullModeHeader="Poop" CacheMode="BitmapCache" BorderBrush="#FF787B7C" Foreground="#FF787B7C" Margin="0,20,0,0" Grid.Column="2" Width="100" HorizontalContentAlignment="Center">
                <toolkit:ListPicker.ItemTemplate>
                    <DataTemplate>
                        <StackPanel HorizontalAlignment="Center">
                            <TextBlock Text="Edit" TextAlignment="Center"/>
                        </StackPanel>
                    </DataTemplate>
                </toolkit:ListPicker.ItemTemplate>
                <toolkit:ListPicker.FullModeItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal" Margin="0 21 0 20">
                            <Rectangle Fill="{Binding Converter={StaticResource ColorNameToBrushConverter}}" Width="43" Height="43"/>
                            <TextBlock Text="{Binding colors}"
                                Margin="16 0 0 0"
                                FontSize="43"
                                FontFamily="{StaticResource PhoneFontFamilyLight}"/>
                        </StackPanel>
                    </DataTemplate>
                </toolkit:ListPicker.FullModeItemTemplate>
            </toolkit:ListPicker>
            <StackPanel Margin="15,0,0,0" Grid.Column="1" Width="120">
                <TextBlock TextWrapping="Wrap" Text="COLOR" Foreground="Black" FontFamily="Segoe WP Semibold" FontSize="32" Margin="0,7,0,0"/>
                <TextBlock x:Name="colorResult_text" TextWrapping="Wrap" Foreground="#FF787B7C" Margin="0">
                    <Run FontSize="17.333" Text="Light Brown "/>
                    <Run FontSize="14.667" Text="(Detected result)"/>
                </TextBlock>
            </StackPanel>
            <es:Arc x:Name="colorResult" ArcThickness="1" ArcThicknessUnit="Percent" EndAngle="360" Fill="#FFCB9453" Margin="30,0,0,0" Stretch="None" Stroke="Black" StrokeThickness="0" StartAngle="0" UseLayoutRounding="False" Width="107"/>
        </Grid>
        <Border BorderThickness="0,0,0,1" VerticalAlignment="Bottom">
            <Border.BorderBrush>
                <SolidColorBrush Color="#FF727272" Opacity="0.5"/>
            </Border.BorderBrush>
        </Border>
        <Grid Margin="0,15" Grid.Row="1">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <toolkit:ListPicker x:Name="shapePicker" ItemsSource="{Binding poopType}" FullModeHeader="Poop" CacheMode="BitmapCache" BorderBrush="#FF787B7C" Foreground="#FF787B7C" Margin="0,20,0,0" Grid.Column="2" Width="100" HorizontalContentAlignment="Center">
                <toolkit:ListPicker.ItemTemplate>
                    <DataTemplate>
                        <StackPanel HorizontalAlignment="Center">
                            <TextBlock Text="Edit" TextAlignment="Center"/>
                        </StackPanel>
                    </DataTemplate>
                </toolkit:ListPicker.ItemTemplate>
                <toolkit:ListPicker.FullModeItemTemplate>
                    <DataTemplate x:Name="dataTemplate">
                        <StackPanel Orientation="Horizontal" Margin="0 21 0 20">
                            <Image Source="{Binding Converter={StaticResource ShapeNameToImg}}"                     Width="107" />
                            <TextBlock Text="{Binding poopType}"
                                Margin="16 0 0 0"
                                FontSize="32"
                                FontFamily="{StaticResource PhoneFontFamilyLight}"/>
                        </StackPanel>
                    </DataTemplate>
                </toolkit:ListPicker.FullModeItemTemplate>
            </toolkit:ListPicker>
            <StackPanel Margin="15,0,0,0" Grid.Column="1" Width="120">
                <TextBlock TextWrapping="Wrap" Text="SHAPE" Foreground="Black" FontFamily="Segoe WP Semibold" FontSize="32" Margin="0,4,0,0"/>
                <TextBlock x:Name="shapeResult_text" TextWrapping="Wrap" Foreground="#FF787B7C" Margin="0" Text="Separate hard lumps"/>
            </StackPanel>
            <Image x:Name="shapeResult" Margin="30,0,0,0" HorizontalAlignment="Center" Width="107"/>
        </Grid>
        <Border BorderThickness="0,0,0,1" VerticalAlignment="Bottom" Grid.Row="1">
            <Border.BorderBrush>
                <SolidColorBrush Color="#FF727272" Opacity="0.5"/>
            </Border.BorderBrush>
        </Border>
        <StackPanel Orientation="Horizontal" Margin="0,15" Grid.Row="2">
            <Image x:Name="pain_level_picture" HorizontalAlignment="Center" Width="108" Margin="30,0,0,0" Source="/Assets/img/painLevel/nohurt.png"/>
            <StackPanel Margin="15,0,0,0" Width="311">
                <TextBlock TextWrapping="Wrap" Text="PAIN LEVEL" Foreground="Black" FontFamily="Segoe WP Semibold" FontSize="24"/>
                <TextBlock x:Name="pain_level_description" TextWrapping="Wrap" Foreground="#FF787B7C" FontSize="17.333" Text="Normal pain"/>
                <Slider x:Name="painLevel_slider" FontSize="18.667" Padding="0" 
                        Margin="-24,-5,24,0" Foreground="#FF1BA1E2" BorderBrush="Black" BorderThickness="2" 
                        Maximum="5" Minimum="1" SmallChange="1"
                        >
                    <Slider.Background>
                        <ImageBrush ImageSource="Assets/img/slider.png"/>
                    </Slider.Background>
                </Slider>
            </StackPanel>
        </StackPanel>
        <Border BorderThickness="0,0,0,1" VerticalAlignment="Bottom" Grid.Row="2">
            <Border.BorderBrush>
                <SolidColorBrush Color="#FF727272" Opacity="0.5"/>
            </Border.BorderBrush>
        </Border>
        <StackPanel Orientation="Horizontal" Margin="0,15" Grid.Row="3">
            <Image x:Name="blood_amount_picture" HorizontalAlignment="Center" Width="108" Margin="30,0,0,-1" Source="/Assets/img/bloodAmount/noblood.png"/>
            <StackPanel Margin="15,0,0,0">
                <TextBlock TextWrapping="Wrap" Text="BLOOD AMOUNT" Foreground="Black" FontFamily="Segoe WP Semibold" FontSize="24"/>
                <TextBlock x:Name="blood_amount_description" TextWrapping="Wrap" Foreground="#FF787B7C" FontSize="17.333" Text="5 Blood Amount Measurement"/>
                <Slider x:Name="blood_amount_slider" FontSize="18.667" Padding="0" 
                    Margin="-24,-5,24,0" Foreground="#FF1BA1E2" BorderBrush="Black" BorderThickness="2" 
                    Maximum="5" Minimum="1" SmallChange="1"
                        Width="311"
                        >
                    <Slider.Background>
                        <ImageBrush ImageSource="Assets/img/slider.png"/>
                    </Slider.Background>
                </Slider>
            </StackPanel>
        </StackPanel>

    </Grid>
    <Button x:Name="newPoop_submit_button" Content="Submit" VerticalAlignment="Center" Grid.Row="2" Background="#FF1BA1E2" FontSize="30.667" Click="newPoop_submit_button_Click"/>
</Grid>

聚苯乙烯。当我喜欢这个时

DataContext = ColorExtensions.AccentColors();
DataContext = ShapeData.ShapeNames();

它工作正常,但我可以使用ColorExtensions数据或ShapeData数据。

问候

非常感谢

1 个答案:

答案 0 :(得分:1)

试试这样:

public partial class Poop_info_page : PhoneApplicationPage
{
  public Poop_info_page()
  {
    InitializeComponent();

    colorPicker.ItemsSource = ColorExtensions.AccentColors();
    shapePicker.ItemsSource = ShapeData.ShapeNames();
  }
}

在XAML中 - 删除Preperty Path(颜色)和ItemsSource(在代码中设置) - 与第二个ListPicker类似:

       <toolkit:ListPicker x:Name="colorPicker" FullModeHeader="Poop" CacheMode="BitmapCache" BorderBrush="#FF787B7C" Foreground="#FF787B7C" Margin="0,20,0,0" Grid.Column="2" Width="100" HorizontalContentAlignment="Center">
            <toolkit:ListPicker.ItemTemplate>
                <DataTemplate>
                    <StackPanel HorizontalAlignment="Center">
                        <TextBlock Text="Edit" TextAlignment="Center"/>
                    </StackPanel>
                </DataTemplate>
            </toolkit:ListPicker.ItemTemplate>
            <toolkit:ListPicker.FullModeItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal" Margin="0 21 0 20">
                        <Rectangle Fill="{Binding Converter={StaticResource ColorNameToBrushConverter}}" Width="43" Height="43"/>
                        <TextBlock Text="{Binding}"
                            Margin="16 0 0 0"
                            FontSize="43"
                            FontFamily="{StaticResource PhoneFontFamilyLight}"/>
                    </StackPanel>
                </DataTemplate>
            </toolkit:ListPicker.FullModeItemTemplate>
        </toolkit:ListPicker>

绑定适用于Property,您将Path声明为colors,它不是属性(在任何DataContext中)。