【AndroidStudio】detekt で JetpackCompose 記述をチェックする

あちこちの著名なアプリ開発で使われているようなので、標準的な正しい記述を学ぶことができると思います。

【AndroidStudio】detekt で JetpackCompose 記述をチェックする (随時更新)
👉 Welcome | detekt hatena-bookmark

 

🧑‍💻 インストール方法

いくつかの方法があるのでどれを使ったらいいのか分からない。

【AndroidStudio】detekt で JetpackCompose 記述をチェックする (随時更新)

一通り「Getting Started」を読んでみたけど、まず初めは手っ取り早い「IDE プラグイン」か「Gradle プラグイン」でしょうか。

 

🧑‍💻 IDE プラグインをインストール

【AndroidStudio】detekt で JetpackCompose 記述をチェックする (随時更新)

👉 detekt - IntelliJ IDEs Plugin | Marketplace hatena-bookmark
👉 detekt/detekt-intellij-plugin: detekt plugin for IntelliJ hatena-bookmark

ファイルから右クリックで実行できるので便利そう。

【AndroidStudio】detekt で JetpackCompose 記述をチェックする (随時更新)

【AndroidStudio】detekt で JetpackCompose 記述をチェックする (随時更新)

しかし、detekt.yml を利用してのチェックポリシー変更がなぜか反映されない。

【AndroidStudio】detekt で JetpackCompose 記述をチェックする (随時更新)
👉 Issues · detekt/detekt-intellij-plugin hatena-bookmark

issues にもそのような事例多く上がっているのでとりあえず捨てる。

 

🧑‍💻 Gradle プラグインをインストール

きっと、リポジトリに mavenCentral() は設定済みだと思うので、追加するのは1行。


// build.gradle.kts

plugins {
  id("io.gitlab.arturbosch.detekt") version("1.23.1" )
}

インストールはこれだけです。

タスクに登録されているか確認します。


❯ ./gradlew tasks | grep detekt

detekt
detektBaseline - Creates a detekt baseline on the given --baseline path.
detektBaselineDebug - EXPERIMENTAL: Creates detekt baseline for debug classes with type resolution
detektBaselineDebugAndroidTest - EXPERIMENTAL: Creates detekt baseline for debugAndroidTest classes with type resolution
detektBaselineDebugUnitTest - EXPERIMENTAL: Creates detekt baseline for debugUnitTest classes with type resolution
detektBaselineMain - EXPERIMENTAL: Creates detekt baseline files for production classes across all variants with type resolution
detektBaselineRelease - EXPERIMENTAL: Creates detekt baseline for release classes with type resolution
detektBaselineReleaseUnitTest - EXPERIMENTAL: Creates detekt baseline for releaseUnitTest classes with type resolution
detektBaselineTest - EXPERIMENTAL: Creates detekt baseline files for test classes across all variants with type resolution
detektDebug - EXPERIMENTAL: Run detekt analysis for debug classes with type resolution
detektDebugAndroidTest - EXPERIMENTAL: Run detekt analysis for debugAndroidTest classes with type resolution
detektDebugUnitTest - EXPERIMENTAL: Run detekt analysis for debugUnitTest classes with type resolution
detektGenerateConfig - Generate a detekt configuration file inside your project.
detektMain - EXPERIMENTAL: Run detekt analysis for production classes across all variants with type resolution
detektRelease - EXPERIMENTAL: Run detekt analysis for release classes with type resolution
detektReleaseUnitTest - EXPERIMENTAL: Run detekt analysis for releaseUnitTest classes with type resolution
detektTest - EXPERIMENTAL: Run detekt analysis for test classes across all variants with type resolution

❯ ./gradlew tasks | grep detekt | grep -v EXPERIMENTAL

detekt
detektBaseline - Creates a detekt baseline on the given --baseline path.
detektGenerateConfig - Generate a detekt configuration file inside your project.

これらの Gradle プラグインによって登録された Gradle タスクを実行することでコード記述のチェックができるようです。

インストール方法としては、これで進めていきます。

 

🧑‍💻 設定ファイル

Gradle タスクを使って書き出します。


❯ ./gradlew detektGenerateConfig

