kotlinにてアニメーションを実装したい

Question

実現したいこと

ドアのイラストがクリックされると小さくなって画面の端に移動するアニメーションを実装しようとしています。

発生している問題・分からないこと

別ファイルでDoorUiStateとして、
var openedDoor: Boolean = false
を設定しています。
以下の文でエラーになるとき、!openedDoorに代わる書き方はありますか？uiStateをbooleanにしない方法しかないでしょうか？
if (doorUiState.openedDoor isTransitioningTo doorUiState.!openedDoor)

該当のソースコード

@Composable
fun doorClicked(doorUiState: DoorUiState) {
   val transitionSpec: AnimatedContentTransitionScope<DoorUiState>.() -> ContentTransform = {
       fadeIn(animationSpec = tween(150, delayMillis = 150))
           .togetherWith(fadeOut(animationSpec = tween(150)))
           .using(
               SizeTransform { initialSize, targetSize ->
                   // Using different SizeTransform for different state change
                   if (doorUiState.openedDoor isTransitioningTo doorUiState.!openedDoor) {
                       keyframes {
                           durationMillis = 500
                           IntSize(
                               initialSize.width,
                               (initialSize.height + targetSize.height) / 2
                           ) at 150
                       }
                   } else {
                       keyframes {
                           durationMillis = 500
                           IntSize(targetSize.width, initialSize.height + 200) at 150
                       }
                   }
               }
           )

試したこと・調べたこと

• teratailやGoogle等で検索した
• ソースコードを自分なりに変更した
• 知人に聞いた
• その他

上記の詳細・結果

同じような状況は見つからず…
探し方が下手なせいかも。

補足

特になし

Comments

[utm.]

boolean型はnullを持てないので、!という演算子を使えないのだと思います。

あ、そういう話じゃないのかこれ。そもそもこの!なんだ。
というか何をしたいんだ。

[jimbe]

>以下の文でエラーになるとき

どのようなエラーでしょうか。

>そもそもこの!なんだ
boolean の not かと思います。エラーというのが syntax error で
doorUiState.!openedDoor　→　!doorUiState.openedDoor
というだけかもしれませんね。

[arayada]

utm.さん、jimbeさん、コメントありがとうございます。返信が遅れてすみません。
syntax errorでした。!doorUiState.openedDoorにしたところ一部解決しました！
ただ、isTransitioningToのほうに出ているエラーが、

Unresolved reference. None of the following candidates is applicable because of a receiver type mismatch:fun DoorUiState. isTransitioningTo(targetState: DoorUiState): Boolean

とのことです。Boolean型がだめということ？と試しにStringにしてもIntにしてもだめでした…

[shiketa]

Android開発には疎いのですが。

中置のisTransitioningTo()関数の定義はどうなっているのでしょうか。
type mismatchエラーメッセージにある、`fun DoorUiState. isTransitioningTo(targetState: DoorUiState): Boolean`なのでしょうか。

もし、そうなのであれば、
` if (doorUiState.openedDoor isTransitioningTo doorUiState.!openedDoor) {`
を修正したあとの、
` if (doorUiState.openedDoor isTransitioningTo !doorUiState.openedDoor) {`
はおかしいですね。

省略している`.`や、優先順位を明確にする括弧を補ってみてはいかがでしょうか。

もしかしたら、
` if (doorUiState.openedDoor.isTransitioningTo(!doorUiState.openedDoor)) {`
なのかもしれないし、
` if (!(doorUiState.openedDoor.isTransitioningTo(doorUiState.openedDoor)) {`
なのかもしれない。

まぁそもそも。isTransitioningTo()関数の定義が、前記のような定義であれば、Boolean型であるopenedDoorに isTransitioningTo()関数が生えているように見えることがすでにおかしいですし、引数がおなじくBoolean型であることもおかしい気がしますけれど。

いずれ、isTransitioningTo()関数を含むDoorUiStateクラスの定義も提示されてはいかがでしょうか。

[arayada]

shiketaさん、コメントありがとうございます。isTransitioningTo()の定義は以下です。

public open infix fun S.isTransitioningTo(
targetState: S
): Boolean

省略された()や.を補足しましたがだめでした。

[jimbe]

もしかして、↓の最初の MySwitch のコトじゃないでしょうか。

Jetpack Compose State Practices
https://qiita.com/takahirom/items/862f3c607850ce524744

[jimbe]

isTransitioningTo 関数って Compose で定義しているものなのでは？

公式の Compose の記事を見ていたのですが、 using の使用例で形の似たコードがありました。
そこではプロパティとして
enum class FooState { A, B }
を定義して
AnimatedContentTransitionScope<FooState>
で
if(A isTransitioningTo B) { ～
と使われていました。
kotlin いまいち分からないので enum からどうプロパティに繋がるのか不思議なのですが、書き方的に isTransitioningTo の前後は AnimatedContentTransitionScope の <> 内に書いた enum の値で無ければとか、そういうことはないでしょうか。

[utm.]

ここのチュートリアルを一旦やってみるといいのでは無いでしょうか

https://developer.android.com/codelabs/jetpack-compose-animation?hl=ja#0

[arayada]

jimbeさん
そうなんです、Composeで定義されているもので、なんならこのコンポーザブルだってどっかから引っ張ってきたほぼコピペなんです。確かに最初enumで定義したときはエラーにならなかったんですが、ViewModelを使いたい（というか使うのが一般的と聞いて）のでUiStateを介したところ、ハマりました。

utm.さん
ありがとうございます。androidDeveloperのトレーニングコースばかりやってそちらのページの存在を忘れていました。

[jimbe]

>ViewModelを使いたい（というか使うのが一般的と聞いて）のでUiStateを介したところ、ハマりました

ViewModel を使うことと enum を Boolean に変える(?)ことに関係があるようには思えませんが…その辺りはどのような情報源からなのでしょうか。

一旦 enum で動いた時のコードに戻して一通り（コピペすれば動く量の）コードをご提示頂いて、そこから ViewModel を使うカタチにするには？という方向に質問を変えてみるのもテかもしれません。
その際に Compose で ViewModel を使うにはどうするのか参考にされている情報源も明示して頂ければ、調べることも出来るかもしれません。

Answer 1

isTransitioningTo()の定義は以下です。
public open infix fun S.isTransitioningTo(targetState: S): Boolean

Sは、総称型だとおもうので、定義はこうなりますかね。
infix fun <S> S.isTransitioningTo(targetState: S): Boolean

これを組み入れた以下のソースは、コンパイルできます。

object Hogege{
  class DoorUiState {
    var openedDoor: Boolean = false
  }
  
  infix fun <S> S.isTransitioningTo(targetState: S): Boolean { TODO() }

  fun xx() {
    val doorUiState = DoorUiState()
    if (doorUiState.openedDoor.isTransitioningTo(!doorUiState.openedDoor)) Unit
    if (doorUiState.openedDoor isTransitioningTo !doorUiState.openedDoor) Unit
  }
}

.や括弧を補っても補わなくても、コンパイルはできます。動くかどうかまでは、わかりません。

---

# けれど、なんでもありでこんなのもコンパイルは通るので、なんかよくわからんですけど。

    if (doorUiState isTransitioningTo 123) Unit
    if (123 isTransitioningTo "abc") Unit

Comments

[arayada]

問題解決に向けご丁寧にお付き合いいただき、感謝感激です。
おそらく私の初歩的な知識が足りず、ほかに問題があるのか、いただいたコードで動かすことはできませんでした…
もう少し基礎の学習を固めてきます。