简体   繁体   English

如何通过XAML在WPF TabControl中添加控件

[英]How to add controls inside WPF TabControl via XAML

I have the following XAML , a TabControl which binds to an ObservableCollection and creates my tabs just fine. 我有以下XAML ,一个TabControl绑定到ObservableCollection并创建我的选项卡就好了。

<Window x:Class="BA_Auditing.AuditWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="BizeAsset - Audit Results" Height="700" Width="1120" WindowStartupLocation="CenterScreen" WindowState="Maximized">
    <Grid>
        <TabControl Name="ModuleTabControl" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="5" ItemsSource="{Binding}" >
            <TabControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock>                            
                        <TextBlock Text="{Binding DISPLAY_NAME}"/>
                    </TextBlock>
                </DataTemplate>
            </TabControl.ItemTemplate>

            <TabControl.ContentTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition />
                            <RowDefinition Height="Auto" />
                            <RowDefinition />
                        </Grid.RowDefinitions>
                        <Grid Grid.Row="0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition />
                                <ColumnDefinition />
                            </Grid.ColumnDefinitions>
                            <TextBlock Grid.Column="0" Text="Search:" HorizontalAlignment="Right"/>
                            <TextBox x:Name="tbxSearch" Grid.Column="1"/>
                        </Grid>
                        <TextBlock Grid.Row="2" Text="Items Selected: 0 of 908" />
                    </Grid>
                </DataTemplate>
            </TabControl.ContentTemplate>
        </TabControl>
    </Grid>
</Window>

Next I'd like to populate each tab area with the next level of controls, which will include a Label , TextBox another TabControl and a TextBlock . 接下来,我想用下一级别的控件填充每个选项卡区域,其中包括LabelTextBox另一个TabControlTextBlock

I previously wrote this in WinForms and this is what it looks like: 我以前是在WinForms写的,它看起来像这样:

在此处输入图片说明

What XAML do I need add to do this? 我需要添加什么XAML才能执行此操作?
That is because I am designing it dynamically via binding rather than literally adding a TabItem 那是因为我通过绑定而不是从字面上添加TabItem来动态设计它

[EDIT] [编辑]
I have tried to enter controls into the TabControl.ContentTemplate however nothing displays in the body of the TabItem. 我试图将控件输入到TabControl.ContentTemplate但是TabItem的主体中没有任何显示。
在此处输入图片说明

I think if you had "clicked" on the "WW - Wastewater" tab you would have seen something being generated (the Search box, etc) - that's because the tab wasn't selected by default. 我认为,如果您在"WW - Wastewater"选项卡上“单击”,将会看到正在生成的内容(“搜索”框等)-这是因为默认情况下未选中该选项卡。

Anyway, here is a bit of code which gets you a bit closer to what you want - it's just to get you started, you'll need to add the other plumbing code (change notification, etc). 无论如何,这里有一些代码使您更接近所需的内容-只是为了让您入门,您需要添加其他管道代码(更改通知等)。

I don't know what you intend to have in the "Services" tab, etc...so don't know if you can handle them all in the same way ie as "Assets". 我不知道您打算在“服务”选项卡中拥有什么,等等...所以不知道您是否可以用与“资产”相同的方式来处理它们。 Also you might want to explicitly define the names of the grid columns rather than have them auto-generated - there are some techniques elsewhere you can find to do that. 另外,您可能想要显式定义网格列的名称,而不是自动生成它们-在其他地方您可以找到一些方法来做到这一点。

在此处输入图片说明

<Window x:Class="WpfApp38.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp38"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <TabControl Name="ModuleTabControl" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="5" ItemsSource="{Binding}" SelectedIndex="0" >
            <TabControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock>                            
                        <TextBlock Text="{Binding DISPLAY_NAME}"/>
                    </TextBlock>
                </DataTemplate>
            </TabControl.ItemTemplate>

            <TabControl.ContentTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="*" />
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                            <Grid Grid.Row="0">
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition />
                                    <ColumnDefinition />
                                </Grid.ColumnDefinitions>
                                <TextBlock Grid.Column="0" Text="Search:" HorizontalAlignment="Right"/>
                                <TextBox x:Name="tbxSearch" Grid.Column="1"/>
                            </Grid>
                        <TabControl Grid.Row="1" ItemsSource="{Binding SubCategories}">
                            <TabControl.ItemTemplate>
                                <DataTemplate>
                                    <TextBlock Text="{Binding DISPLAY_NAME}"/>
                                </DataTemplate>
                            </TabControl.ItemTemplate>
                            <TabControl.ContentTemplate>
                                <ItemContainerTemplate>
                                    <DataGrid AutoGenerateColumns="True" ItemsSource="{Binding Assets}">
                                    </DataGrid>
                                </ItemContainerTemplate>
                            </TabControl.ContentTemplate>
                        </TabControl>
                        <TextBlock Grid.Row="2" Text="Items Selected: 0 of 908" />
                    </Grid>
                </DataTemplate>
            </TabControl.ContentTemplate>
        </TabControl>
    </Grid>
</Window>

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace WpfApp38
{
    public class InfrastructureCateogry
    {
        public string DISPLAY_NAME { get; set; }

        public ObservableCollection<AssetCategory> SubCategories { get; set; }
    }

    public class AssetCategory
    {
        public string DISPLAY_NAME { get; set; }

        public ObservableCollection<AssetRecord> Assets { get; set; }
    }

    public class AssetRecord
    {
        public string AssetID { get; set; } // make it an int
        public string AssetType { get; set; }
        public string LastUpdateBy { get; set; } // make this a DateTime object
        public string LastUpdateDate { get; set; } // make this a DateTime object
    }

    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        private ObservableCollection<InfrastructureCateogry> infrastructurecategories = new ObservableCollection<InfrastructureCateogry>();

        public MainWindow()
        {
            InitializeComponent();

            var x = new InfrastructureCateogry()
            {
                DISPLAY_NAME = "AR - Roads and Bridges",
                SubCategories = new ObservableCollection<AssetCategory>
                {
                    new AssetCategory
                    {
                        DISPLAY_NAME = "Lines",
                        Assets = new ObservableCollection<AssetRecord>
                        {
                            new AssetRecord
                            {
                                AssetID = "20040927104600",
                                AssetType = "Gravity Main",
                                LastUpdateDate = "07/05/2015 17:01:55 PM"
                            },
                            new AssetRecord
                            {
                                AssetID = "20150507170116",
                                AssetType = "Relined",
                                LastUpdateDate = "07/05/2015 17:01:15 PM"
                            }
                        }
                    },
                    new AssetCategory
                    {
                        DISPLAY_NAME = "Points"
                    },
                    new AssetCategory
                    {
                        DISPLAY_NAME = "Plant/Components"
                    },
                    new AssetCategory
                    {
                        DISPLAY_NAME = "Services"
                    }
                }
            };

            infrastructurecategories.Add(x);

            var x2 = new InfrastructureCateogry();
            x2.DISPLAY_NAME = "WW - WasteWater";

            infrastructurecategories.Add(x2);

            this.DataContext = infrastructurecategories;
        }
    }
}

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM