Material 3カスタムデザインのハーモナイズ対応

[LeoAndo]

https://codelabs.developers.google.com/harmonize-color-android-views#0

[LeoAndo]

harmonizeを有効にすると、カスタムカラーをdynamic Themeによって生成された色と調和させることが可能。

[LeoAndo]

https://codelabs.developers.google.com/harmonize-color-android-views#2 https://codelabs.developers.google.com/harmonize-color-android-views#5

theme builderを使用してカラー定義を生成後harmonize対応しない場合は、codelabで言う以下の定数は消せる

<attr name="harmonizeCustom1" format="boolean" />
<attr name="harmonizeCustom2" format="boolean" />
<color name="custom1">#1AC9E0</color>
<color name="custom2">#32D312</color>
<color name="seed">#1AC9E0</color> <!-- codelabには明記していないが seedという定義も生成される-->

ちなみに、shouldHarmonizeメソッドはアプリ側の実装サンプル。

[LeoAndo]

theme-builderでCustom Colorを作成時にharmonizeのチェックON/OFFでプレビューできる。

https://m3.material.io/theme-builder#/custom

[LeoAndo]

https://codelabs.developers.google.com/harmonize-color-android-views#4

harmonization(色の調和)アルゴリズムは、シフトされていない色の色相と、その色と調和する必要がある色を調べて、調和しているがその基礎となる色の性質を変えない色相を見つける。

左: 色合いが異なると、調和が欠けているように見える。 右：色合いが近いので、より調和して見える。

[LeoAndo]

Harmonized対応するとUIレイヤーの作り込みが面倒になる。(Actiivty / Fragment / layout xml / List Adapter周り) また、実際に適用されたかも分かりづらい。(テストが難しい。) なのでharmonize対応はせずに、カスタムカラーだけ使用する方向で対応する。