Xaml VisualState未应用于listbox ItemTemplate

我想使用VisualStateManager更改列表框项目的外观。我创建了一个简化的示例。当listbox或listbox项目仅获得宽度为500的空间时，例如，应将背景设置为米色，否则设置为绿色

我尝试了以下和其他一些变体，但它们都不起作用。有人知道如何解决这个问题吗

  <ListBox Grid.Column="0">
        <ListBoxItem>asdfasf</ListBoxItem>
        <ListBoxItem>fasf</ListBoxItem>
        <ListBoxItem>fasf</ListBoxItem>
        <ListBoxItem>asdsf</ListBoxItem>
        <ListBoxItem>aasf</ListBoxItem>
        <ListBox.ItemTemplate>
            <DataTemplate>
                <ContentControl>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="visualStateGroup" >
                            <VisualState>
                                <VisualState.StateTriggers>
                                    <AdaptiveTrigger MinWindowWidth="500" />
                                </VisualState.StateTriggers>
                                <VisualState.Setters>
                                    <Setter Target="PathTextBlock.Text" Value="a" />
                                    <Setter Target="border.Background" Value="Beige" />
                                </VisualState.Setters>
                            </VisualState>
                            <VisualState>
                                <VisualState.StateTriggers>
                                    <AdaptiveTrigger MinWindowWidth="0" />
                                </VisualState.StateTriggers>
                                <VisualState.Setters>
                                    <Setter Target="PathTextBlock.Text" Value="b" />
                                    <Setter Target="border.Background" Value="Green" />
                                </VisualState.Setters>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ContentControl.Content>
                        <Border x:Name="border" >
                            <TextBlock  x:Name="PathTextBlock" Text="{Binding RelativeSource={RelativeSource Mode=None}}" />
                        </Border>
                    </ContentControl.Content>
                </ContentControl>

            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>

asdfasf
fasf
fasf
asdsf
aasf
我发现最简单的方法是创建
数据模板的
用户控件。像这样的

<UserControl x:class="MyListBoxControl">
   <Grid>
      <VisualStateManager.VisualStateGroups>
                    <VisualStateGroup x:Name="visualStateGroup" >
                        <VisualState>
                            <VisualState.StateTriggers>
                                <AdaptiveTrigger MinWindowWidth="500" />
                            </VisualState.StateTriggers>
                            <VisualState.Setters>
                                <Setter Target="PathTextBlock.Text" Value="a" />
                                <Setter Target="border.Background" Value="Beige" />
                            </VisualState.Setters>
                        </VisualState>
                        <VisualState>
                            <VisualState.StateTriggers>
                                <AdaptiveTrigger MinWindowWidth="0" />
                            </VisualState.StateTriggers>
                            <VisualState.Setters>
                                <Setter Target="PathTextBlock.Text" Value="b" />
                                <Setter Target="border.Background" Value="Green" />
                            </VisualState.Setters>
                        </VisualState>
                    </VisualStateGroup>
                </VisualStateManager.VisualStateGroups>    
                <Border x:Name="border" >
                        <TextBlock  x:Name="PathTextBlock" Text="{Binding RelativeSource={RelativeSource Mode=None}}" />
                    </Border>
              </Grid>
          </UserControl>

通常我们不直接操作列表框的项，常用的方法是将项添加到
observedcollection
中，并设置
ListBox
的
ItemSource
属性绑定到
observedcollection

如果您使用
ItemSource
，您可以像@SWilko所说的那样使用
UserControl
。但它不需要使用
相对资源

例如，我创建了一个
Person
类，它有一个属性
Name
。我使用
替换

如果要直接添加列表框的项，请使用
VisualStateManager
更改
列表框
项的外观。您可以编辑
ItemContainerStyle

要修改
列表框项目的模板
，我们可以在“文档大纲”中选择
列表框
，右键单击，然后选择“编辑其他模板”→ “编辑生成的项目容器（ItemContainerStyle）”→ “编辑副本…”

您可以在
中创建
VisualStateGroup

例如：

<VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="CommonStates">
        ...
    </VisualStateGroup>
    <VisualStateGroup>
        <VisualState>
            <VisualState.StateTriggers>
                <AdaptiveTrigger MinWindowWidth="600" />
            </VisualState.StateTriggers>
            <VisualState.Setters>
                <Setter Target="PathTextBlock.Text" Value="a" />
                <Setter Target="border.Background" Value="Beige" />
            </VisualState.Setters>
        </VisualState>
        <VisualState>
            <VisualState.StateTriggers>
                <AdaptiveTrigger MinWindowWidth="0" />
            </VisualState.StateTriggers>
            <VisualState.Setters>
                <Setter Target="PathTextBlock.Text" Value="b" />
                <Setter Target="border.Background" Value="Green" />
            </VisualState.Setters>
        </VisualState>
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

顺便说一下，您将AdaptiveTrigger的
MinWindowWidth
属性设置为500，效果将不明显。您可以将其设置为600。
Sry，这对我不起作用。Visualstate触发器似乎没有被触发。
<VisualStateManager.VisualStateGroups>
    <VisualStateGroup x:Name="CommonStates">
        ...
    </VisualStateGroup>
    <VisualStateGroup>
        <VisualState>
            <VisualState.StateTriggers>
                <AdaptiveTrigger MinWindowWidth="600" />
            </VisualState.StateTriggers>
            <VisualState.Setters>
                <Setter Target="PathTextBlock.Text" Value="a" />
                <Setter Target="border.Background" Value="Beige" />
            </VisualState.Setters>
        </VisualState>
        <VisualState>
            <VisualState.StateTriggers>
                <AdaptiveTrigger MinWindowWidth="0" />
            </VisualState.StateTriggers>
            <VisualState.Setters>
                <Setter Target="PathTextBlock.Text" Value="b" />
                <Setter Target="border.Background" Value="Green" />
            </VisualState.Setters>
        </VisualState>
    </VisualStateGroup>
</VisualStateManager.VisualStateGroups>

<ContentPresenter x:Name="ContentPresenter" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" Style="{StaticResource BodyContentPresenterStyle}" TextWrapping="NoWrap" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
    <Border Name="border">
        <TextBlock Name="PathTextBlock"  Text="{TemplateBinding Content}"></TextBlock>
    </Border>
</ContentPresenter>