如何创建WPF / C#标签,就能内容? [英] How to create tab-able content in WPF/C#?

查看:209
本文介绍了如何创建WPF / C#标签,就能内容?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在WPF应用程序有一个的TabControl 。我想我的应用程序在一个程序中基本上都支持多个实例。例如,考虑一下Web浏览器,它们允许你有不同的选项卡网站的多个实例,我想在我的应用程序中包含的子应用几个实例来实现类似的功能。

I have a TabControl in my WPF application. I want my application to basically support multiple "instances" within the single program. For example, think about web browsers, they allow you to have multiple instances of websites in different tabs, I want to achieve similar functionality where my application contains several instances of "sub applications".

我目前面临的问题是,我要复制粘贴同样的XAML到每一个选项卡,因为每个标签都有完全相同的标记和用户界面,但不同的数据。另一个问题是,我需要的功能,动态创建的标签。

The problem I currently face is that I have to copy-paste the same XAML to every tab, because each tab has exactly the same markup and UI, but different data. Another problem is that I need functionality to dynamically create those tabs.

下面是在当前状态我的应用程序的屏幕截图。正如你所看到的,有在顶部2个选项卡,第二个透明的背景,因为它是不活动的。

Here's a screenshot of my application at its current state. As you can see, there are 2 tabs on the top and the second has transparent background since it's inactive.

那么,如何创建一个标签,能够系统,其中标签遗体的UI ?同样为每一个选项卡,我只需要一个XAML UI开发和重复,对于每个标签

So, how do I create a tab-able system where the UI of the tab remains the same for every tab and I only need to develop with one XAML UI and duplicate that for each tab?

要求:


  • 每个选项卡具有相同的用户界面。

  • 每个标签具有的UI元素不同的数据。

  • 作为一个开发者,我想在Visual Studio中的选项卡的XAML工作只有一次,正确的。

理想我会爱一个朴素简单的示例项目/代码中有一个无样式选项卡控制和启动时动态创建2-N卡,所有具有相同的用户界面,但具有不同的数据的应用程序。

Ideally I would love a plain simple sample project/code where there is one unstyled tab control and the application upon startup dynamically creates 2-n tabs which all have the same UI, but with different data.

推荐答案

作为另一个答案指出大概有很多方法可以做到这一点,但这里是我的简单的方法:

As noted in another answer there are probably lots of ways to do this, but here's my simple way:

定义一个DataTemplate定义每个相同的选项卡的内容。在数据模板中的控制将结合到当前选定的选项卡的视图模型。我已经把一个单一的TextBlock在我的例子,但你可以很容易地扩展这个

Define a DataTemplate that defines the content of each your identical tabs. The controls in the data template will bind to the view model of the currently selected tab. I've put a single TextBlock in my example but you can easily extend this.

使用此XAML:

<Page.DataContext>
    <Samples:TabBindingViewModels />
</Page.DataContext>

<Grid>
    <Grid.Resources>
        <DataTemplate x:Key="ContentTemplate" 
                      DataType="{x:Type Samples:TabBindingViewModel}">
            <TextBlock Text="{Binding Content}"/>
        </DataTemplate>
    </Grid.Resources>
    <TabControl ContentTemplate="{StaticResource ContentTemplate}"  
                DisplayMemberPath="Header" ItemsSource="{Binding Items}" />
</Grid>

和这个视图模型代码:

public class TabBindingViewModels
{
    public TabBindingViewModels()
    {
        Items = new ObservableCollection<TabBindingViewModel>
                    {
                        new TabBindingViewModel(1),
                        new TabBindingViewModel(2),
                        new TabBindingViewModel(3),
                    };
    }

    public IEnumerable<TabBindingViewModel> Items { get; private set; }
}

public class TabBindingViewModel
{
    public TabBindingViewModel() : this(0)
    {
    }

    public TabBindingViewModel(int n)
    {
        Header = "I'm the header: " + n.ToString(CultureInfo.InvariantCulture);
        Content = "I'm the content: " + n.ToString(CultureInfo.InvariantCulture);
    }

    public string Header { get; set; }
    public string Content { get; set; }
}

我们得到:

我挺这样教程造型上的标签控件。你可以很容易地把更复杂的内容到标签标题以及内容。

I quite like this tutorial on styling the tab control. You can easily put more complex content into the tab headers as well as the content.

您应该检查标签控件的完整模板,以深入了解它是如何工作。使用混合或VS11测试版来提取模板。

You should examine the full template of the tab control to gain an insight into how it works. Use Blend or VS11 beta to extract the template.

为了动态地添加/删除选项卡,现在你需要做的就是添加/删除项目来看的ObservableCollection车型。

In order to dynamically add/delete tabs, now all you need to do is add/delete items to the ObservableCollection of view models.

这篇关于如何创建WPF / C#标签,就能内容?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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