データにバインドされていないTabControlは正常に見えます。
代替テキストhttp://tanguay.info/web/external/tabControlPlain.png
<TabControl Width="225" Height="150">
<TabItem Header="One">
<TextBlock Margin="10" Text="This is the text block"/>
</TabItem>
<TabItem Header="Two"/>
<TabItem Header="Three"/>
<TabItem Header="Four"/>
</TabControl>
しかし、私のデータバインドされたTabControlは次のようになります。
代替テキストhttp://tanguay.info/web/external/tabBound.png
<Window.Resources>
<DataTemplate x:Key="TheTabControl">
<TabItem Header="{Binding Title}">
<TextBlock Text="{Binding Description}" Margin="10"/>
</TabItem>
</DataTemplate>
</Window.Resources>
<TabControl Width="225" Height="150" ItemsSource="{Binding AreaNames}"
ItemTemplate="{StaticResource TheTabControl}">
</TabControl>
public MainViewModel()
{
AreaNames.Add(new Area { Title = "Area1", Description = "this is the description for area 1" });
AreaNames.Add(new Area { Title = "Area2", Description = "this is the description for area 2" });
AreaNames.Add(new Area { Title = "Area3", Description = "this is the description for area 3" });
}
#region ViewModelProperty: AreaNames
private ObservableCollection<Area> _areaNames = new ObservableCollection<Area>();
public ObservableCollection<Area> AreaNames
{
get
{
return _areaNames;
}
set
{
_areaNames = value;
OnPropertyChanged("AreaNames");
}
}
#endregion
データバインドされたタブコントロールが通常の非データバインドされたタブコントロールのように見えるようにするには、何を変更する必要がありますか?