值不在ObservableCollection <tabitems> </tabitems>的预期范围内

时间:2013-05-06 20:21:59

标签: c# silverlight mvvm converter tabcontrol

我遇到了tabcontrol控件的问题。

我正在使用绑定和转换器动态添加项目到tabcontrol。

添加第二个tabitem时会出现以下异常(请参阅下面的代码): 价值不在预期范围内

它的堆栈跟踪:

вMS.Internal.XcpImports.CheckHResult(UInt32 hr)    MS.Internal.XcpImports.SetValue(IManagedPeerBase obj,DependencyProperty属性,DependencyObject doh)    MS.Internal.XcpImports.SetValue(IManagedPeerBase doh,DependencyProperty属性,Object obj)    System.Windows.DependencyObject.SetObjectValueToCore(DependencyProperty dp,Object value)    System.Windows.DependencyObject.SetEffectiveValue(DependencyProperty属性,EffectiveValueEntry&amp; newEntry,Object newValue)    System.Windows.DependencyObject.UpdateEffectiveValue(DependencyProperty属性,EffectiveValueEntry oldEntry,EffectiveValueEntry&amp; newEntry,ValueOperation操作)    System.Windows.DependencyObject.SetValueInternal(DependencyProperty dp,Object value,Boolean allowReadOnlySet)    System.Windows.Controls.ContentControl.set_Content(Object value)    SilverlightApplication1.Services.TabConverter.Convert(对象值,类型targetType,对象参数,CultureInfo文化)

MainPage xaml:

<UserControl x:Class="SilverlightApplication1.MainPage"
         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"
         mc:Ignorable="d"
         d:DesignHeight="1024"
         d:DesignWidth="1280"
         xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
         xmlns:local="clr-namespace:SilverlightApplication1.Services">

<UserControl.Resources>
    <local:TabConverter x:Key="tabConverter" />
</UserControl.Resources>

<Grid x:Name="LayoutRoot"
      Background="White">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="1*" />
        <ColumnDefinition Width="4*" />
    </Grid.ColumnDefinitions>
    <ListBox SelectionChanged="ListBox_SelectionChanged">
        <ListBoxItem Content="ViewA"></ListBoxItem>
        <ListBoxItem Content="ViewB"></ListBoxItem>
    </ListBox>
    <sdk:TabControl Grid.Column="1"
                    ItemsSource="{Binding Tabs, Converter={StaticResource tabConverter}}" />
</Grid>

MainPage代码隐藏:

    public partial class MainPage : UserControl {
    ViewModel viewModel = new ViewModel();

    public MainPage() {
        InitializeComponent();
        this.DataContext = viewModel;
    }

    private void ListBox_SelectionChanged(object sender, SelectionChangedEventArgs e) {
        try {
            viewModel.Tabs.Add(new TabItemModel() {
                Header = "New Tab",
                Content = new Grid()
            });

            // sdk:tabcontrol does not listen CollectionChanged of viewModel.Tabs.
            // thats why:
            viewModel.Tabs = viewModel.Tabs;
        } catch (Exception) { }
    }
}

数据模型:

 public class TabItemModel {
    public string Header { get; set; }
    public UIElement Content { get; set; }
}

查看型号:

public class ViewModel:INotifyPropertyChanged {
    ObservableCollection<TabItemModel> tabs = new ObservableCollection<TabItemModel>();
    public ObservableCollection<TabItemModel> Tabs {
        get { return tabs; }
        set { tabs = value; OnPropertyChanged(PropertyNames.Tabs); }
    }

    public event PropertyChangedEventHandler PropertyChanged;
    void OnPropertyChanged(string property) {
        if (PropertyChanged != null)
            PropertyChanged(this, new PropertyChangedEventArgs(property));
    }

    class PropertyNames {
        public const string Tabs = "Tabs";
    }
}

标签转换器:

public class TabConverter : IValueConverter {

    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) {
        try {
            var object_data = value as ObservableCollection<TabItemModel>;
            var result = new List<TabItem>();
            foreach (var item in object_data) {
                result.Add(new TabItem() { 
                    Header = item.Header,
                    Content = item.Content // if comment this, everything works
                });
            }
            return result;
        } catch (Exception e) {
            MessageBox.Show(e.StackTrace, e.Message, MessageBoxButton.OK);
            return null;
        }
    }

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) {
        throw new NotImplementedException();
    }
}

1 个答案:

答案 0 :(得分:3)

您的问题是您在数据模型中保留了UIElement

在MVVM中,这本身就是一个很大的禁忌,但这里的具体问题是,当您添加第二个TabItemModel并且转换器重新创建所有需要的TabItem时,第一个 TabItemModel的内容一次放置在两个TabItem上一瞬间。单个UI元素只能包含一个父级。

这里最“MVVM”的解决方案是将UI元素保留在数据模型之外。相反,只需在TabItemModel.Content中保留一些原始数据,并在xaml中使用DataTemplate来表示该数据的用户界面。

如果你需要在你的数据模型中保留UI元素,我建议你看看这个经过调整的TabControl,它修复了有问题的Silverlight TabControl并且不需要转换器正常运行: Silverlight TabControl with data binding(摘自此SO帖子讨论同一问题:Bind a Silverlight TabControl to a Collection