0

我正在开发需要从站点获取最新流的 Windows 手机应用程序。我目前制作了一个自定义控件,可以保存 JSON 中的每个项目:

<UserControl x:Class="TwitchStationApp.StreamItem"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    d:DesignHeight="195" d:DesignWidth="480">

    <Grid x:Name="LayoutRoot" Height="195" Width="469">
        <Image Height="156" HorizontalAlignment="Left" Margin="12,12,0,0" Name="imageChannel" Stretch="Fill" VerticalAlignment="Top" Width="156" />
        <TextBlock Height="84" HorizontalAlignment="Left" Margin="174,48,0,0" Name="textBlockStatus" Text="TextBlock" VerticalAlignment="Top" Width="294" />
        <TextBlock Height="30" HorizontalAlignment="Left" Margin="174,12,0,0" Name="textBlockChanelName" Text="TextBlock" VerticalAlignment="Top" Width="294" Foreground="#FFB0CB3E" />
        <TextBlock Height="30" HorizontalAlignment="Left" Margin="174,138,0,0" Name="textBlockViewers" Text="TextBlock" VerticalAlignment="Top" Width="294" />
    </Grid>
</UserControl>

所以我会列出物品清单List<Stream> _stream = new ....。所以这个列表将由假设 10 个项目填充。对于每个项目,我需要创建一个用户控件(上图)并将其添加到 ListBox,以便用户可以滚动并选择(单击/点击)他们想要获取更多信息的项目。

做这个的最好方式是什么?我检查了 microsoft 网站,并且有一些关于ItemTemplate在标记中包含 XAML 文件的内容,<Window.Resource>但我不知道在哪里以及如何创建此文件并将其链接到我拥有的列表框。

4

2 回答 2

1

这通常使用数据模板完成。

假设你有一个 StreamTypes 的集合

    public class StreamType
    {
      public string Title { get; set; }
      public string Description { get; set; }
    }

您可以在中定义数据模板

  1. 应用程序范围 - 在 app.xaml 中
  2. 页面范围 - 在页面上
  3. 控制容器范围 - 列表框容器的本地
  4. 在列表框本身内

要在页面范围内定义它:

<phone:PhoneApplicationPage.Resources>
    <DataTemplate x:Key="SharedStreamTemplate">
        <StackPanel>
            <TextBlock FontSize="{StaticResource PhoneFontSizeExtraLarge}" Text="{Binding Title}" />
            <TextBlock FontSize="{StaticResource PhoneFontSizeExtraLarge}" Text="{Binding Description}" />
        </StackPanel>
    </DataTemplate>
</phone:PhoneApplicationPage.Resources>

在您的列表框中,将数据模板分配给项目模板

 <ListBox x:Name="lstStreams" ItemTemplate="{StaticResource SharedStreamTemplate}" />

如果没有合理的理由让您重新使用模板,只需直接在列表框中分配它

<ListBox x:Name="lstStreams">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <StackPanel>
                        <TextBlock FontSize="{StaticResource PhoneFontSizeExtraLarge}" Text="{Binding Title}" />
                        <TextBlock FontSize="{StaticResource PhoneFontSizeExtraLarge}" Text="{Binding Description}" />
                    </StackPanel>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>

更新

在你的代码后面

  // Constructor
    public MainPage()
    {
        InitializeComponent();

        BindStreams();
    }

private void BindStreams()
    {
        lstStreams.ItemsSource = new List<StreamType>
            {
                new StreamType { Description = "Description One", Title = "Title One"},
                new StreamType { Description = "Description Two", Title = "Title Two"},
                new StreamType { Description = "Description Three", Title = "Title Three"},
            };
    }
于 2013-09-20T16:32:22.313 回答
1

没错,您需要使用ItemsControl.ItemTemplate属性。使用此属性,您可以指定将应用于列表中每个项目的模板。这是示例代码:

模型:

public class Model
{
    public string Name { get; set; }

    public Guid Id { get; set; }
}

XAML

<ListBox ItemsSource="{Binding Path=MyItemsSource}">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <StackPanel>
                <TextBlock Text="{Binding Path=Name}"/>
                <TextBlock Text="{Binding Path=Id}"/>
            </StackPanel>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>
于 2013-09-20T15:58:22.957 回答