簡體   English   中英

如何更改項目控制StackPanel背景顏色

[英]How to change itemsControl stackpanel background color

說我有10個項目someList的列表,我將通過itemsControl在我的頁面上顯示它們,如下所示:

<ItemsControl DataContext="{Binding [someViewModel]}" 
              BorderBrush="Black" 
              ItemSource="{Binding someList}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Border BorderThickness="1" Background="Green">
                <StackPanel MouseDown="{Binding Path=DataContext.someCommand,   
                                        RelativeSource={RelativeSource FindAncestor,AncestorType={x:Type ItemsControl}}}" 
                                        Command Parameter="{Binding someID}">
                    <TextBlock Text="{Binding something}">
                </StackPanel>
            </Border>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

我能夠觸發someCommand方法,並且能夠傳遞someID作為輸入參數。 現在,我想知道如何更新stackPanel背景顏色,使其看起來像“選定”。 這意味着所有項目都將具有綠色背景,當我單擊一個堆棧面板時,該堆棧面板應將背景更改為紅色,並將其他更改為綠色

如果要使用ItemsControl ,則可以使用自定義ControlTemplateItemTemplate更改為RadioButton ,該ControlTemplate將包含Border ,當IsChecked == true時, Background將變為Red

<ItemsControl DataContext="{Binding [someViewModel]}" BorderBrush="Black" ItemSource="{Binding someList}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <RadioButton Content="{Binding something}" GroupName="radioGroup">
                <RadioButton.Template>
                    <ControlTemplate TargetType="{x:Type RadioButton}">
                        <Border Background="Green" x:Name="PART_Border">
                            <ContentPresenter/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsChecked" Value="True">
                                <Setter TargetName="PART_Border" Property="Background" Value="Red"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </RadioButton.Template>
            </RadioButton>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

但是我看不到為什么不能將ListBoxSelectionMode=Single (默認值)一起使用並更改ListBoxItem Template的原因:

<ListBox DataContext="{Binding [someViewModel]}" BorderBrush="Black" ItemSource="{Binding someList}">
    <ListBox.ItemContainerStyle>
        <Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type ListBoxItem}">
                        <Border Background="Green" x:Name="PART_Border">
                            <ContentPresenter/>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter TargetName="PART_Border" Property="Background" Value="Red"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </ListBox.ItemContainerStyle>
</ListBox>

甚至做這樣的事情,而無需更改Template

<ListBox DataContext="{Binding [someViewModel]}" BorderBrush="Black" ItemSource="{Binding someList}">
    <ListBox.Resources>
        <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Red"/>
    </ListBox.Resources>
    <ListBox.ItemContainerStyle>
        <Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="Background" Value="Green"/>
        </Style>
    </ListBox.ItemContainerStyle>
</ListBox>

在WPF中,選擇具有所需功能並對其進行樣式設置使其看起來像想要的控件通常要容易得多,然后以相反的方式進行操作

為什么不做這樣的事情

<DataTemplate>
    <Border BorderThickness="1" Background="Green" x:Name="MyBorder">
        <StackPanel MouseDown="{Binding Path=DataContext.someCommand,   
            RelativeSource={RelativeSource FindAncestor,AncestorType={x:Type ItemsControl}}}" 
            Command Parameter="{Binding someID}">
            <TextBlock Text="{Binding something}">
        </StackPanel>
    </Border>
    <DataTemplate.Triggers>
        <DataTrigger Binding="{Binding Path=IsSelected}" Value="true">
                    <Setter TargetName="MyBorder" Property="Background" Value="Black" />
            </DataTrigger>
    </DataTemplate.Triggers>
</DataTemplate>

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM