时间戳

首页 > 解决方案 > WPF 选项卡到窗口

.net - WPF 选项卡到窗口

问题描述

我正在构建一个 WPF (.Net 5) 应用程序。我正在使用标签。是否可以使用标签并将其“破坏”到自己的窗口中？我问是因为这将允许并排查看两个选项卡。

如果你们中的任何人有更好的方法来并排查看标签，我很想听听。

编码...

<TabControl Grid.Row="0" Grid.Column="1" Grid.RowSpan="2"
                ItemsSource="{ Binding DetailViewModels }" 
                SelectedItem="{Binding SelectedDetailViewModel, Mode=TwoWay}"
                TabStripPlacement="Top">
        <TabControl.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="{Binding Title}" />
                    <TextBlock Text="*" Visibility="{Binding HasChanges, Converter={StaticResource BooleanToVisibilityConverter}}" />
                    <Button Command="{Binding CloseCommand}" Style="{StaticResource closeButtonStyle}"
                            VerticalContentAlignment="Top" Content="x" />
                </StackPanel>
            </DataTemplate>
        </TabControl.ItemTemplate>
    </TabControl>

我创建选项卡的方法是有一个命令，该命令创建一个 detailViewModel，它被添加到 DetailViewModels 可观察集合中。详细视图只是一个用户控件。

标签： .netwpf

解决方案

如果您想将选项卡的内容带到新窗口，反之亦然，那么您可以尝试UserControl使用您想要的内容创建一个新窗口，将其UserControl放在窗口和选项卡内，然后创建一个ViewModel用作他们俩的一个共享DataContext。

不确定这是否是最好的方法。

更新

这是我使用您提供的示例代码的意思：

在您的 App.xaml 中：

<Application ...
             xmlns:viewModels="clr-namespace:ViewModelsNamespace"
             ...>

    <Application.Resources>

        <DataTemplate DataType="{x:Type viewModels:DetailViewModel}">
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="{Binding Title}" />
                <TextBlock Text="*" Visibility="{Binding HasChanges, Converter={StaticResource BooleanToVisibilityConverter}}" />

                <Button Command="{Binding CloseCommand}" Style="{StaticResource closeButtonStyle}"
                        VerticalContentAlignment="Top" Content="x" />
            </StackPanel>
        </DataTemplate>
        
    </Application.Resources>
    
</Application>

在您的主窗口中：

<Window ...>

    <TabControl Grid.Row="0" Grid.Column="1" Grid.RowSpan="2"
                ItemsSource="{ Binding DetailViewModels }" 
                SelectedItem="{Binding SelectedDetailViewModel, Mode=TwoWay}"
                TabStripPlacement="Top"/>
    
</Window>

在您的标签查看子窗口中：

<Window ...>

    <ContentControl Content="{Binding SelectedDetailViewModel}" />
</Window>

这样，您就可以在应用程序中DataTemplate定义DetailViewModel资源，因此无论何时绑定它，都会使用 this 来查看它DataTemplate。

因此，您需要做的就是将集合绑定DetailViewModels到TabControl.ItemsSource主窗口中的 并将 绑定SelectedDetailViewModel到ContentControl子窗口中的 ，它们都将查看相同的内容。


如果选项卡的内容变大了，您可以将它放在 a 中UserControl并使用它来DataTemplate代替，正如我之前建议的那样：

，UserControl说“MyUserControl.xaml”：

<UserControl ...>

    <StackPanel Orientation="Horizontal">
        <TextBlock Text="{Binding Title}" />
        <TextBlock Text="*" Visibility="{Binding HasChanges, Converter={StaticResource BooleanToVisibilityConverter}}" />

        <Button Command="{Binding CloseCommand}" Style="{StaticResource closeButtonStyle}"
                VerticalContentAlignment="Top" Content="x" />
    </StackPanel>
    
    ....
    ....

</UserControl>

在 App.xaml 中：

<Application ...
             xmlns:viewModels="clr-namespace:ViewModelsNamespace"
             ...>

    <Application.Resources>

        <DataTemplate DataType="{x:Type viewModels:DetailViewModel}">
            <local:MyUserControl/>
        </DataTemplate>
        
    </Application.Resources>
    
</Application>

推荐阅读