首页 > 解决方案 > 如何使用 Whatsapp 等动画放大图像

问题描述

我想要像 WhatsApp 动画这样的打开图像。就我而言,我有图像列表。当我点击列表中的特定图像时,我想要放大带有动画的图像,例如 Whatsapp 在该聊天列表中打开 profilePhoto

我使用警报对话框打开放大图像。并添加动画。但我无法像whatsapp那样控制效果。

最终的 AlertDialog.Builder 构建器;

    if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
        builder = new AlertDialog.Builder(Objects.requireNonNull(context), android.R.style.Theme_Material_Light_Dialog_NoActionBar);
    } else {
        builder = new AlertDialog.Builder(Objects.requireNonNull(context));
    }

    LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    final View dialogLayout = inflater.inflate(R.layout.profile_layout, null);

    ImageView ivProfile = dialogLayout.findViewById(R.id.ivProfileImage);

    ivProfile.getLayoutParams().height = (int) (width / 1.2);
    ivProfile.getLayoutParams().width = (int) (width / 1.2);

    Glide.with(context).load(url)
            .apply(RequestOptions.centerInsideTransform().diskCacheStrategy(DiskCacheStrategy.ALL).placeholder(R.drawable.ic_profile_fill)).into(ivProfile);

    builder.setView(dialogLayout);

    AlertDialog alertDialog = builder.create();

Objects.requireNonNull(alertDialog.getWindow()).setWindowAnimations(R.style.ProfileImageAnimation);

    alertDialog.setCancelable(true);
    alertDialog.show();

//动画文件:

<!--<translate
    android:fromXDelta="-100%p"
    android:fromYDelta="0"
    android:duration="500"/>-->

<scale
    android:fromXScale="0.3"
    android:fromYScale="0.3"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="150"
    android:toXScale="1.0"
    android:toYScale="1.0" />

标签: androidanimationandroid-alertdialog

解决方案


        You can try this :

        class AnimationActivity : AppCompatActivity() {

            override fun onCreate(savedInstanceState: Bundle?) {
                super.onCreate(savedInstanceState)
                setContentView(R.layout.activity_animation_start)

                showAnimationButton.setOnClickListener { showAnimation() }
            }

            private fun showAnimation() {
                val activityOptionsCompat =
                    ActivityOptionsCompat.makeSceneTransitionAnimation(this, showAnimationButton, "TRANSITION_NAME")
                intent = Intent(this, AnimationDetailActivity::class.java)
                startActivity(intent, activityOptionsCompat.toBundle())
            }

        }

        layout : activity_animation_start

        <?xml version="1.0" encoding="utf-8"?>
        <RelativeLayout
                xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:tools="http://schemas.android.com/tools"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                tools:context=".AnimationActivity">

            <ImageView
                    android:transitionName="TRANSITION_NAME"
                    android:id="@+id/showAnimationButton"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:background="@mipmap/ic_launcher"/>

        </RelativeLayout>


        class AnimationDetailActivity : AppCompatActivity() {

            override fun onCreate(savedInstanceState: Bundle?) {
                super.onCreate(savedInstanceState)
                setContentView(R.layout.activity_animation_detail)
            }
        }

        layout :activity_animation_detail
        <?xml version="1.0" encoding="utf-8"?>
        <android.support.constraint.ConstraintLayout
                xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:app="http://schemas.android.com/apk/res-auto"
                android:layout_width="match_parent" 
                android:layout_height="match_parent">

            <ImageView android:layout_width="300dp"
                       android:layout_height="300dp"
                       android:transitionName="TRANSITION_NAME"
                       android:scaleType="fitCenter"
                       android:background="@mipmap/ic_launcher"
                       app:layout_constraintTop_toTopOf="parent"
                       app:layout_constraintBottom_toBottomOf="parent"
                       app:layout_constraintStart_toStartOf="parent"
                       app:layout_constraintEnd_toEndOf="parent"/>
        </android.support.constraint.ConstraintLayout>

Note : Make sure you keep the name transition name same in both the layouts.

推荐阅读