🐥

JetpackCompose clickable()のクソダサエフェクトをどうにかする&ロングタップに対応する方法

2021/12/22に公開約800字

はい、

タイトルまんまですがclickable()を使うとクソダサエフェクトになるのに、

所謂リップルエフェクト的な奴が見つからず

これどうしたら直んねん!!!的なことを感じることが

多々あると思います(私はずっと思ってました)

解決方法@サンプルコード

Modifier.clickable(
    interactionSource = remember { MutableInteractionSource() },
    indication = rememberRipple(bounded = true),
    onClick = {}
)

これでタップ位置からじわ〜〜っと広がる一般的なエフェクトになります。

bounded = falseにすると、

要素の枠を超えて全体に円形状に広がるエフェクトになります(使い道不明)

ロングタップの話

結論から言うとclickable()はロングタップ非対応です。

なのでこちらを使いましょう。

Modifier
    .combinedClickable(
        onClick = { },
        onLongClick = { },
    )

簡単に言うとクリックとロングクリックの切り分けができるclickable()です。

なんで分かれてるのかはよくわかりません。

参考記事

https://www.fixes.pub/program/306565.html

https://proandroiddev.com/jetpack-compose-interactionsources-the-ripple-effect-and-you-f451b60fcd37

https://stackoverflow.com/questions/65835642/button-long-press-listener-in-android-jetpack-compose

Discussion

ログインするとコメントできます