Android视频手势缩放与回弹动效实现（一）

2023-09-08 19:04:17

功能需求

我们的目标是实现一个视频播放器，该播放器支持用户使用手势控制视频的缩放和回弹。具体来说，用户可以通过双指缩放手势来改变视频画面的大小，还可以通过拖动视频画面来实现视频画面的平移。当用户松开手指时，视频画面会回弹到原始位置。

2. 实现原理

2.1 缩放和平移

首先，我们需要通过View.getMatrix()获取当前播放画面的Matrix，然后进行矩阵变换：缩放和平移。通过改变画面位置和大小，我们就可以实现播放画面缩放功能。

2.2 回弹动效

缩放结束后，我们需要进行属性动画。具体来说，当前画面对应的矩阵变换为mScaleTransMatrix，计算出目标位置对应的矩阵变换为mFinalScaleTransMatrix，然后使用ValueAnimator从mScaleTransMatrix到mFinalScaleTransMatrix进行属性动画，即可实现回弹动效。

3. 代码实现

以下是一段代码示例，演示了如何实现视频手势缩放与回弹动效：

public class VideoPlayerActivity extends AppCompatActivity {

    private VideoView mVideoView;
    private Matrix mScaleTransMatrix;
    private Matrix mFinalScaleTransMatrix;
    private float mStartX, mStartY;

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

        mVideoView = findViewById(R.id.video_view);
        mVideoView.setOnTouchListener(new OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                switch (event.getActionMasked()) {
                    case MotionEvent.ACTION_DOWN:
                        mStartX = event.getX();
                        mStartY = event.getY();
                        break;
                    case MotionEvent.ACTION_MOVE:
                        float dx = event.getX() - mStartX;
                        float dy = event.getY() - mStartY;
                        mScaleTransMatrix.postTranslate(dx, dy);
                        mVideoView.setImageMatrix(mScaleTransMatrix);
                        break;
                    case MotionEvent.ACTION_UP:
                        mFinalScaleTransMatrix = mScaleTransMatrix;
                        ValueAnimator animator = ValueAnimator.ofFloat(0f, 1f);
                        animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
                            @Override
                            public void onAnimationUpdate(ValueAnimator animation) {
                                float fraction = animation.getAnimatedFraction();
                                mScaleTransMatrix.interpolateTo(mScaleTransMatrix, mFinalScaleTransMatrix, fraction);
                                mVideoView.setImageMatrix(mScaleTransMatrix);
                            }
                        });
                        animator.setDuration(200);
                        animator.start();
                        break;
                }
                return true;
            }
        });
    }
}