0

私が達成しようとしていること

GridLayout にボタンのグループがあります。ボタンの 1 つは、切り上げと切り捨ての間で他のボタンの機能を切り替えます。

波紋のような効果でボタンの色を変えるアニメーションを実装しようとしています。円形のリビール アニメーションは、トグル ボタンのタッチ ポイントから残りのボタンに新しい色が広がる場所で必要な効果です。どちらの場合も、アニメーションをタッチポイントから外側に成長させ、切り上げから切り捨てに切り替えて元に戻したいだけです。

問題

アニメーションは、切り上げから切り捨てまでの最初のインスタンスでのみ機能します (私のアプリはデフォルトで切り上げから始まります)。切り捨てから切り上げに切り替えるときのアニメーションはありません。すべてのボタンの色が変わり、トグル ボタンのアイコンが変わります。

これは私の最初のアプリなので、どこが間違っているのかを理解するのに苦労しています。

私の方法論とコード

私の activity_main.xml レイアウト ファイルでは、GridLayout の 2 つのセット (それぞれに子ボタンがあります) を作成し、両方を FrameLayout でラップすることによって、それらを上下に重ねました。一方のセットには、他方のセットとは異なる色が与えられます。また、2 つの丸め方法を区別するために、各セットのトグル ボタンに異なるアイコンを使用しています。2 番目の GridLayout 親の表示属性を非表示に設定しました。

<FrameLayout

    <GridLayout
        android:id="@+id/roundUp"

        <ImageButton
            android:id="@+id/buttonU1"
            ... />
        <Button ... />
        <Button ... />
    </GridLayout>

    <GridLayout
        android:id="@+id/roundDown"
        android:visibility="invisible"

        <ImageButton
            android:id="@+id/buttonD1"
            ... />
        <Button ... />
        <Button ... />
    </GridLayout>

</FrameLayout>

私の MainActivity.java ファイルで:

import ...

boolean roundingMode;

public class MainActivity extends AppCompatActivity {

    GridLayout roundUp, roundDown;
    ImageButton buttonU1, buttonD1;
    Button ...

    @Override;
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        roundUp = (GridLayout) findViewById(R.id.roundUp);
        buttonU1 = (ImageButton) findViewById(R.id.buttonU1);

        roundDown = (GridLayout) findViewById(R.id.roundDown);
        buttonD1 = (ImageButton) findViewById(R.id.buttonD1);

        roundingMode = true;

        buttonU1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                buttonCircularRevealAnim(roundDown);
                roundingMode = false;
            }
        });

        buttonD1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                buttonCircularRevealAnim(roundUp);
                roundingMode = true;
            }
        });
    }

    public void buttonCircularRevealAnim(View view) {

        int originX = roundUp.getWidth() / 2;
        int originY = roundUp.getHeight() / 2;

        float finalRadius = (float) Math.hypot(originX,originY);

        Animator anim;

        if (roundingMode) {

            anim = ViewAnimationUtils.createCircularReveal(roundDown, originX, originY, 0, finalRadius);
            roundDown.setVisibility(View.VISIBLE);
            anim.start();

            anim.addListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator animation) {
                    super.onAnimationEnd(animation);
                    roundUp.setVisibility(View.INVISIBLE);
                }
            });

        } else {

            anim = ViewAnimationUtils.createCircularReveal(roundUp, originX, originY, 0, finalRadius);
            roundUp.setVisibility(View.VISIBLE);
            anim.start();

            anim.addListener(new AnimatorListenerAdapter() {
                @Override
                public void onAnimationEnd(Animator animation) {
                    super.onAnimationEnd(animation);
                    roundDown.setVisibility(View.INVISIBLE);
                }
            });
        }
    }

現在、アニメーションの原点が GridLayout の中央にあるという事実は無視してください。まずは基礎を固めたい。

問題はアニメーションのロジックや設定にあると思いますか?

originX、originY、および finalRadius の計算を if ステートメントに移動し、roundUp (roundingMode true の場合) および roundDown GridLayouts (roundingMode false の場合) を使用しようとしましたが、うまくいきませんでした。非表示です (切り捨てから切り上げに切り替えるシナリオで)。

4

1 に答える 1