25

を使用して、TextView を 2 つのアクティビティ間で完全に遷移させることができActivityOptions.makeSceneTransitionAnimationます。ただし、トランジションに合わせてテキストを拡大したいと考えています。連絡先カードのトランジションで、テキスト「Alphonso Engelking」を拡大したマテリアル デザインの例を見ることができます。

宛先の TextView にスケール属性を設定し、changeTransform 共有要素トランジションを使用しようとしましたが、スケーリングされず、トランジション時にテキストが切り詰められてしまいます。

共有要素遷移を使用して TextView をスケーリングするにはどうすればよいですか?

4

5 に答える 5

30

編集：

以下のコメントで Kiryl Tkach が指摘したように、この Google I/O トークで説明されているより良い解決策があります。

TextViewのテキスト サイズをアニメーション化するカスタム トランジションを次のように作成できます。

public class TextSizeTransition extends Transition {
    private static final String PROPNAME_TEXT_SIZE = "alexjlockwood:transition:textsize";
    private static final String[] TRANSITION_PROPERTIES = { PROPNAME_TEXT_SIZE };

    private static final Property<TextView, Float> TEXT_SIZE_PROPERTY =
            new Property<TextView, Float>(Float.class, "textSize") {
                @Override
                public Float get(TextView textView) {
                    return textView.getTextSize();
                }

                @Override
                public void set(TextView textView, Float textSizePixels) {
                    textView.setTextSize(TypedValue.COMPLEX_UNIT_PX, textSizePixels);
                }
            };

    public TextSizeTransition() {
    }

    public TextSizeTransition(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    public String[] getTransitionProperties() {
        return TRANSITION_PROPERTIES;
    }

    @Override
    public void captureStartValues(TransitionValues transitionValues) {
        captureValues(transitionValues);
    }

    @Override
    public void captureEndValues(TransitionValues transitionValues) {
        captureValues(transitionValues);
    }

    private void captureValues(TransitionValues transitionValues) {
        if (transitionValues.view instanceof TextView) {
            TextView textView = (TextView) transitionValues.view;
            transitionValues.values.put(PROPNAME_TEXT_SIZE, textView.getTextSize());
        }
    }

    @Override
    public Animator createAnimator(ViewGroup sceneRoot, TransitionValues startValues, 
                                   TransitionValues endValues) {
        if (startValues == null || endValues == null) {
            return null;
        }

        Float startSize = (Float) startValues.values.get(PROPNAME_TEXT_SIZE);
        Float endSize = (Float) endValues.values.get(PROPNAME_TEXT_SIZE);
        if (startSize == null || endSize == null || 
            startSize.floatValue() == endSize.floatValue()) {
            return null;
        }

        TextView view = (TextView) endValues.view;
        view.setTextSize(TypedValue.COMPLEX_UNIT_PX, startSize);
        return ObjectAnimator.ofFloat(view, TEXT_SIZE_PROPERTY, startSize, endSize);
    }
}

のテキスト サイズを変更すると、アニメーションの進行中にそのレイアウトの境界が変更されるため、トランジションを適切に機能させるには、単に同じ にトランジションをTextViewスローするよりも少し手間がかかります。代わりに行う必要があるのは、ビューを手動で測定/レイアウトし、.ChangeBoundsTransitionSetSharedElementCallback

この概念を示すサンプル プロジェクトをGitHubで公開しました (このプロジェクトでは 2 つの Gradle 製品フレーバーが定義されていることに注意してください。1 つはアクティビティ トランジションを使用し、もう 1 つはフラグメント トランジションを使用します)。

于 2014-11-08T04:15:51.490 に答える
3

これは、 Google I/O 2016 トークの 1 つで取り上げられました。コードにコピーできるトランジションのソースは、こちらにあります。IDEaddTarget(TextView.class);が API 21 が必要であると不平を言う場合は、コンストラクターを削除して、ターゲットを動的に、または xml に追加します。

すなわち（これはKotlinにあることに注意してください）

val textResizeTransition = TextResize().addTarget(view.findViewById(R.id.text_view))
于 2017-07-12T17:42:57.273 に答える
0

どのように機能するかを見るChangeBoundsと、ビューの左/右/上/下のプロパティで動作します。

2 つのアクティビティで同じテキスト サイズを使用し、起動したアクティビティでscaleXとscaleYプロパティを使用して、必要に応じてテキスト サイズを変更する必要があると思います。次に、 と の組み合わせを使用ChangeBoundsしChangeTransformますTransitionSet。

于 2014-10-31T01:16:23.257 に答える