C#ListBox,每个项目的不同背景

时间:2014-07-16 13:52:14

标签: c# xaml windows-phone-8 listbox

我在xaml中有ListBox:

  <ListBox Name="feedListBox" Height="758" HorizontalAlignment="Center" Margin="0,10,0,0" VerticalAlignment="Top" Width="480" ScrollViewer.VerticalScrollBarVisibility="Auto" SelectionChanged="feedListBox_SelectionChanged" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="1" Background="White">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <StackPanel VerticalAlignment="Top" Width="480">
                    <TextBlock FontWeight="Bold" FontSize="24" Name="feedTitle" TextWrapping="Wrap" Margin="12,0,0,0" HorizontalAlignment="Left" Foreground="#FF000000" Text="{Binding Title.Text, Converter={StaticResource RssTextTrimmer}}" />
                    <TextBlock Name="feedSummary" Foreground="#FF000000" TextWrapping="Wrap" Margin="12,0,0,0" Text="{Binding Summary.Text, Converter={StaticResource RssTextTrimmer}}" />
                    <TextBlock Name="feedPubDate" Foreground="#FF939393" Margin="12,0,10,10" Text="{Binding PublishDate.DateTime}" HorizontalAlignment="Right" />
                    <Border BorderThickness="1" Height="2" HorizontalAlignment="Center" VerticalAlignment="Top" Width="480" BorderBrush="Black" />
                </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
  </ListBox>

如何为每个项目指定不同的背景?

2 个答案:

答案 0 :(得分:2)

在您的viewmodel中添加Brush属性,并将DataTemplate中的控件绑定到它

视图模型:

using System.ComponentModel;
using System.Windows.Media;
...
public class YourViewModel : INotifyPropertyChanged{
    ...
    private Brush _backgroundCol = Brushes.Red; //Default color
    public Brush BackgroundCol
    {
        get { return _backgroundCol; }
        set 
        {
            _backgroundCol = value;
            OnPropertyChanged("BackgroundCol");
        }
    }
    ...
}

XAML:

<TextBlock Name="feedPubDate" Background="{Binding Path=BackgroundCol}" />

有关如何实施INotifyPropertyChanged界面的信息,请查看:Implementing INotifyPropertyChanged - does a better way exist?

答案 1 :(得分:0)

试试这个:

XAML:

            <ListBox Name="feedListBox" Height="758" HorizontalAlignment="Center" Margin="0,10,0,0" VerticalAlignment="Top" Width="480" ScrollViewer.VerticalScrollBarVisibility="Auto" SelectionChanged="feedListBox_SelectionChanged" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="1" Background="White">
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <StackPanel VerticalAlignment="Top" Width="480">
                            <Grid Background="{Binding feedTitleBack}">
                                <TextBlock FontWeight="Bold" FontSize="24" Name="feedTitle" TextWrapping="Wrap" Margin="12,0,0,0" HorizontalAlignment="Left" Foreground="#FF000000" Text="{Binding Title}"/>
                            </Grid>
                            <Grid Background="{Binding feedSummaryBack}">
                                <TextBlock Name="feedSummary" Foreground="#FF000000" TextWrapping="Wrap" Margin="12,0,0,0" Text="{Binding Summary}" />
                            </Grid>
                            <Grid Background="{Binding feedPubDateBack}">
                                <TextBlock Name="feedPubDate" Foreground="#FF939393" Margin="12,0,10,10" Text="{Binding PublishDate}" HorizontalAlignment="Right" />
                            </Grid>
                            <Border BorderThickness="1" Height="2" HorizontalAlignment="Center" VerticalAlignment="Top" Width="480" BorderBrush="Black" />
                        </StackPanel>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>

CS:

public class data
{
    public string Title { get; set; }
    public string feedTitleBack { get; set; }
    public string Summary { get; set; }
    public string feedSummaryBack { get; set; }
    public string PublishDate { get; set; }
    public string feedPubDateBack { get; set; }

    public data() { }
    public data(string Title, string feedTitleBack, string Summary, string feedSummaryBack, string PublishDate, string feedPubDateBack)
    {
        this.Title = Title;
        this.feedTitleBack = feedTitleBack;
        this.Summary = Summary;
        this.feedSummaryBack = feedSummaryBack;
        this.PublishDate = PublishDate;
        this.feedPubDateBack = feedPubDateBack;
    }
}

    void loadData()
    {
        List<data> obj = new List<data>();
        obj.Add(new data("Title1", "Red", "Summary1", "Green", "Date", "Blue"));
        obj.Add(new data("Title1", "#DD4B39", "Summary1", "#006621", "Date", "#1A0DAB"));
        feedListBox.ItemsSource = obj;
    }

protected override void OnNavigatedTo(NavigationEventArgs e)
{
    base.OnNavigatedTo(e);
    loadData();
}