web-dev-qa-db-ja.com

TabControl.ItemTemplate：TabItem.Header.TextをStringFormatを使用したMultiBindingに設定します

TabItem.Headerを、いくつかのフィールドから取得したバインディングに設定するにはどうすればよいですか。各バインディングは、元のヘッダーテキストの代わりに、異なるサイズで表示されます。ヘッダーのデフォルトのスタイルと動作をオーバーライドせずに-テキストのみが必要です。

テンプレートを設定しようとしましたが、内部コントロールを含む長方形が作成されました。この長方形はユーザーのクリックに反応せず、コントロールスタイルもあります。このコントロールを非表示にし、テキストのみを表示する必要があります。 。

私は以下を試しました：

<TabControl ItemsSource="{Binding}">
    <TabControl.ItemTemplate>
         <DataTemplate>
             <TabItem>
                 <TabItem.Header>
                     <MultiBinding StringFormat="{}{0}-{1}">
                         <Binding Path="Title"/>
                         <Binding Path="Category.Title"/>
                     </MultiBinding>
                 </TabItem.Header>
                 <TabItem.Content>
                     <TextBlock>
                         Here is what is gonna be in the TabItem - not header
                     </TextBlock>
                 </TabItem.Content>
             </TabItem>
         </DataTemplate>
    </TabControl.ItemTemplate>
</TabControl>

しかし、それは何も表示しません。

また、HeaderTemplateをDataTemplateに設定しようとしましたが、DataTemplateがTabItemスタイルをオーバーライドし、テキストをクリックしてもクリックされたタブに移動しません。さらに、選択されていないタブが非常に面白く見えます。テキストの長方形は浮かんでいますが、透明にしたいのです。

つまり、私の質問を要約すると、TabItem.Header.TextをStringFormatを使用したMultiBindingに設定したいと思います。

wpfbindingheadertabcontroltabitem
23
Shimmy

TabControlには、ContentTemplateプロパティと、ItemsControlから継承するItemTemplateが含まれています。 ContentTemplateを使用して、コンテンツ領域に表示されているものを区別し、ItemTemplateはヘッダーのテンプレートを定義します。さらに、ItemSourceの各アイテムは自動的にTabItemにラップされます。お気づきのように、ヘッダー内にTabItemを配置しようとするため、ItemTemplateで再作成する必要はありません。

ItemTemplate内にTabItemを再作成する代わりに、ItemTemplateを使用してヘッダーコンテンツを定義し、ContentTemplateを使用してコンテンツを定義します。

<TabControl ItemsSource="{Binding}">
    <TabControl.ItemTemplate>
        <DataTemplate>
            <TextBlock>
                <TextBlock.Text>
                    <MultiBinding StringFormat="{}{0}--{1}">
                        <Binding Path="Title" />
                        <Binding Path="Category.Title" />
                    </MultiBinding>
                </TextBlock.Text>
            </TextBlock>
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding MyContent}" />
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>

最初の段落で、ヘッダーのバインドされた部分に異なるサイズを設定したいと述べました。これを実行したい場合は、上記のように単一のバインディングまたはマルチバインディングを使用してテキストを設定することはできません。代わりに、TextBlockをネストして、それぞれに異なるフォーマットでこれを実現できます。

<TabControl.ItemTemplate>
    <DataTemplate>
        <TextBlock>
            <TextBlock Text="{Binding Title}"
                       FontSize="12" />
            <Run Text="--" />
            <TextBlock Text="{Binding Category.Title}"
                       FontSize="10" />
        </TextBlock>
    </DataTemplate>
</TabControl.ItemTemplate>
65
rmoore