TextBoxを複数行表示には!?
WPFのTextBoxの使い方を知りたい。
TextBoxのTextプロパティをバインドするにはどうするの?
WPF でよく使用する TextBox コントロールだからこそ、気になるところや不明なところが出てくるはずです。
1つ1つ検索してもいいですが時間もかかるし大変なので、この記事では TextBox の使い方について基本編と応用編に分けて纏めています。
この記事を読んでいただいて、今抱えている問題がここで解決すれば幸いです。
オススメの参考書
C#の使い方が丁寧に解説しており、「基礎からしっかりと学びたい」という初心者の方にオススメの一冊です。サンプルコードも記載してあり、各章の最後に復習問題があるので理解度を確認しながら読み進めることができます。新しい C# のバージョンにも対応している書籍です。
TextBox(テキストボックス)とは?
TextBoxとは、アプリケーションの画面上に書式設定されていないテキストを表示および編集するためのコントロールです。
WPFではツールボックスの中に標準コントロールとして用意されています。
ユーザーに入力を促す場合にはTextBoxを画面に配置して、入力された文字列に対して処理を行います。
また、テキストボックスの使用用途に応じて、入力された文字列を横一列に並べて1行で表示したり、エディタのように複数行で表示したりします。
この場合、1行で表示するなら文字列の高さを持つテキストボックス、複数行で表示するなら2行分以上の高さを持つテキストボックスにします。
このテキストボックスを使ったWPFのサンプルを確認してみましょう。
他の UI コントロールの使い方も知りたい方はこの記事をチェック!!
TextBoxの使い方 (基本編)
テキストボックスを使用する方法についてサンプルを紹介しながら解説します。
TextBoxで1行の文字列を表示する方法
まずは最も簡単なTextBoxの使い方を紹介します。
TextBoxコントロールは、XAMLに記述して配置することもできますし、デザイナのツールボックスから配置することも可能です。ここでは直接XAMLにTextBoxを記述します。
<Window
x:Class="Sample.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"
Title="MainWindow"
Width="300"
Height="80"
mc:Ignorable="d">
<StackPanel Margin="10">
<TextBox/>
</StackPanel>
</Window>
実行すると次のような結果になります。
テキストボックスにフォーカスをあてれば、入力された文字がテキストボックスに表示されます。
注意点
このテキストボックスは文字列を入力することはできますが、この設定ではエンターキーを押しても改行されることはありません。
また、TextBoxのTextプロパティに予め文字列を入力しておくことで、文字列をセットした状態でアプリケーションを起動することができます。
<Window
x:Class="Sample.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"
Title="MainWindow"
Width="300"
Height="80"
mc:Ignorable="d">
<StackPanel Margin="10">
<TextBox Text="Hello World"/>
</StackPanel>
</Window>
TextBoxで複数行の文字列を表示する方法
テキストボックスに複数行の文字列を入力するには、AcceptsReturnプロパティとTextWrappingプロパティを設定します。
プロパティ | 説明 |
AcceptsReturn | Trueをセットすることで、EnterキーもしくはReturnキーで次の行に移動できるようになります。 |
TextWrapping | Wrapをセットすることで、行端に達したら自動的に文字列が折り返しされます。 |
このプロパティを追加したサンプルが次の通りです。
<Window
x:Class="Sample.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"
Title="MainWindow"
Width="300"
Height="200"
mc:Ignorable="d">
<Grid Margin="10">
<TextBox AcceptsReturn="True" TextWrapping="Wrap"/>
</Grid>
</Window>
実行すると次のような結果になります。
このようにプロパティを追加することで、テキストボックスに複数行の文字列を入力することが可能になります。
TextWrappingプロパティについて解説
TextWrappingプロパティは「NoWrap」、「Wrap」、「WrapWithOverflow」の合計3つのモードを選択することができます。
TextBoxに「ABCDEFGHIJKLNMOPQRSTUVWXYZ 0123456789」と入力して、それぞれのモードの違いについて見てみましょう。
- NoWrap
行の折り返しはされません。初期設定ではNoWrapが選択されています。 - Wrap
行端に達したら自動的に文字列が折り返しされます。 - WrapWithOverflow
行端に達したら文字列の区切り(スペース)で文字列が折り返しされます。そのため、テキストボックスの範囲内に文字列が収まらないことがあります。
行端で折り返しされるのがWrapとWrapWithOverflowですが、Wrapは行端で自動で折り返しされ、WrapWithOverflowは行端以上になると文字列の区切りで折り返しされます。
TextBoxのスペルチェックをする方法
TextBoxコントロールには言語に対応したスペルチェック機能が付いています。
SpellCheck.IsEnabledプロパティをtrueにすることでスペルチェックの機能をONになります。
注意点
このスペルチェックは英語と一部の言語のみにしか対応していないようです。
スペルチェックを使う際は、英語版の言語パックのインストールが必須です。また入力方式を「英語」にしておく必要があります。
スペルチェックで使用する言語を指定する為に、Languageプロパティに「en-US」を設定します。スペルチェックのサンプルコードは次の通りです。
<Window
x:Class="Sample.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"
Title="MainWindow"
Width="300"
Height="200"
mc:Ignorable="d">
<Grid Margin="10">
<TextBox
AcceptsReturn="True"
Language="en-US"
SpellCheck.IsEnabled="True"
TextWrapping="Wrap" />
</Grid>
</Window>
実行すると次のような結果になります。
スペル間違いのところにアンダーラインが引かれ、右クリックで修正候補が表示されます。
入力方式が英語であれば上図のようにスペルチェックを行うことができました。日本語は対応していないため、スペルチェックを行うことはできず、個人的には使う機会はないかもしれません。
TextBoxのカーソルを先頭もしくは末尾に移動する方法
TextBoxコントロールのカーソルを移動するには、Selectメソッドを使用します。
このメソッドは第1引数には選択する文字列の開始位置、第2引数には選択する文字列の長さを渡す過程で、範囲指定された場所へカーソルが移動します。
Select(選択する文字列の開始位置, 選択する文字列の長さ)
先頭へカーソルを置くには、選択範囲の開始位置を0にして選択範囲の長さを0にします。
末尾へカーソルを置くには、選択範囲の開始位置をテキストボックスに入力されている文字列の長さと同じにして、選択範囲の長さを0にします。入力されている文字列の長さはTextプロパティでTextBoxに入力されている文字列を取得し、StringクラスのLenghtプロパティを使って、文字列の長さを取得します。
次いでに、テキストボックスで選択されている文字列をSelectedTextプロパティを使って取得します。
<Window
x:Class="Sample.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"
Title="MainWindow"
Width="350"
Height="200"
mc:Ignorable="d">
<DockPanel Margin="10">
<!-- ユーザーが入力するテキストボックス -->
<TextBox
Name="txtMessage"
Height="70"
AcceptsReturn="True"
DockPanel.Dock="Top"
TextWrapping="Wrap" />
<!-- ユーザーが選択したテキストを表示するテキストボックス(読み取り専用) -->
<TextBox
x:Name="txtSelectedMessage"
Height="50"
AcceptsReturn="True"
DockPanel.Dock="Top"
IsReadOnly="True"
TextWrapping="Wrap" />
<Grid DockPanel.Dock="Bottom">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Button
Name="btnStartCursor"
Grid.Column="0"
Click="btnStartCursor_Click"
Content="カーソルを先頭へ" />
<Button
Name="btnEndCursor"
Grid.Column="1"
Click="btnEndCursor_Click"
Content="カーソルを末尾へ" />
<Button
Name="btnSelectedMessage"
Grid.Column="2"
Click="btnSelectedMessage_Click"
Content="選択した文字列取得" />
</Grid>
</DockPanel>
</Window>
using System.Windows;
namespace Sample
{
{
private ObservableCollection customers;
public MainWindow()
{
InitializeComponent();
}
private void btnStartCursor_Click(object sender, RoutedEventArgs e)
{
//カーソルを先頭へ移動
txtMessage.Select(0, 0);
txtMessage.Focus();
}
private void btnEndCursor_Click(object sender, RoutedEventArgs e)
{
//カーソルを末尾へ移動
txtMessage.Select(txtMessage.Text.Length, 0);
txtMessage.Focus();
}
private void btnSelectedMessage_Click(object sender, RoutedEventArgs e)
{
//選択されている文字列を別のテキストボックスへコピー&ペースト
txtSelectedMessage.Text = txtMessage.SelectedText;
}
}
}
このサンプルを動かしたのが下の図です。
このサンプルではカーソルを移動する為にボタンをクリックしています。Buttonをクリックした際、フォーカスがButtonコントロールに移ってしまうので、クリックイベントの内部でTextBoxコントロールにフォーカスが戻るように処理を追加しています。
TextBoxにスクロールバーを表示する方法
テキストボックスにスクロールバーをつけるには、HorizontalScrollBarVisibilityプロパティもしくはVerticalScrollBarVisibilityプロパティを「Visible」に設定します。
プロパティ | 説明 |
HorizontalScrollBarVisibility | 水平方向にスクロールバーを表示するか非表示にするかを設定する。 |
VerticalScrollBarVisibility | 垂直方向にスクロールバーを表示するか非表示にするかを設定する。 |
水平方向と垂直方向にスクロールバーを表示するプロパティは特定できましたが、ここで水平方向へスクロールバーを表示するには注意してほしいことがあります。
注意点
TextWrappingプロパティとHorizontalScrollBarVisibilityプロパティは同時に使用することができません。
水平方向のスクロールバーを表示する場合は、TextWrappingプロパティは、「NoWrap」に設定して行端で折り返しがされないようにしておきましょう。
<Window
x:Class="Sample.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"
Title="MainWindow"
Width="350"
Height="200"
mc:Ignorable="d">
<Grid Margin="10">
<TextBox
AcceptsReturn="True"
HorizontalScrollBarVisibility="Visible"
TextWrapping="NoWrap"
VerticalScrollBarVisibility="Visible" />
</Grid>
</Window>
実行すると次のような画面になります。
このようにスクロールバーを表示することができます。テキストボックスの行端で折り返しをする場合は、HorizontalScrollBarVisibilityは「Hidden」にしておきましょう。
テキストボックスのスクロールバーを最終行へ移動する方法
テキストボックスに入力されている文字列の最後の行へスクロールバーを移動するには、ScrollToEndメソッドを使用します。
このScrollToEndメソッドはコントロールのViewを入力された文字列の最後までスクロールするメソッドです。
<Window
x:Class="Sample.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"
Title="MainWindow"
Width="350"
Height="200"
mc:Ignorable="d">
<DockPanel Margin="10">
<!-- ユーザーが入力するテキストボックス -->
<TextBox
Name="txtMessage"
Height="120"
AcceptsReturn="True"
DockPanel.Dock="Top"
TextWrapping="Wrap"
VerticalScrollBarVisibility="Visible" />
<Button
Name="btnScrollToEnd"
Grid.Column="0"
Click="btnScrollToEnd_Click"
Content="スクロールを最終行へ移動する"
DockPanel.Dock="Bottom" />
</DockPanel>
</Window>
using System.Windows;
namespace Sample
{
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
private void btnScrollToEnd_Click(object sender, RoutedEventArgs e)
{
//最終行へスクロールを移動する
txtMessage.ScrollToEnd();
txtMessage.Focus();
}
}
}
実行すると次のような結果になります。
TextBoxのカーソルや選択範囲の背景色を変更する方法
テキストボックスのカーソルや選択範囲の背景色は、デフォルトの状態では次のようになっています。カーソルの色は「黒」、選択範囲の背景色は「青」です。
テキストボックスの背景色を黒にしてしまうと、カーソルの色も黒で同じ色なので、カーソルが見えなくなってしまいます。こういう場面でカーソルの色を変更したりします。
カーソルの色を変更する
TextBoxコントロールのCaretBrushプロパティを設定することで変更できます。
次の例ではカーソルの色を「赤」に変更しています。
<Window
x:Class="Sample.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"
Title="MainWindow"
Width="350"
Height="200"
mc:Ignorable="d">
<Grid Margin="10">
<TextBox
AcceptsReturn="True"
CaretBrush="Red"
TextWrapping="NoWrap" />
</Grid>
</Window>
CaretBrushプロパティを「Red」にすると、次のような画面になります。
カーソルの色の変化が分かるように、Windowsの設定でカーソルの幅を「1」から「5」へ設定変更しています。
選択範囲の背景色を変更する
TextBoxコントロールのプロパティを設定することで変更できます。
次の例では選択背景色を「緑」に変更しています。
<Window
x:Class="Sample.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"
Title="MainWindow"
Width="350"
Height="200"
mc:Ignorable="d">
<Grid Margin="10">
<TextBox
AcceptsReturn="True"
SelectionBrush="Green"
TextWrapping="NoWrap" />
</Grid>
</Window>
SelectionBrushプロパティを「Green」にすると、次のような画面になります。
TextBoxの使い方 (応用編)
ここからはTextBoxの応用的な書き方を紹介していきます。
TextBoxのTextプロパティをバインディングする方法
WPFでは「MVVM」という概念の元にプロジェクトの開発を行います。
このMVVMとは、Model(データやそれを加工するロジックを行う部分)、View(データを適した形で表示して入力を受け付けるUIの部分)、ViewModel(ModelとViewの双方の受け渡しを行う部分)の3つに分けて設計と実装をするということです。
ここでは、テキストボックスのTextプロパティにBindingするのはMessageプロパティとします。
MessageプロパティはViewModelクラスに記述します。
まずはXAMLにこれまで紹介したサンプルと同じようにTextBoxを配置します。今までと異なる点は、TextプロパティにViewModelのMessageプロパティをバインドしている点です。
<Window
x:Class="Sample.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"
Title="MainWindow"
Width="350"
Height="200"
mc:Ignorable="d">
<DockPanel Margin="10">
<!-- ユーザーが入力するテキストボックス -->
<TextBox
Height="120"
Text="{Binding Message}"
AcceptsReturn="True"
DockPanel.Dock="Top"
TextWrapping="Wrap"
VerticalScrollBarVisibility="Visible" />
<Button
Name="btnMessageBoxShow"
Grid.Column="0"
Click="btnMessageBoxShow_Click"
Content="MessageBoxを表示する"
DockPanel.Dock="Bottom" />
</DockPanel>
</Window>
続いて、プロジェクトにcsファイルを新規作成して、ViewModelというクラスを作成します。
ViewModelからViewへバインドで同期するには、ViewModelとなるオブジェクトがINotifyPropertyChangedを実装してプロパティが変更通知を実装している必要があります。
ViewModelにはINotifyPropertyChangedを継承して、インターフェースと変更通知の実装をしておきましょう。
using System.ComponentModel;
using System.Runtime.CompilerServices;
namespace Sample
{
public class ViewModel : INotifyPropertyChanged
{
// INotifyPropertyChangedインターフェースの実装
public event PropertyChangedEventHandler PropertyChanged;
// 変更通知
public void RaisePropertyChanged([CallerMemberName] string propertyName = null)
=> PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
// テキストボックスの入力プロパティ
private string _Message;
public string Message
{
get { return _Message; }
set { if (_Message != value) { _Message = value; RaisePropertyChanged(); } }
}
}
}
最後にViewとViewModelを同期させるために、Model(Window.xaml.cs)側でDataContextプロパティにViewModelのインスタンスをセットします。
ViewとModelの受け渡しをするViewModelが機能していることを確認する為に、Buttonをクリックしたら、Messageプロパティの値をMessageBoxで表示する処理を追加しておきます。
using System.Windows;
namespace Sample
{
public partial class MainWindow : Window
{
ViewModel viewModel = new ViewModel();
public MainWindow()
{
InitializeComponent();
//ViewとViewModelを同期させる
DataContext = viewModel;
}
private void btnMessageBoxShow_Click(object sender, RoutedEventArgs e)
{
//Messageプロパティの値を表示する
MessageBox.Show(viewModel.Message);
}
}
}
さて、このサンプルを動かしてみましょう。
次のように動作すれば完成です。
ToolBar(ツールバー)でテキストボックスのスタイルを変更する方法
ToolBarにテキストボックスのスタイルを変更するボタンを並べて、クリックされたボタンによって、太字や斜め、下線を引いてテキストボックスのスタイルを変更するサンプルを紹介します。
ここではViewModelとModelにはコードは記述せず、Viewだけにコードを記述をします。
ToolBarについては詳しく知りたい方はこちらの記事を参考にしてください。
Window.ResourcesにkeyとTargetを指定してstyleを書きます。Resourcesで定義したkey名がTargetTypeと一致するコントロールで指定されていれば、そのスタイルでコントロールは画面に表示されます。
コントロールのスタイルを変更するには、DataTriggerに条件を設定します。このDataTriggerの条件に一致すれば、DataTriggerの中で設定したスタイルが適用され、コントロールのスタイルを変更することができます。
<Window
x:Class="Sample.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"
Title="MainWindow"
Width="350"
Height="200"
mc:Ignorable="d">
<Window.Resources>
<!-- TextBoxのスタイル -->
<Style x:Key="Trigger" TargetType="TextBox">
<Setter Property="FontWeight" Value="Normal" />
<Setter Property="FontStyle" Value="Normal" />
<Setter Property="TextDecorations" Value="None" />
<!-- ツールバーのボタンが押されたらトリガーが発生し、TextBoxのスタイルを変更 -->
<Style.Triggers>
<DataTrigger Binding="{Binding ElementName=itmFormatBold, Path=IsSelected}" Value="true">
<Setter Property="FontWeight" Value="Bold" />
</DataTrigger>
<DataTrigger Binding="{Binding ElementName=itmFormatItalic, Path=IsSelected}" Value="true">
<Setter Property="FontStyle" Value="Italic" />
</DataTrigger>
<DataTrigger Binding="{Binding ElementName=itmFormatUnderline, Path=IsSelected}" Value="true">
<Setter Property="TextDecorations" Value="Underline" />
</DataTrigger>
</Style.Triggers>
</Style>
<!-- ListBoxItemのスタイル -->
<Style x:Key="DefaultStyle" TargetType="ListBoxItem">
<Setter Property="Height" Value="24" />
<Setter Property="Width" Value="24" />
<Setter Property="Margin" Value="1" />
</Style>
</Window.Resources>
<DockPanel Margin="2">
<!-- テキストボックスのスタイルを変更するツールバー -->
<ToolBar Height="32" DockPanel.Dock="Top">
<ListBox
Background="Transparent"
BorderThickness="0"
ScrollViewer.VerticalScrollBarVisibility="Hidden"
SelectionMode="Multiple">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel />
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ListBoxItem
x:Name="itmFormatBold"
Style="{StaticResource DefaultStyle}"
ToolTip="太字">
<Image Source="Icons\Bold.png" />
</ListBoxItem>
<ListBoxItem
x:Name="itmFormatItalic"
Style="{StaticResource DefaultStyle}"
ToolTip="斜め">
<Image Source="Icons\Italic.png" />
</ListBoxItem>
<ListBoxItem
x:Name="itmFormatUnderline"
Style="{StaticResource DefaultStyle}"
ToolTip="斜め">
<Image Source="Icons\Underline.png" />
</ListBoxItem>
</ListBox>
</ToolBar>
<!-- ユーザーが入力するテキストボックス -->
<TextBox
AcceptsReturn="True"
DockPanel.Dock="Bottom"
Style="{StaticResource Trigger}"
Text="{Binding Message}"
TextWrapping="Wrap"
VerticalScrollBarVisibility="Visible" />
</DockPanel>
</Window>
このサンプルを動かした結果が下図になります。
まとめ
この記事ではWPFでTextBoxを使用する方法をサンプルを公開して紹介をしました。
TextBoxでは使用用途に応じてプロパティを適切に設定することで、アプリケーションの要求を実現することができます。よく使いそうなプロパティをまとめていますので参考にしてみてください。
プロパティ名 | 内容 |
Text | TextBoxのテキスト内容を取得または設定します。 |
AcceptsReturn | Enterキーを入力した時、改行の有効・無効を指定します。 |
TextWrapping | TextBoxの行端で折り返すかどうかを指定します。 |
HorizontalScrollBarVisibility | 水平方向のスクロールバーを表示するかどうかの値を取得または設定します。 |
VerticalScrollBarVisibility | 垂直方向のスクロールバーを表示するかどうかの値を取得または設定します。 |
CaretBrush | TextBoxのカーソルの色を取得または設定します。 |
SelectionBrush | TextBoxの背景色を取得または設定をします。 |
SpellCheck.IsEnabled | スペルチェックをするかどうかを指定します。 |
AcceptsTab | Tabキーを入力した時、Tab文字が挿入を有効・無効を指定します。 |
FontFamily | 使用するフォントを取得または設定します。 |
FontSize | 使用するフォントの大きさを取得または設定します。 |
FontWeight | 使用するフォントの太さを取得または設定します。 |
TextDecorations | TextBoxの文字列に装飾を取得または設定します。 ・Overline:文字列の上に線を引く ・StrinkeThough:文字の中央に線を引く(取り消し線) ・Baseline:テキストのベースに線を引く ・Underline:文字の下に線を引く |
以上、最後まで読んでいただきありがとうございました。