WPF/TabControl の履歴(No.2)

• 履歴一覧
• 差分 を表示
• 現在との差分 を表示
• ソース を表示
• WPF/TabControl へ行く。
  • 1 (2011-02-03 (木) 02:36:49)
  • 2 (2011-02-03 (木) 03:50:25)
  • 3 (2011-02-04 (金) 12:03:28)
  • 4 (2011-02-08 (火) 14:03:43)
  • 5 (2011-02-09 (水) 02:05:04)

Tag: WPF/TabControl

目次†

参考情報†

Tips†

基本)TabControlにコレクションをBindingする†

• ItemsSourceにコレクションを設定。
• ItempTemplateでヘッダー部分のカスタマイズ。
• ContentTemplateでタブの中身のカスタマイズ。

MainWindow.xaml

        <TabControl Name="tab" ItemsSource="{Binding Persons}">
            <TabControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Id}"/>
                </DataTemplate>
            </TabControl.ItemTemplate>
            <TabControl.ContentTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Name}"/>
                </DataTemplate>
            </TabControl.ContentTemplate>
        </TabControl>

MainWindow.xaml.cs

    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            this.Persons = new ObservableCollection<Person>();
            this.Persons.Add(new Person() { Id = 1, Name = "中田英寿" });
            this.Persons.Add(new Person() { Id = 2, Name = "中村俊輔" });
            this.DataContext = this;
        }

        public ObservableCollection<Person> Persons { get; set; }        
    }

Person.cs

    public class Person
    {
        public int Id { get; set; }
        public string Name { get; set; }
    }

タブごとに異なる内容を描画†

• TabControl.ContentTemplateSelector Property (System.Windows.Controls)
• WPF TabControl and DataTemplates - Stack Overflow

ContentTemplateSelectorを使って切り替えるのが簡単っぽい。