Question

我正在尝试像在WhatsApp中那样实现放大动画。我有一个ListView，我在每个ListView项的左侧有一个ImageView。单击ImageView应放大图像并在中间显示（几乎全屏宽度）。

我试过the Android developer guide suggestion，但它对我不起作用。所以我用谷歌搜索了一下，却找不到“完美答案”。这是我到目前为止所得到的。

private void enlargeProfilePicture(View view, Drawable drawable, View convertView) {
    fullScreenImageView.setImageDrawable(drawable);
    Animation scale = new ScaleAnimation(
            0f, 1f, 0f, 1f, Animation.RELATIVE_TO_SELF, 0.5f, Animation.RELATIVE_TO_SELF, 0.5f);
    scale.setDuration(1000);

    final Rect startBounds = new Rect();
    final Rect finalBounds = new Rect();
    final Point globalOffset = new Point();

    convertView.getGlobalVisibleRect(startBounds);
    rootView.getGlobalVisibleRect(finalBounds, globalOffset);
    finalBounds.offset(-globalOffset.x, -globalOffset.y);

    Animation translate
            = new TranslateAnimation(startBounds.left,
            finalBounds.left,
            startBounds.top,
            finalBounds.top);
    translate.setInterpolator(new AnticipateInterpolator());
    translate.setDuration(1000);
    // Animation set to join both scaling and moving
    AnimationSet animSet = new AnimationSet(true);
    animSet.setFillEnabled(true);
    animSet.addAnimation(scale);
    animSet.addAnimation(translate);
    // Launching animation set
    animSet.setAnimationListener(new Animation.AnimationListener() {
        @Override
        public void onAnimationStart(Animation animation) {
            fullScreenImageView.setVisibility(View.VISIBLE);
        }

        @Override
        public void onAnimationEnd(Animation animation) {
        }

        @Override
        public void onAnimationRepeat(Animation animation) {
        }
    });
    fullScreenImageView.startAnimation(animSet);
}

因此root是我的ListView定义的容器，fullScreenImageView是以放大方式显示Drawable的ImageView，convertView是ListView内部的视图（ListView项目本身），视图是单击的ImageView。

<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/root">

<ListView
    android:id="@+id/list"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<ImageView
    android:id="@+id/full_size_profile_picture"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:visibility="invisible"/>
</RelativeLayout>

所以基本上出现的问题是翻译。如何找到正确的翻译起点和终点坐标？缩放动画工作正常。

Answer 1

我使用Animator而不是Animation。

Animator scaleX = ObjectAnimator.ofFloat(view, View.SCALE_X, 2f);
Animator scaleY = ObjectAnimator.ofFloat(view, View.SCALE_Y, 2f);
AnimatorSet animSet = new AnimatorSet();
animSet.setDuration(300).setInterpolator(new AccelerateDecelerateInterpolator());
animSet.playTogether(scaleX, scaleY);
animSet.start();

Animator优于Animation，因为它会修改视图的属性。 Animation只修改外观，但不修改视图本身。

如果您的应用的minSdk高于或等于14，请使用该代码。如果您的应用至少需要sdk 11，请使用以下内容：

Animator scaleX = ObjectAnimator.ofFloat(view, "scaleX", 2f);
Animator scaleY = ObjectAnimator.ofFloat(view, "scaleY", 2f);

Answer 2

好吧，我解决了这个问题。问题在于我如何使用动画构造函数。我不知道从哪里获得代码，但我只是从其他地方使用它，它显然是工作但不适合我的情况。这是一个有效的例子。

private void enlargeProfilePicture(View view, Drawable drawable) {
    // view is the ImageView holding the image inside one ListView item
    fullScreenImageView.setImageDrawable(drawable);
    Animation scale = new ScaleAnimation(0f, 1f, 0f, 1f);
    scale.setDuration(1000);
    scale.setInterpolator(new LinearInterpolator());

    final Rect startBounds = new Rect();
    final Rect finalBounds = new Rect();
    final Point globalOffset = new Point();

    view.getGlobalVisibleRect(startBounds);
    rootView.getGlobalVisibleRect(finalBounds, globalOffset);
    finalBounds.offset(-globalOffset.x, -globalOffset.y);

    Animation translate
            = new TranslateAnimation(Animation.ABSOLUTE, startBounds.left + view.getWidth()/2,
            Animation.ABSOLUTE, finalBounds.left,
            Animation.ABSOLUTE, startBounds.top - view.getHeight()/2,
            Animation.ABSOLUTE, finalBounds.top);
    translate.setInterpolator(new LinearInterpolator());
    translate.setDuration(1000);
    // Animation set to join both scaling and moving
    AnimationSet animSet = new AnimationSet(true);
    animSet.setFillEnabled(true);
    animSet.addAnimation(scale);
    animSet.addAnimation(translate);
    // Launching animation set
    animSet.setAnimationListener(new Animation.AnimationListener() {
        @Override
        public void onAnimationStart(Animation animation) {
            fullScreenImageView.setVisibility(View.VISIBLE);
        }

        @Override
        public void onAnimationEnd(Animation animation) {
        }

        @Override
        public void onAnimationRepeat(Animation animation) {
        }
    });
    fullScreenImageView.startAnimation(animSet);
}

使用动画onClick在ListView中放大ImageView

2 个答案: