【C#】WPFのTabControl枠線を消したい

C#でWPFを使って開発をしています。
UIにTabControlを使用しているのですが、TabControl内のTabItemPanelとContentPresenterの間の枠線を消す方法をご教示頂きたいです。

現在このような状態でContentPresenterに濃灰色の枠線が引かれ、TabItemとの境目が強調されています。
この枠線を非表示にしてフラットなデザインにすることが目的です。
(黒いタブが活性、赤いタブが非活性)
イメージ説明

ペイントで境界線を塗っただけですが理想は下記の状態です。イメージ説明

ソースコード(MainWindow.xaml)

C#
1<Window x:Class="WpfApp1.MainWindow"
2        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
3        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
4        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
5        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
6        xmlns:local="clr-namespace:WpfApp1"
7        mc:Ignorable="d"
8        Title="MainWindow" Height="350" Width="525" Background="Black">
9    <Window.Resources>
10        <Style TargetType="TabItem">
11            <Setter Property="Foreground" Value="White"/>
12            <Setter Property="Background" Value="Black"/>
13            <Setter Property="Template">
14                <Setter.Value>
15                    <ControlTemplate TargetType="TabItem">
16                        <Grid Name="Panel">
17                            <ContentPresenter x:Name="ContentSite" VerticalAlignment="Center" HorizontalAlignment="Center" ContentSource="Header" Margin="20,5"/>
18                        </Grid>
19                        <ControlTemplate.Triggers>
20                            <Trigger Property="IsSelected" Value="True">
21                                <Setter TargetName="Panel" Property="Background" Value="Black" />
22                            </Trigger>
23                            <Trigger Property="IsSelected" Value="False">
24                                <Setter TargetName="Panel" Property="Background" Value="Red" />
25                            </Trigger>
26                        </ControlTemplate.Triggers>
27                    </ControlTemplate>
28                </Setter.Value>
29            </Setter>
30        </Style>
31    </Window.Resources>
32    <Grid>
33        <TabControl Background="Black" TabStripPlacement="Top" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
34            <TabItem Header="TabItem">
35                <Grid Background="Black"/>
36            </TabItem>
37            <TabItem Header="TabItem">
38                <Grid Background="#FFE5E5E5"/>
39            </TabItem>
40            <TabItem Header="TabItem">
41                <Grid Background="#FFE5E5E5"/>
42            </TabItem>
43        </TabControl>
44    </Grid>
45</Window>

回答1件

ベストアンサー

<TabControl BorderThickness="0">
でどうですか

投稿2017/05/15 16:24

lazex

総合スコア604

回答へのコメント

maas

2017/05/16 12:36

有難うございます。実際の環境ではBlackを指定している部分に、LightSkyBlueを指定しており、 TabControlの背景色にLightGrayが指定されていることで色に差分が出て枠線のような表示になってしまっていました。ご指摘の内容でフラットなデザインにできることを確認できたので、コードの見直しをして気づくことができました。簡単な内容にもご回答いただき誠に有難うございました。