在WPF中更改网格行背景颜色

时间:2014-12-26 23:14:38

标签: c# wpf xaml grid

我想为网格行设置2种颜色,偶数颜色会有一种颜色,其他颜色会有另一种颜色。 我甚至不知道开始做这件事。

<ListBox
    ItemsSource="{Binding}" x:Name="station_list"
    HorizontalAlignment="Left" Height="378" Margin="10,31,0,0"
    VerticalAlignment="Top" Width="570" SelectedIndex="0">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid x:Name="Stations_Template">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>

                <TextBlock Grid.Column="0" Text="First Name: " />
                <TextBlock Grid.Column="1" Text="{Binding Path=sname}" />
                <TextBlock Grid.Column="2" Text="Last Name: " />
                <TextBlock Grid.Column="3" Text="{Binding Path=mahoz}" />
                <CheckBox Grid.Column="4" Content="Is Active?"
                    IsEnabled="False"
                    IsChecked="{Binding Path=isactive}" />
            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

2 个答案:

答案 0 :(得分:17)

首先使用矩形填充行,然后向其中添加数据。

    <Grid Background="White">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <Rectangle Grid.Row="0" Fill="AliceBlue" />
        <TextBlock Grid.Row="0" Text="Row 1" HorizontalAlignment="Center"/>
        <Rectangle Grid.Row="1" Fill="AntiqueWhite" />
        <TextBlock Grid.Row="1" Text="Row 2" HorizontalAlignment="Center"/>
        <Rectangle Grid.Row="2" Fill="AliceBlue" />
        <TextBlock Grid.Row="2" Text="Row 3" HorizontalAlignment="Center"/>
        <Rectangle Grid.Row="3" Fill="AntiqueWhite" />
        <TextBlock Grid.Row="3" Text="Row 4" HorizontalAlignment="Center"/>
    </Grid>

编辑: 如果您正在加载未知数量的项目,那么我认为您需要像itemscontrol这样的东西加载它们。然后您可以使用alternationcount和触发器来处理交替颜色。

    <ItemsControl ItemsSource="{Binding DataList}" AlternationCount="2">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Grid x:Name="FooBar" Margin="0,0,0,10">

                </Grid>
                <DataTemplate.Triggers>
                    <Trigger Property="ItemsControl.AlternationIndex" Value="0">
                        <Setter Property="Background" Value="Blue" TargetName="FooBar"/>
                    </Trigger>
                    <Trigger Property="ItemsControl.AlternationIndex" Value="1">
                        <Setter Property="Background" Value="Red" TargetName="FooBar"/>
                    </Trigger>
                </DataTemplate.Triggers>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

答案 1 :(得分:6)

enter image description here

<Window x:Class="WpfApplication3.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition/>
            <RowDefinition/>
            <RowDefinition/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition/>
            <ColumnDefinition/>
        </Grid.ColumnDefinitions>
        <Border Background="Cyan" />
        <Border Grid.Row="2" Grid.Column="1"  Background="Red" />
        <Border  Grid.Row="1" Background="Black" />
        <Border  Grid.Row="1" Background="Black" />
        <Border Grid.Row="2" Background="Orange" />
        <Border Grid.Row="0" Grid.Column="1" Background="Green" />
        <TextBlock Grid.ColumnSpan="2" Grid.Row="1" Text="Here is some more text" HorizontalAlignment="Center"  VerticalAlignment="Center"/>
        <TextBlock Grid.ColumnSpan="2" Text="Here is some text" HorizontalAlignment="Center"  VerticalAlignment="Center"/>
        <TextBlock Grid.ColumnSpan="2" Grid.Row="2" Text="Here is even more text" HorizontalAlignment="Center"  VerticalAlignment="Center"/>
    </Grid>
</Window>
![enter image description here][1]


  [1]: http://i.stack.imgur.com/LX9X8.png