C#WPFの道#24！TextBlock,TextBoxの改行と文字の加工を解説

ここではTextBlockやTextBoxなどで文字列を表示するときの文字の加工や，改行のモードについて解説していきます。

文字の加工
改行指定
改行の方法
サンプルコード

文字の加工

FontWeight

文字を太文字にする場合等はFontWeightにて設定します。

FontStyle

文字を普通に表示するのか，斜めに表示するのかを設定します。

TextTrimming

文字がエリア内に表示できないときに，文字の語尾に「…」を表示することができます。CharacterEllipsisを選択すると，表示できるぎりぎりまで表示して「…」が表示されます。

WordEllipsisを選択すると，単語全体が表示できる場所まで表示して「…」が表示されます。単語の途中で切りたくない場合はこちらを選択します。

改行指定

TextBlockで意図的に改行コードを入れる場合はRunとLineBreakで調整します。次の例ではAAAとBBBの間で改行されます。

<TextBlock FontSize="20"
           Width="120">
    <Run Text="AAA"/>
    <LineBreak/>
    <Run Text="BBB"/>
</TextBlock>

<TextBlock FontSize="20"

Width="120">

</TextBlock>

改行の方法

TextWrappingで，改行の方法が指定できます。

Wrapを指定すると単語の切れ目に関係なく，エリアの幅に合わせて改行されます。WrapWithOverflowを選択すると，単語の途中では改行されません。そのため，単語がすべて表示されない場合があります。

サンプルコード

<Window x:Class="WPF024.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WPF024"
        mc:Ignorable="d"
        Title="MainWindow" Height="300" Width="300">
    <Grid>
        <StackPanel>
            <TextBlock Text="AAA BBB CCC DDD EEE FFF"
                       FontSize="20"
                       Width="120"
                       FontWeight="Bold"
                       FontStyle="Italic"
                       TextTrimming="CharacterEllipsis"
                       />

            <TextBlock Text="AAA BBB CCC DDD EEE FFF"
                       FontSize="20"
                       Width="120"
                       FontWeight="Bold"
                       FontStyle="Italic"
                       TextTrimming="WordEllipsis"
                       />

            <TextBlock FontSize="20"
                       Width="120">
                <Run Text="AAA"/>
                <LineBreak/>
                <Run Text="BBB"/>
            </TextBlock>

            <TextBox FontSize="20"
                     Width="120"
                     Text="aaabbbcccdddeeefff abc"
                     TextWrapping="NoWrap"/>

            <TextBox FontSize="20"
                     Width="120"
                     Text="aaabbbcccdddeeefff abc"
                     TextWrapping="Wrap"/>

            <TextBox FontSize="20"
                     Width="120"
                     Text="aaabbbcccdddeeefff abc"
                     TextWrapping="WrapWithOverflow"/>
        </StackPanel>
    </Grid>
</Window>

<Window x:Class="WPF024.MainWindow"

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

xmlns:local="clr-namespace:WPF024"

mc:Ignorable="d"

Title="MainWindow" Height="300" Width="300">

<Grid>

<TextBlock Text="AAA BBB CCC DDD EEE FFF"

FontSize="20"

Width="120"

FontWeight="Bold"

FontStyle="Italic"

TextTrimming="CharacterEllipsis"

<TextBlock Text="AAA BBB CCC DDD EEE FFF"

FontSize="20"

Width="120"

FontWeight="Bold"

FontStyle="Italic"

TextTrimming="WordEllipsis"

<TextBlock FontSize="20"

Width="120">

</TextBlock>

<TextBox FontSize="20"

Width="120"

Text="aaabbbcccdddeeefff abc"

TextWrapping="NoWrap"/>

<TextBox FontSize="20"

Width="120"

Text="aaabbbcccdddeeefff abc"

TextWrapping="Wrap"/>

<TextBox FontSize="20"

Width="120"

Text="aaabbbcccdddeeefff abc"

TextWrapping="WrapWithOverflow"/>

</StackPanel>

</Grid>

</Window>

WPFの道！

C#を正しい3層構造で造れてますか？

非売品コースを受け取る