如何在WPF中重用布局 [英] How to reuse layouts in WPF

查看:230
本文介绍了如何在WPF中重用布局的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试创建一个应用程序,该应用程序将显示在选项卡中,其中每个选项卡将具有一个按钮区域和一个视图区域.

I'm trying to create a application that will be tabbed where each tab will have a button area and a view area.

现在每个选项卡实际上将具有相同的布局,只是布局中的不同之处,并且我希望能够重用相同的布局,这样我就不必在很多地方进行更改(这只是不好的编程).我可以使用资源还是样式来完成此操作?

Now each tab will essentially have the same layout just different things in the layout and I wanted to be able to reuse the same layout so that I won't have to change at many places ( it's just not good programming ). Can I accomplish this using resources or perhaps Styles.

请尽可能提供一个简短的代码示例.

Please supply a light code example if possible.

我决定添加一个示例以说明我要执行的操作,因为我仍然没有得到它.

I've decided to add an example of what I'm trying to do because I'm still not getting it.

在每个TabItem下,我都试图重新创建此网格(这有点复杂,但是您有这个主意):

Under each TabItem I'm trying to recreate this grid (It's a bit more complicated but you get the idea ):

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="200"/>
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <Border Margin="10"
                            BorderBrush="{StaticResource MediumColorBrush}"
                            CornerRadius="10"
                            BorderThickness="2"
                            Grid.Row="0">

               <!-- First content goes here -->

        </Border>

        <Border Margin="10"
                            BorderBrush="{StaticResource MediumColorBrush}"
                            CornerRadius="10"
                            BorderThickness="2"
                            Grid.Row="1">

               <!-- Second content goes here -->

        </Border>

    </Grid>

您还可以看到2个边界相同.现在,我需要在评论中放置一些内容占位符.我不会在资源字典中声明此Grid布局,然后在使用它的地方将单独的内容放入每个边框.

as you can see also the 2 borders are the same. Now I need to put some content placeholder where my comments are. I wan't to declare this Grid layout in a resource dictionary and then where I use it put seperate content into each border.

我可能有很多TabItem,所以重复此代码不是一个好主意,并且每个Tab页在2个占位符中都有不同的内容.

I may have alot of TabItems so repeating this code isn't a good idea and each Tab page will have different content in the 2 placeholders.

我可以使用

<ContentPresenter Content="{Binding}" />

只有1个内容的事物,当有更多内容时会发生什么.

thing but only for 1 content, what happens when there will be more.

推荐答案

TabItem是一个ContentControl,它允许任何子内容,但也允许对内容进行模板化,这正是您要尝试做的.您可以像这样使用DataTemplate进行共享布局. ContentPresenter是每个TabItem的不同内容的占位符.

TabItem is a ContentControl which allows any child content, but also allows templating of the content, which is exactly what you're trying to do. You can use a DataTemplate like this to do your shared layout. ContentPresenter is the placeholder for the different content of each TabItem.

<DataTemplate x:Key="ButtonViewerTemplate">
    <DockPanel>
        <Button DockPanel.Dock="Bottom" Content="OK"/>
        <Button DockPanel.Dock="Bottom" Content="Cancel"/>
        <Border Background="Aqua" BorderBrush="Red" BorderThickness="2" Padding="5">
            <ContentPresenter Content="{Binding}" />
        </Border>
    </DockPanel>
</DataTemplate>

要使用模板,只需将其设置为每个TabItem的ContentTemplate.这适用于从ContentControl派生的任何内容.

To use the template just set it to each TabItem's ContentTemplate. This works with anything derived from ContentControl.

<TabControl>
    <TabItem ContentTemplate="{StaticResource ButtonViewerTemplate}" Header="Some Buttons">
        <UniformGrid>
            <Button Content="XXXXX"/>
            <Button Content="XXXXX"/>
            <Button Content="XXXXX"/>
            <Button Content="XXXXX"/>
        </UniformGrid>
    </TabItem>
    <TabItem ContentTemplate="{StaticResource ButtonViewerTemplate}" Header="All Blue">
        <Border Background="Blue" MinHeight="50"/>
    </TabItem>
    <TabItem ContentTemplate="{StaticResource ButtonViewerTemplate}" Header="Image">
        <Image Source="http://i.msdn.microsoft.com/Platform/Controls/StoMastheadMSDN/resources/logo_msdn.png"/>
    </TabItem>
</TabControl>

这篇关于如何在WPF中重用布局的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