2021/5/14
「Textビューについて詳しく知りたい」
「モディファイアってどんなのがあるの？」
という人に向けて、この記事は書かれています。
どうも、ちょげ（@chogetarou）です。
SwiftUIでは、様々なビューがあります。
その中で最も使用頻度の多いのは、Textビューではないでしょうか。
この記事では、Textビューとそのモディファイアについて解説します。
概要
Textビューは、その名の通りテキストを表示するビューです。
Textの引数で指定した文字をビューとして表示することが出来ます。
文字列内で、\(変数名)のように、変数を埋め込むことも出来ます。
モディファイア
Text自体は、単純なビューですが、モディファイアが割と多いです。
全部覚える必要はないですが、こう言うのがあるんだっていう感じで読んでくださると良いと思います。
.font
テキストのフォントを指定するモディファイです。
引数には、フォントを指定します。
指定できるフォントには、以下のようなものがあります。
- largeTitle（ラージタイトル）
- title（タイトル）
- headline （大見出し）
- subheadline（小見出し）
- body（本文）
- callout（呼びかけ）
- footnote（脚注）
- caption（図や写真の説明）
多すぎてどれ使ったら良いのか分からないって感じですね。
ですが、実際の意味とあった用途で使えば大丈夫です。
.lineLimit
テキストの行数制限を作るモディファイアです。
引数に行数を指定することで、制限をもうけることが出来ます。
制限された行数を超えた分は、ビューに表示されないようになっています。
デフォルトでは、後ろの方が表示されなくなります。
.truncationMode
先述しましたが、linelimitでは、デフォルトで後ろの方が表示されなくなります。
この表示されなくなる部分を変えたい場合は、truncaionModeを使います。
- .head（先頭）
- .middle（真ん中）
- .tail（末尾）
これに関しては、そもそもに表示されるようにしたいので、何に使うのかよく分かりません。
.fixedSize
デフォルトでは、文字数に合わせて、Textビューは大きくなります。
ここで、Textビューのサイズは固定したい！という時は、fixedSizeモディファイアを使います。
これによって、指定して大きさより大きくなることはありません。
.foregroundColor
テキストの文字色を変えたい時がありますよね。
その時は、foregroundColorを使います。
foregroundColorに、色を指定することで文字色を変えることが出来ます。
.kerning
文字同士の距離を設定するモディファイアです。
引数に、正の値を指定することで、スペースを広げることが出来ます。
逆に負の値にすると、スペースが狭くなっていきます。
.fontWeight
引数に指定した値によって、文字の太さを変えることが出来るモディファイアです。
使用できる引数は、
- ultraLight
- thin
- light
- regular
- medium
- semibold
- bold
- heavy
- black
と言ったものがあります。
文字の太さは実際に使ってみて、合いそうなものを指定するのが良いと思います。
.underline
下線をつけるモディファイアです。
引数が2つあります。
第一引数に下線を表示するかのブール値、第二引数に色を指定します。
.strikethrough
テキストの真ん中に横線を引くモディファイアです。
訂正線のようなものです。
第一引数に下線を表示するかのブール値、第二引数に色を指定します。
.lineSpacing
行間の広さを指定するモディファイアです。
コメント