wpf 如何从列表视图转换到详细信息视图

cetgtptt  于 2023-03-04  发布在  其他
关注(0)|答案(2)|浏览(138)

如何从列表视图转换到详细信息视图?例如,如果我有一个客户列表,并选择其中一个客户以转到该客户详细信息进行查看或更改。
List.xaml
Detail.xaml

p3rjfoxz

p3rjfoxz1#

例如,您可以在主窗口中使用一个ContentControl,它绑定到主视图模型的一个属性,该属性返回您想要显示的视图的视图模型,例如:

<ContentControl Content="{Binding CurrentViewModel}">
    <ContentControl.Resources>
        <DataTemplate DataType="{x:Type local:ListViewModel}">
            <local:List />
        </DataTemplate>
        <DataTemplate DataType="{x:Type local:DetailViewModel}">
            <local:Detail />
        </DataTemplate>
    </ContentControl.Resources>
</ContentControl>

将主视图模型的CurrentViewModel属性设置为ListViewModel的示例以显示List视图,设置为DetailViewModel以显示Detail视图,并确保主视图模型正确实现INotifyPropertyChanged接口。

hlswsv35

hlswsv352#

一种模式是让列表和详细信息窗格并排。
可以将包含细节控件的面板的父级绑定到列表的selecteditem。
大致如下:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <ListBox x:Name="TheList"
             ItemsSource="{Binding DataCollection}">

    </ListBox>
    <StackPanel DataContext="{Binding SelectedItem, ElementName=TheList}"
                x:Name="DetailsView"
                >
        
    </StackPanel>
</Grid>

并排编辑可能看起来有点像这样:
https://social.technet.microsoft.com/wiki/contents/articles/29859.wpf-tips-bind-to-current-item-of-collection.aspx
它对集合视图的当前项使用另一种绑定方法和/表示法。
您也可以在位于列表顶部的面板中进行编辑,当用户选择要编辑的项时,该面板将可见。
在该面板中,您可以验证任何编辑,用户必须显式提交有效编辑或放弃无效编辑。
这通常与将正在编辑的项的日期复制到新的项视图模型结合在一起,这样就不会使验证失败的编辑变得复杂。不需要还原,因为您通过替换正在编辑的项(并将更改写入数据库)提交了有效的更改。
展示完整的实现需要相当多的代码,但最终可能会类似于:

用户在面板中编辑。无效数据意味着保存/磁盘按钮被禁用,他们不能保存。但是,他们仍然可以点击安静/X按钮放弃编辑。
这是一个展示技巧而不是用户体验的示例,你可能需要在UI上做一些润色。
各种标签和文本框或其他控件使用下面介绍的技术进行排列:
https://social.technet.microsoft.com/wiki/contents/articles/29777.wpf-property-list-editing.aspx

相关问题