Open1
４．テーマ設定
るるすたマテリアルテーマビルダー
まずは、Googleのマテリアルテーマビルダーのページに飛びます！
全部英語だけど、なんとかなるので大丈夫。
こんなページに来ましたね。
色の設定
- 一番簡単なのは、「あ」から自分の好きな色合いを選択すること。
- こだわりたいなら「い」や「い」の下にある、Primary、Secondary、Tertiary等の色を
自分で変えてもOK！ - 「う」「え」「お」はスマホのユーザ設定による色の変化を確認できるので、チェック入れてみたり、
クリックしてみるといいです。 - 最後に右下のPick your fonts →をクリックして次のページへ
フォントの設定
フォントを設定する画面です。
- 上が比較的大きな文字のためのフォントで、下が本文とかに使うためのフォント。
設定を変えてみると画面のフォントが変わるので、お気に入りを見つけて設定。 - フォントを設定したら、Export themeボタンをクリック。
設定確認＆必要ファイルダウンロード
設定確認の画面です。
特に問題がなければ、右下のExportボタンをクリック。
システムを選択する画面が表示されたら、迷わずJetpack Compose(Theme.kt)を選択。
ファイルがダウンロードされるので、解凍しましょう。
こんな感じでREADME.mdとフォルダが出てこればOK！
アプリにテーマを登録
アプリにダウンロードしたテーマを登録していきます。
Color（色）
まずは、解凍したColor.ktをテキストエディタで開き、2行目から下を全部コピー。
AndroidStudioに戻り、自分のプロジェクトの下のui>theme>Color.ktを開き、
2行目以降にペースト。
Type（フォント）【変更したい人だけ！】
フォントは変えたい人だけです。
- ライブラリにヴァージョン等を追加
libs.versions.toml
[versions]
uiTextGoogleFonts = "1.7.8"
[libraries]
androidx-ui-text-google-fonts = { module = "androidx.compose.ui:ui-text-google-fonts", version.ref = "uiTextGoogleFonts" }
→Sync Now！！！！
- 依存関係追加
build.gradle.kts(app)
dependencies {
implementation(libs.androidx.ui.text.google.fonts) //Google fonts
→Sync Now！！！！
-
ダウンロードしたType.ktを開き、2行目以降をコピー
-
AndroidStudioのui>theme＞Type.ktを開き、2行目以降にペースト
もし、「R」がエラーになったら、インポートが必要。
→import com.〇〇〇〇.〇〇〇〇.R
〇〇〇〇の部分は自分のアプリに合わせる。
※この方法でうまくフォントが適用されない可能性がある。
もし、そうなったら、フォントファイルをダウンロードし、ファイルをアプリに適用する方法がある。
Theme
- ダウンロードしたTheme.ktを開き、2行目位以降をコピー。
- AndroidStudioのui>theme＞Theme.ktを開き、2行目以降にペースト。
- 下の方にある、以下関数を自分のアプリの名前に変更。
（正しく変更すると関数名が水色になる）
カスタムテーマが適用されたか確認
実機、もしくはエミュレータで色やフォントが適用されているか確認！
