xaml - 项目模板中的 ListView 视觉状态管理器(WinRT、Metro、XAML)

Question

我试图让一个 ListView 显示由文本 block 组成的项目列表......
当单击 ListView 项目时，我想显示一个由文本框组成的列表...

以下是我想出的，它不起作用。
我在模板中有两个网格，并希望根据是否选择了 ListView 项来简单地显示和隐藏网格。我哪里出错了？

我从 ListView 的模板本身中提取了这些视觉状态，但我必须承认我不确定它们是如何工作的，或者它们是如何被触发的。是否应该有一些代码来做到这一点？

    <ListView Grid.Row="2" ItemsSource="{Binding Lines}" HorizontalAlignment="Stretch">
        <ListView.ItemTemplate>
            <DataTemplate>
                <Grid>
                    <Grid Name="Readonly">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="3*"/>
                        </Grid.ColumnDefinitions>

                        <TextBlock Text="{Binding One}" Grid.Column="0"/>
                        <TextBlock Text="{Binding Two}" Grid.Column="1"/>
                    </Grid>
                    <Grid Name="Editing" Visibility="Collapsed">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="3*"/>                            
                        </Grid.ColumnDefinitions>

                        <TextBox Text="{Binding One}" Grid.Column="0"/>
                        <TextBox Text="{Binding Two}" Grid.Column="1"/>
                    </Grid>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="SelectionStates">
                            <VisualState x:Name="Selected">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Editing" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Readonly" Storyboard.TargetProperty="Visibility">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                </Grid>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

非常感谢，
可汗

Answer 1

您正在将 Storyboard 动画设置在正在渲染的项目之外。您指定的目标不仅超出了外部页面的范围，而且它们可能还不存在。因此，在呈现页面时无法设置 Storyboard。

这就是你想要做的。

在 ListView 中创建一个代表您想要的布局的用户控件。元素。当您定义 ListView ，请务必包含您的 UserControl在您的 DataTemplate ， 像这样:

<ListView>
        <ListView.ItemTemplate>
            <DataTemplate>
                <local:MyUserControl />
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView.ItemsPanel>
</ListView>

现在，对于 VisualStates .您需要在 UserControl 中设置状态.这意味着 Edit 的状态和 View 的状态。一个状态需要像这样本地化。想想 Button控制。按钮中的状态在每个 Button 中定义。不是一些共享位置。

当您准备好更改其中一项的状态时，您需要将其连接到您的代码后面。在后面的代码中，您需要遍历 ListView 中的项目。并调用您创建的方法，例如 MakeStateEdit()和 MakeStateView() .设置用户控件状态的将是您对这些方法的实现。外部代码只是相信它会发生。

这意味着您需要调用 VisualStateManager.GoToState(this, "Edit", true); (或您创建的任何状态)在您的 UserControl 中, 在代码隐藏中。相反，您可以在 MakeStateView() 时设置“查看”状态。叫做。

迭代 ListView Items属性，您需要使用这样的技术( http://blog.jerrynixon.com/2012/09/how-to-access-named-control-inside-xaml.html)。你会发现一旦你开始走这条路，它真的不是很复杂。您可能会对无法在 XAML 中完成所有这些操作感到失望。你不能。但这是可以完成的!

祝你好运!