デザインの更新と反映
コレクションでコンテンツを整理
必要に応じて、コンテンツの保存と分類を行います。
このセクションでは、前のプロジェクトをベースにして、Figma でコンポーネントを変更する方法(この場合はテキストの形式を変更する方法)を学習し、その変更が Android Studio のコードベースに反映されていることを確認します。
Figma の変更点
Figma コンポーネントを更新しましょう。Figma ファイルに戻って以下の操作を行います。
[Title] テキストレイヤを選択します。[テキスト] セクションでスタイルを [太字] に変更します。
名前付きのバージョンを保存する
次に、更新したコンポーネントをコードベースに統合します。デベロッパーが新しいバージョンのコンポーネントを使用できるようにするには、バージョンを保存する手順を繰り返します。
Figma Relay プラグインを開きます(まだ開いていない場合)。
[デベロッパーと共有] をクリックします。
[デベロッパーと共有] 画面の [変更履歴を保存] セクションに、新しいバージョンの名前と説明を入力できます。
キーボードで CMD+L(Mac の場合)または Ctrl+L(Windows の場合)を押して、新しいリンクをクリップボードにコピーします。
コンポーネント コードを更新する
コンポーネントを再インポートしてみましょう。
Android Studio で [Project] ツール ウィンドウが [Android] ビューになっていることを確認します。
次に、app/ui-packages/hello_card/
を右クリックし、[Update UI Package] を選択します。
右下に表示される読み込みバーが最後まで進むのを待ちます。
[] をクリックしてプロジェクトをビルドし、更新されたコンポーネントを app/java/com/example/hellofigma/MainActivity.kt
のプレビューで確認します。テキストは太字になりました。
アプリを実行して、同じ更新内容をエミュレータで確認します。
次のステップ
デザインを更新して、変更後のコードがどのように更新されるのかも確認しました。次に、コンポーネント内で変数データを許可するコンテンツ パラメータを使用して、デザインにアノテーションを付ける方法を学習しましょう。
あなたへのおすすめ
このページのコンテンツやコードサンプルは、コンテンツ ライセンスに記載のライセンスに従います。Java および OpenJDK は Oracle および関連会社の商標または登録商標です。
最終更新日 2024-03-25 UTC。
[{
"type": "thumb-down",
"id": "missingTheInformationINeed",
"label":"必要な情報がない"
},{
"type": "thumb-down",
"id": "tooComplicatedTooManySteps",
"label":"複雑すぎる / 手順が多すぎる"
},{
"type": "thumb-down",
"id": "outOfDate",
"label":"最新ではない"
},{
"type": "thumb-down",
"id": "translationIssue",
"label":"翻訳に関する問題"
},{
"type": "thumb-down",
"id": "samplesCodeIssue",
"label":"サンプル / コードに問題がある"
},{
"type": "thumb-down",
"id": "otherDown",
"label":"その他"
}]
[{
"type": "thumb-up",
"id": "easyToUnderstand",
"label":"わかりやすい"
},{
"type": "thumb-up",
"id": "solvedMyProblem",
"label":"問題の解決に役立った"
},{
"type": "thumb-up",
"id": "otherUp",
"label":"その他"
}]
{"lastModified": "\u6700\u7d42\u66f4\u65b0\u65e5 2024-03-25 UTC\u3002"}
[[["わかりやすい","easyToUnderstand","thumb-up"],["問題の解決に役立った","solvedMyProblem","thumb-up"],["その他","otherUp","thumb-up"]],[["必要な情報がない","missingTheInformationINeed","thumb-down"],["複雑すぎる / 手順が多すぎる","tooComplicatedTooManySteps","thumb-down"],["最新ではない","outOfDate","thumb-down"],["翻訳に関する問題","translationIssue","thumb-down"],["サンプル / コードに問題がある","samplesCodeIssue","thumb-down"],["その他","otherDown","thumb-down"]],["最終更新日 2024-03-25 UTC。"]]