2

我需要显示ListBox具有不同背景的替代行。我的ListBox样子是这样的：

<ListBox Height="547" HorizontalAlignment="Left" Margin="7,203,0,0" Name="lstboxProducts" VerticalAlignment="Top" Width="424" >
    <ListBoxItem>
        <Grid Height="100" Width="420">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="80"/>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="50"/>
            </Grid.ColumnDefinitions>

            <Image Grid.Column="0" Source="/Images/dark/appbar.magnify.png"/>
            <StackPanel Grid.Column="1">
                <TextBlock Text="Item heading" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}" Height="56" />
                <TextBlock Text="item description" TextWrapping="Wrap" Style="{StaticResource PhoneTextSubtleStyle}" Height="46" Width="276" />
            </StackPanel>
            <Image Grid.Column="2" Source="/Images/dark/appbar.magnify.png"/>
        </Grid>
    </ListBoxItem>
</ListBox>
4

2 回答 2

0 
public class AlternatingRowsConverter : IValueConverter
{
private bool _alternate;

public object Convert(object value, Type targetType, object parameter,
           System.Globalization.CultureInfo culture)
{
  _alternate = !_alternate;
  return _alternate
        ? new SolidColorBrush(Color.FromArgb(255, 255, 0, 0))
        : new SolidColorBrush(Color.FromArgb(255, 0, 0, 255));
}

public object ConvertBack(object value, Type targetType, object parameter,
             System.Globalization.CultureInfo culture) 
{ throw new NotImplementedException(); }
 }
}

然后，列表框模板：

  <ListBox ItemsSource="{Binding}"
       x:Name="Mylistbox"
       SelectionChanged="Mylistbox_SelectionChanged">
    <ListBox.ItemTemplate>
      <DataTemplate>
        <StackPanel>
          <Grid Background="{Binding Converter={StaticResource alternateConvertor}}">
            <TextBlock Grid.Column="0"
                  Text="{Binding Name, Mode=TwoWay}"
                  VerticalAlignment="Center"
                  HorizontalAlignment="Left" />
          </Grid>
        </StackPanel>
      </DataTemplate>
    </ListBox.ItemTemplate>
  </ListBox>

最后在资源字典中定义转换器对象

   <phone:PhoneApplicationPage.Resources>
    <WindowsPhoneApplication5:AlternatingRowsConverter x:Key="alternateConvertor" />
   </phone:PhoneApplicationPage.Resources>

更多信息在这里

于 2012-07-18T05:30:08.600 回答
0

这是 XAML 的外观示例。我使用 Pivot Template 应用程序创建了一个新应用程序。

   <ListBox x:Name="FirstListBox" Margin="0,0,-12,0" ItemsSource="{Binding Items}">
        <ListBox.ItemTemplate>
            <DataTemplate>
              <StackPanel Margin="0,0,0,17" Width="432" Height="78">
                <StackPanel.Background>
                    <ImageBrush Stretch="Fill" ImageSource="/Koala.jpg"/>
                </StackPanel.Background>
                  <TextBlock Text="{Binding LineOne}" TextWrapping="Wrap" Style="{StaticResource PhoneTextExtraLargeStyle}"/>
                  <TextBlock Text="{Binding LineTwo}" TextWrapping="Wrap" Margin="12,-6,12,0" Style="{StaticResource PhoneTextSubtleStyle}"/>
              </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

所以默认的 ItemTemplate 使用 StackPanel 作为主容器。您在这里要做的是将图像设置为该 StackPanel 的背景。这就是以下几行的含义：

<StackPanel.Background>
    <ImageBrush Stretch="Fill" ImageSource="/Koala.jpg"/>
</StackPanel.Background>

使用上面的代码，您将 ImageBrush 设置为 StackPanel 的 Background 属性。

使用该代码，每个 ListBoxItem 都会显示一只考拉。

于 2014-01-29T19:41:21.773 回答