> Task :app:detektGenerateConfig
Successfully copied default config to /path/to/project/config/detekt/detekt.yml

デフォルトの設定のコピー detekt.yml が表示されてる位置に書き出されました。

【AndroidStudio】detekt で JetpackCompose 記述をチェックする

【AndroidStudio】detekt で JetpackCompose 記述をチェックする

チェックポリシーを変更する場合は、この YML 形式のファイルを書き換えます。

820行もあります。

 

🧑‍💻 実行する

では、実行してチェックしてみます。


❯ ./gradlew detekt              

> Task :app:detekt FAILED
/path/to/project/app/src/main/java/com/example/ea/ui/theme/Theme.kt:41:5: Function names should match the pattern: [a-z][a-zA-Z0-9]* [FunctionNaming]
/path/to/project/app/src/main/java/com/example/ea/MainActivity.kt:92:5: Function names should match the pattern: [a-z][a-zA-Z0-9]* [FunctionNaming]
/path/to/project/app/src/main/java/com/example/ea/ui/theme/Color.kt:5:22: This expression contains a magic number. Consider defining it to a well named constant. [MagicNumber]
/path/to/project/app/src/main/java/com/example/ea/ui/theme/Color.kt:6:26: This expression contains a magic number. Consider defining it to a well named constant. [MagicNumber]
/path/to/project/app/src/main/java/com/example/ea/ui/theme/Color.kt:7:20: This expression contains a magic number. Consider defining it to a well named constant. [MagicNumber]
/path/to/project/app/src/main/java/com/example/ea/ui/theme/Color.kt:9:22: This expression contains a magic number. Consider defining it to a well named constant. [MagicNumber]
/path/to/project/app/src/main/java/com/example/ea/ui/theme/Color.kt:10:26: This expression contains a magic number. Consider defining it to a well named constant. [MagicNumber]
/path/to/project/app/src/main/java/com/example/ea/ui/theme/Color.kt:11:20: This expression contains a magic number. Consider defining it to a well named constant. [MagicNumber]


FAILURE: Build failed with an exception.

* What went wrong:
Execution failed for task ':app:detekt'.
> Analysis failed with 8 weighted issues.

* Try:
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.
> Run with --scan to get full insights.
> Get more help at https://help.gradle.org.

BUILD FAILED in 545ms
1 actionable task: 1 executed

8箇所に2種類のエラーがでました。


Function names should match the pattern: [a-z][a-zA-Z0-9]* [FunctionNaming]


This expression contains a magic number. Consider defining it to a well named constant. [MagicNumber]

チェックするコードとして、AndroidStudio 同梱の新規プロジェクトテンプレート「Empty Activity」を書き出しただけのプロジェクトなのですが。

それぞれ内容を見ていきます。

 

🧑‍💻 Function names should match the pattern: [a-z][a-zA-Z0-9]* [FunctionNaming]


@Composable
fun FooButton(text: String, onClick: () -> Unit) {

Unit を返す @Composable 関数名は PascalCase なので、JetpackCompose に向けて設定ファイル detekt.yml を以下のいずれかに変更します。


  FunctionNaming:
    active: true
    excludes: ['**/test/**', '**/androidTest/**', '**/commonTest/**', '**/jvmTest/**', '**/androidUnitTest/**', '**/androidInstrumentedTest/**', '**/jsTest/**', '**/iosTest/**']
#   functionPattern: '[a-z][a-zA-Z0-9]*'
    functionPattern: '[a-zA-Z][a-zA-Z0-9]*'
    excludeClassPattern: '$^'


  FunctionNaming:
    active: true
    excludes: ['**/test/**', '**/androidTest/**', '**/commonTest/**', '**/jvmTest/**', '**/androidUnitTest/**', '**/androidInstrumentedTest/**', '**/jsTest/**', '**/iosTest/**']
    functionPattern: '[a-z][a-zA-Z0-9]*'
    excludeClassPattern: '$^'
    ignoreAnnotated: ['Composable'] # 追加


  FunctionNaming:
    active: true
    excludes: ['**/test/**', '**/androidTest/**', '**/commonTest/**', '**/jvmTest/**', '**/androidUnitTest/**', '**/androidInstrumentedTest/**', '**/jsTest/**', '**/iosTest/**']
    functionPattern: '[a-z][a-zA-Z0-9]*'
    excludeClassPattern: '$^'
    ignoreAnnotated: # 追加
      - 'Composable' # 追加

どうやら、detekt デフォルトの設定は JetpackCompose に十分には対応してないようです。

 

🧑‍💻 This expression contains a magic number. Consider defining it to a well named constant. [MagicNumber]


val color1 = Color(0xFFEA6D7E)

クラス、コンパニオンオブジェクト、トップレベルのプロパティのオブジェクト記述は、名前付きパラメータを指定しないと違反となるようです。

以下のいずれかで。


val color1 = Color(color = 0xFFEA6D7E)


  MagicNumber:
    active: true
    excludes: ['**/test/**', '**/androidTest/**', '**/commonTest/**', '**/jvmTest/**', '**/androidUnitTest/**', '**/androidInstrumentedTest/**', '**/jsTest/**', '**/iosTest/**', '**/*.kts']
    ignoreNumbers:
      - '-1'
      - '0'
      - '1'
      - '2'
    ignoreHashCodeFunction: true
#   ignorePropertyDeclaration: false
    ignorePropertyDeclaration: true

あまり、ignore* 系は使わない方がいいような気もする。

 

🧑‍💻 まとめ

などと書いてきましたが、これらは以下の detekt 公式ページにまとめられています。

Configuration for Compose | detekt hatena-bookmark
👉 Configuration for Compose | detekt hatena-bookmark

逆にいえば、これらは、

「Kotlin と JetpackCompose の記述ルールの違い」

ということになるのでしょう。

detekt を使わない方も一読しておくといいと思われます。

👉 【Gradle Plugin】detekt「baseline」とは hatena-bookmark

👉 ファイルの末尾に改行を追加するように Android Studio を設定するにはどうすればよいですか? hatena-bookmark


【AndroidStudio / IDEA】プラグイン「Indent Rainbow」を使う

階層が深くなって見づらいので、対応するカッコを色付けするプラグインを入れましたが、

izhangzhihao/intellij-rainbow-brackets: Rainbow Brackets / Rainbow Parentheses for IntelliJ IDEA based IDEs
👉 IntelliJ IDEA プラグイン「Rainbow Brackets」を使う hatena-bookmark

つづいてインデントも「Indent Rainbow」で色付けします。

【AndroidStudio / IDEA】プラグイン「Indend Rainbow」を使う
👉 Indent Rainbow - IntelliJ IDEs Plugin | Marketplace hatena-bookmark

【AndroidStudio / IDEA】プラグイン「Indend Rainbow」を使う

【AndroidStudio / IDEA】プラグイン「Indend Rainbow」を使う

いいんじゃないですかね、とりあえず。

うざくなった捨てます。


【Android】「Navigation Bar」はどちらか分かりますか?

混乱しません?

【Android】「Navigation Bar」はどちらか分かりますか

【Android】「Navigation Bar」はどちらか分かりますか
👉 Window insets in Compose  |  Jetpack Compose  |  Android Developers hatena-bookmark

【Android】「Navigation Bar」はどちらか分かりますか
👉 Navigation bar – Material Design 3 hatena-bookmark

ネーミングややこしくない?

最近の Android 界隈。


Material3 へのアップグレードで PullRefresh (SwipeRefresh) ができない件

👉 [Feature Request] PullRefreshIndicator for Material 3 [261760718] - Visible to Public - Issue Tracker hatena-bookmark

2023 年 1 月 17 日 05:01AM

accompanist/swiperefresh が非推奨になったので、M3 に実際の代替機能がないのは迷惑です。

2023年2月11日午後12時07分

こんにちは、機能リクエストありがとうございます! 返信が遅くなり申し訳ございません。現時点では、私たちの主な焦点は、PullRefreshIndicator が含まれていないマテリアル 3 デザイン仕様の内容を構築することです。これを完了した後 (今年中頃を目指しています)、データを調べて M2 PullRefresh の使用方法を学び、M3 ライブラリでのビルドの優先順位を評価します。

2023 年 3 月 21 日 12:34AM

私たちと同じように、これが人々の M2 から M3 への完全な移行を妨げる最後の問題になると思います。

2023 年 5 月 5 日 03:25AM

最新のアップデートはこちら:

M2 の pullrefresh には設計上の重大な問題がいくつかあり、このコンポーネントの M3 実装を提供することを最終的に決定する前に、この問題に対処したいと考えています。この M2 の作業が優先されると、M3 の実装に関するより具体的なタイムラインを提供できるようになります。

2023 年 8 月 8 日 09:38AM

こんにちは、いつ発売されるかについての情報はありますか?

そして現時点では、プルを使用して機能を更新するにはどうすればよいでしょうか?

2023 年 8 月 16 日 03:06AM

PullRefresh は、M2 からの既知の移行ギャップであり、現在開発中です。そのタイムラインについてはまだ正確な見積もりがありませんが、この動作のさまざまなコンポーネントが実装されるにつれて、このバグは更新されるでしょう。

現在、M3 で PullRefresh を使用する最良の方法は、その間に M2 ロジックをフォークすることです。

2023 年 8 月 22 日 09:54AM

この問題がこんなに長く続いていることに本当に驚いています。おそらく M3 はまだ準備ができていないので、アップグレードすべきではありません。

2023 年 8 月 28 日 12:17AM

Material3 にアップグレードしたかったのですが、これによってブロックされました。

2023年9月1日 08:22PM

これは私たちにとっても M3 へのアップグレードを妨げる問題です。

2023年9月23日 02:21AM

[マテリアル3][PullRefresh] PullRefreshIndicatorをM3に更新

* APIはPullRefreshState に依存しないように更新されました
* TonalElevation の動作は M3 に移植されていません
* PullRefreshIndicatorTransformation ロジックはここに移動されました
* 注: PullRefreshIndicator と PullRefreshIndicatorDefaults は、PullRefresh 動作の導入とともにパブリックとしてマークされます。

ということでもう少しかかりそうです。

とりあえず、これ、使ってみますか。

Material3 へのアップグレードで PullRefresh (SwipeRefresh) ができない件

👉 Omico/androidx-compose-material3-pullrefresh: A temporary solution for Jetpack Compose Material 3 pull refresh. hatena-bookmark


Jetpack Compose Dependency versions API-33 vs API-34

 

💻 Dependencies のバージョンがきれいに揃わない

ひとつづつ地道にバージョンを上げていったもののここまでしか上げることができない。

Jetpack Compose Dependency versions API-33 vs API-34

これ以上の安定版バージョンもすでに公開されているのだが、どうしても、

「API-33 ではこのバージョンは使えないので API-34 に上げてください」

というような SDK のバージョンアップを促されるメッセージが表示され、ビルドできない。

👉 Dependency 'androidx.emoji2:emoji2-views-helper:1.4.0' requires version 34 or later [295457468] - Visible to Public - Issue Tracker hatena-bookmark


 

💻 プロの回答

Android 14 の API 34 が完成したことにより、すべての新しい Jetpack ライブラリ リリースが API 34 でコンパイルされ始めました。つまり、アプリも API 34 でコンパイルする必要があります。targetSdk は、多くのことができるまったく異なるものであることに注意してください。


すなわち、


compileSdk 34
targetSdk 33

でビルドせろ。ということなのか。

 

💻 Android Studio Giraffe

現在の Android Studio Giraffe | 2022.3.1 では、最新のサポートする API レベルは「33」。


👉 Android Studio Giraffe | 2022.3.1  |  Android Developers hatena-bookmark

これ、34 に上げてもいいの ?

 

💻 まとめ

Jetpack ライブラリの安定版最新を使いたい場合は、

Android Studio Girrafe でなく、まだ、ベータ版の Hedgehog | 2023.1.1 を使ったほうがいいんでないの?

一見、きれいに通っているように見える。


compileSdk 34
targetSdk 34

それとも、すべて安定版のまま、我慢の開発を続けるか。

👉 JetBrains Toolbox で Android Studio の Stable/Beta/Canary が同時に管理できる? hatena-bookmark