フォントサイズ、太さ、スタイル
文字を太字や斜体にし、適切なサイズにします。
「フォントサイズ、太さ、スタイル」はCoddyKit上の無料Jetpack Compose Academyレッスンです。 これはレッスン2/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはJetpack Compose Academy学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Jetpack Compose Academyコースには全4レッスンが含まれています。
テキストをスタイル設定する
普通の文字でも十分ですが、実際のアプリでは強調が必要です。Text には、XML を使わずにサイズや太さ、スタイルを制御する簡単な引数があります。
サイズを設定する
fontSize を使って、テキストを大きくしたり小さくしたりします。サイズには sp 単位を使い、ユーザーのアクセシビリティ向けフォント設定が反映されます。
Text("Big title", fontSize = 24.sp)dp ではなく sp を使う理由
Text には、システムのフォントサイズに合わせて拡大縮小される sp を使います。レイアウトには dp を使いますが、ユーザーが大きな文字を好む場合は文字も大きくする必要があります。
太字にする
強調したい場合は fontWeight を使います。タイトルや重要なラベルには、FontWeight.Bold が一般的な選択です。
Text("Headline", fontWeight = FontWeight.Bold)太さには段階がある
太さは、太字かどうかだけではありません。FontWeight には Light から Black まであり、デザインに合わせて強調の度合いを細かく調整できます。
FontWeight.Light
FontWeight.Medium
FontWeight.Black斜体を追加する
fontStyle を使ってテキストを斜体にします。FontStyle.Italic は引用、キャプション、控えめな個性を加えたい場合に適しています。
Text("a note", fontStyle = FontStyle.Italic)組み合わせて使う
これらの引数は自由に組み合わせられます。1 つの Text 呼び出しで、大きく、太字で、斜体のテキストを 1 行の読みやすいコードとして指定できます。🙂
Text("Wow", fontSize = 20.sp,
fontWeight = FontWeight.Bold)フォントファミリーを変更する
fontFamily で書体を変更します。Serif や Monospace などの組み込みフォントをすぐに使えるほか、カスタムフォントも読み込めます。
Text("code", fontFamily = FontFamily.Monospace)文字間隔
ゆとりのある洗練された見出しには、letterSpacing を微調整します。文字の間隔を少し広げるだけで、大文字のタイトルに高級感を出せます。
Text("MENU", letterSpacing = 2.sp)テーマのスタイルを活用する
値を 1 つずつ設定する代わりに、MaterialTheme の既成の style を渡します。すべての画面で見た目を統一できます。
Text("Title", style = MaterialTheme.typography.titleLarge)小さな工夫で大きく洗練する
サイズ、太さ、スタイルは小さな引数ですが、組み合わせることで単調なテキストが、ユーザーにすぐ伝わる明確な階層構造になります。
クイックチェック
fontSize にはどの単位を指定すべきでしょうか。また、その理由は何でしょうか。
まとめ
fontSize、fontWeight、fontStyle、フォントファミリーを使ってテキストをスタイル設定しました。サイズには sp を使い、見た目を統一するためにテーマのタイポグラフィを優先しましょう。🎨
AI チューターと学ぶ Kotlin — 無料
ブラウザでリアルコードを書いて実行し、24/7 の AI チューターから瞬時にサポートを受け、ウェブまたはアプリで続きから学習できます。
- コース
- 30
- レッスン
- 120
よくある質問
「フォントサイズ、太さ、スタイル」レッスンは無料ですか?
はい。「フォントサイズ、太さ、スタイル」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し(組み込みコードエディタと24時間対応のAIチューター)、Jetpack Compose Academyコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Jetpack Compose Academyコースには全4レッスンが含まれています。
「フォントサイズ、太さ、スタイル」で何を学びますか?
文字を太字や斜体にし、適切なサイズにします。 ブラウザで直接実行するハンズオンコードでJetpack Compose Academyを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
Jetpack Compose Academyを始めるのに経験は必要ですか?
事前経験は必要ありません。CoddyKitのJetpack Compose Academyは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン2/4です。
「フォントサイズ、太さ、スタイル」レッスンにはどのくらい時間がかかりますか?
ほとんどのCoddyKitレッスンは約5~10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このJetpack Compose Academyレッスンでコードを書いて実行できますか?
はい。すべてのJetpack Compose Academyレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。
このコースのすべてのレッスン
- Text Composable
- フォントサイズ、太さ、スタイル
- 色、配置、オーバーフロー
- AnnotatedString:装飾付きの混在テキスト