Path
WPF では、側面を描画するオブジェクト (これらは直線です) とUniformGrid
コンテンツを表示するオブジェクトを使用して、この外観を簡単に作成できます。
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="300">
<Window.Resources>
<Style TargetType="{x:Type TextBlock}">
<Setter Property="TextAlignment" Value="Center" />
<Setter Property="VerticalAlignment" Value="Center" />
</Style>
</Window.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Path Grid.Column="0" Data="M 0,0 0,300 15,300 15,295 5,295 5,5 15,5 15,0"
Width="15" Height="300" Fill="Black" VerticalAlignment="Stretch"
HorizontalAlignment="Center" />
<UniformGrid Grid.Column="1" Columns="2" Rows="2" TextElement.FontFamily=
"Palatino Linotype" TextElement.FontSize="28">
<TextBlock>
<Run Text="a" />
<Run Typography.Variants="Subscript" FontStyle="Italic" Text="11" />
</TextBlock>
<TextBlock>
<Run Text="a" />
<Run Typography.Variants="Subscript" FontStyle="Italic" Text="11" />
</TextBlock>
<TextBlock>
<Run Text="a" />
<Run Typography.Variants="Subscript" FontStyle="Italic" Text="21" />
</TextBlock>
<TextBlock>
<Run Text="a" />
<Run Typography.Variants="Subscript" FontStyle="Italic" Text="22" />
</TextBlock>
</UniformGrid>
<Path Grid.Column="2" Data="M 15,0 15,300 0,300 0,295 10,295 10,5 0,5 0,0"
Width="15" Height="300" Fill="Black" VerticalAlignment="Stretch"
HorizontalAlignment="Center" />
</Grid>
</Window>
これが正しく機能するためには、次の 2 つの重要な点に注意してください。
TextElement.FontFamily
選択したは、 を表示できる必要Subscript
があります。
Run.Text
あなたの例にあるように、値をハードコーディングする代わりに、プロパティにバインドできます。
<Run Text="{Binding Value1}" />
<Run Typography.Variants="Subscript" FontStyle="Italic" Text="{Binding Value2}" />