如何绑定TabControl？

问题描述

| a

<controls:TabControl x:Name=\"tabControlRoom\" Grid.Row=\"1\" Grid.Column=\"1\" d:LayoutOverrides=\"Width,Height\" ItemsSource=\"{Binding}\" >
            <controls:TabControl.ItemTemplate>
                <DataTemplate>
                    <controls:TabItem Header=\"{Binding name}\">
                        <StackPanel Margin=\"10\" Orientation=\"Horizontal\">

                        </StackPanel>
                    </controls:TabItem>
                </DataTemplate>
            </controls:TabControl.ItemTemplate>
        </controls:TabControl>

和代码

m_roomContext.Load(m_roomContext.GetRoomQuery());
                tabControlRoom.DataContext = m_roomContext.Rooms;

当我打开此页面时，所有元素都将显示，但是一秒钟后，我只会看到白色屏幕 错误：   加载操作查询失败   \'GetRoom \'。无法投射物体   输入\'Web.Room \'进行输入   \'System.Windows.Controls.TabItem \'/ \'     

解决方法

        创建转换器

public class SourceToTabItemsConverter : IValueConverter
    {
        public object Convert(object value,Type targetType,object parameter,System.Globalization.CultureInfo culture)
        {
            try
            {
                var source = (IEnumerable)value;
                if (source != null)
                {
                    var controlTemplate = (ControlTemplate)parameter;

                    var tabItems = new List<TabItem>();

                    foreach (object item in source)
                    {
                        PropertyInfo[] propertyInfos = item.GetType().GetProperties();

                        //тут мы выбираем,то поле которое будет Header. Вы должны сами вводить это значение.
                        var propertyInfo = propertyInfos.First(x => x.Name == \"name\");

                        string headerText = null;
                        if (propertyInfo != null)
                        {
                            object propValue = propertyInfo.GetValue(item,null);
                            headerText = (propValue ?? string.Empty).ToString();
                        }

                        var tabItem = new TabItem
                                          {
                                              DataContext = item,Header = headerText,Content =
                                                  controlTemplate == null
                                                      ? item
                                                      : new ContentControl { Template = controlTemplate }
                                          };

                        tabItems.Add(tabItem);
                    }

                    return tabItems;
                }
                return null;
            }
            catch (Exception)
            {
                return null;
            }
        }

        /// <summary>
        /// ConvertBack method is not supported
        /// </summary>
        public object ConvertBack(object value,System.Globalization.CultureInfo culture)
        {
            throw new NotSupportedException(\"ConvertBack method is not supported\");
        }

创建ControlTemplate：

<ControlTemplate x:Key=\"MyTabItemContentTemplate\">
            <StackPanel>
                <TextBlock Text=\"{Binding Path=name}\" />
            </StackPanel>
        </ControlTemplate>

并绑定转换，控制模板

<controls:TabControl  x:Name=\"tabControl\"
        ItemsSource=\"{Binding ElementName=tabControl,Path=DataContext,Converter={StaticResource ConverterCollectionToTabItems},ConverterParameter={StaticResource MyTabItemContentTemplate}}\">
        </controls:TabControl>

取自博客binding-tabcontrol     ,        绑定TabControl时，需要完成两件事，一是TabItem的标题内容，另一是所选TabItem的内容，通常是另一用户控件。 我过去解决此问题的方法是将TabControl的ItemsSource绑定到视图模型的集合，并提供两个数据模板，一个为TabItem提供标题内容，另一个为提供内容选定的TabItem，它映射到一个视图。

<Window.Resources>
    <DataTemplate x:Key=\"ItemTemplate\">
        <TextBlock Text=\"{Binding Title}\" />
    </DataTemplate>

    <DataTemplate x:Key=\"ContentTemplate\">
        <local:SampleView />
    </DataTemplate>
</Window.Resources>

<Grid>
    <TabControl 
        ItemsSource=\"{Binding SampleViewModels}\" 
        ItemTemplate=\"{StaticResource ItemTemplate}\"
        ContentTemplate=\"{StaticResource ContentTemplate}\"
        SelectedIndex=\"0\"
        />
</Grid>