Question

我有一个模型中的对象列表。我希望在AccordianItem面板的列表中显示DTO的元素。模型是这样的：

public class MyModel 
{ 
    public List<AnimalDTO> Items { get; set; } 

    public MyModel() 
    { 
        Items = new List<AnimalDTO> 
                    { 
                        new AnimalDTO() {Title = "Monkey", ImageUri = "Images/monkey.jpg"}, 
                        new AnimalDTO() {Title = "Cow", ImageUri = "Images/cow.jpg"}, 
                    }; 
    } 
} 
public class AnimalDTO
{
    public string Title { get; set; }
    public string LongDescription { get; set; }
    public string ImageUri { get; set; }
    public string NavigateUri { get; set; }
}

我想在AccordianItems的背景图像中显示图像，并在图像的一部分上放置LongDescription。

如果我硬编码，我可以在AccordianItem中获取图像......

<layoutToolkit:AccordionItem x:Name="Item2" Header="Item 2" Margin="0,0,10,0" AccordionButtonStyle="{StaticResource AccordionButtonStyle1}" ExpandableContentControlStyle="{StaticResource ExpandableContentControlStyle1}" HeaderTemplate="{StaticResource DataTemplate1}" BorderBrush="{x:Null}" ContentTemplate="{StaticResource CarouselContentTemplate}">
                <layoutToolkit:AccordionItem.Background>
                    <ImageBrush ImageSource="Images/cow.jpg" Stretch="None"/>
                </layoutToolkit:AccordionItem.Background>
            </layoutToolkit:AccordionItem>

当我尝试使用<ImageBrush ImageSource="{Binding Path={StaticResource MyContentTemplate.ImageUri}}" Stretch="None"/>这样的绑定或者我使用<ImageBrush ImageSource="{Binding Path=Items[0].ImageUri}" Stretch="None"/>进行尝试时，它抛出XamlParseException。

修改我能够通过以下StaticResource获取硬编码图像上的文本绑定（注意：我是硬编码的项目[2]，我不知道如何索引它）

        <DataTemplate x:Key="CarouselContentTemplate">
        <Grid Width="650" Height="420">
            <Grid.RowDefinitions>
                <RowDefinition Height="0.476*"/>
                <RowDefinition Height="0.524*"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="150" />
            </Grid.ColumnDefinitions>

            <TextBlock Grid.Row="0" Grid.Column="0"
                   x:Name="Title" 
                   Text="{Binding Items[2].Title}" 
                   Foreground="Black" FontSize="12"></TextBlock>
            <TextBlock Grid.Row="1" Grid.Column="0"
                   x:Name="LongDescription" 
                   Text="{Binding Items[2].LongDescription}"
                   TextWrapping="Wrap"FontSize="8"></TextBlock>
        </Grid>
    </DataTemplate>

有没有办法在DataTemplate中索引Items集合？此外，我如何让Image绑定而不是在每个AccordianItem中对它们进行硬编码？可以理解正确方向的任何帮助，尤其是如何在图像上绑定和放置文本。

Answer 1

要绑定到集合，必须使用 ItemsSource =“{Binding Items}”引用它，在这种情况下 Items 是我的集合 MyModel.Items

<layoutToolkit:Accordion HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ExpandDirection="Right" Style="{StaticResource AccordionStyle1}" AccordionButtonStyle="{StaticResource AccordionButtonStyle1}" MaxHeight="420" MaxWidth="800" ItemsSource="{Binding Items}" Margin="8,0,-8,-12" Grid.Row="3" > <layoutToolkit:Accordion.ItemTemplate> <DataTemplate> <TextBlock Text="{Binding Title}"></TextBlock> </DataTemplate> </layoutToolkit:Accordion.ItemTemplate>

请注意，集合应与ItemsSource绑定，后者是复数作为助记符。元素的各个成员绑定在<layoutToolkit:Accordian.ItemTemplate>的控制之内。这里我在TextBlock控件中显示MyCollection.Title。我将使用完整代码或指向我博客的链接更新此内容以获取完整示例。

如何从Silverlight 3 Toolkit将列表项绑定到Accordion控件？

1 个答案: