Motion Layout OnSwipe 禁用点击 YoutubePlayer (YoutubePlayer API)

Question

我有一个 YoutubePlayer 在我的 Motion Layout 中播放视频。我想实现这个youtube-like motion https://developer.android.com/training/constraint-layout/motionlayout/examples#youtube-like_motion

这里的问题是，在上面提供的示例中，他们使用 ImageView 而不是 YoutubePlayer 界面来完成动画。但不幸的是，youtube 播放器界面似乎“覆盖”了点击侦听器，并且只允许点击而不是滑动。（这是我的推论）。

我想知道它是如何在 youtube 应用程序中实现的。如果有人可以回答我，请做。我需要这在我的应用程序。

我提出了一个问题，请检查一下。 https://issuetracker.google.com/issues/162155197

这是我尝试过的：

1. 当设置touchRegionId为 youtube 播放器前面或后面的视图时，界面的点击被完全禁用。动画虽然有效。我看不到此选项的解决方案，因为我认为此行为是设计使然。

2. 当设置limitBoundsTo为视图时，它会完成它的工作。它将OnSwipe动作区域限制为这样的视图边界。这完全符合我的需要，直到 YOUTUBE 播放器界面初始化。初始化后，OnSwipe不再检测到，界面只侦听点击，例如，您可以暂停视频。如果限制查看的限制大于 youtube 界面，我可以在视图的其余部分滑动。但是 youtube 界面不会收听滑动。也许界面不支持滑动？

3. 我试过不设置上述任何一项。只是简单的 OnSwipe 与拖动方向。在初始化 youtube 之前，滑动无处不在。当它被初始化时，youtube 播放器界面使用的像素停止监听滑动，它们只监听点击。

考虑到2.和3.，我觉得这是接口本身的问题。不管你有什么建议，请告诉我。谢谢你。

这是我的运动布局：

<androidx.constraintlayout.motion.widget.MotionLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/blackBackground"
    android:nestedScrollingEnabled="false"
    app:layoutDescription="@xml/activity_main_scene"
    app:motionDebug="SHOW_ALL">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:id="@+id/player_background"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:focusable="false"
        android:focusableInTouchMode="false"
        android:touchscreenBlocksFocus="false"
        android:clickable="false"
        android:background="#000000"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <FrameLayout
        android:id="@+id/main_player"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintBottom_toBottomOf="@id/player_background"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="@id/player_background" />

</androidx.constraintlayout.motion.widget.MotionLayout>

这是我的activity_main_scene xml

<?xml version="1.0" encoding="utf-8"?>
<MotionScene xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <ConstraintSet android:id="@+id/openYoutubePlayer">
        <Constraint
            android:id="@id/player_background"
            android:layout_width="match_parent"
            android:layout_height="240dp"
            android:elevation="0dp">
            <CustomAttribute
                app:attributeName="backgroundColor"
                app:customColorValue="#000000" />
        </Constraint>
    </ConstraintSet>

    <ConstraintSet android:id="@+id/closeYoutubePlayer">
        <Constraint
            android:id="@id/player_background"
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:elevation="4dp">
            <CustomAttribute
                app:attributeName="backgroundColor"
                app:customColorValue="@color/blackBackground" />
        </Constraint>
    </ConstraintSet>

    <ConstraintSet android:id="@+id/bottomYoutubePlayer">
        <Constraint
            android:id="@id/main_player"
            android:layout_width="wrap_content"
            android:layout_height="0dp"
            app:layout_constraintBottom_toBottomOf="@id/player_background"
            app:layout_constraintLeft_toLeftOf="@id/player_background"
            app:layout_constraintTop_toTopOf="@id/player_background" />
        <Constraint
            android:id="@id/player_background"
            android:layout_width="0dp"
            android:layout_height="54dp"
            app:layout_constraintBottom_toTopOf="@id/nav_view"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent" />
    </ConstraintSet>

    <Transition
        app:constraintSetEnd="@id/openYoutubePlayer"
        app:constraintSetStart="@id/closeYoutubePlayer"
        app:duration="500" />

    <Transition
        android:id="@+id/youtubePlayerIsOpened"
        app:constraintSetEnd="@id/bottomYoutubePlayer"
        app:motionInterpolator="linear"
        app:constraintSetStart="@id/openYoutubePlayer"
        app:duration="500">
        <OnSwipe
            app:dragDirection="dragUp"
            app:touchRegionId="@id/player_background"
            app:touchAnchorId="@id/player_background"/>
    </Transition>

</MotionScene>

编辑：添加了 YouTube 初始化

val youtubePlayerSupportFragment = YouTubePlayerSupportFragmentX.newInstance()
            supportFragmentManager.beginTransaction()
                .add(R.id.main_player, youtubePlayerSupportFragment).commit()
            youtubePlayerSupportFragment.initialize(
                resources.getString(R.string.API_KEY),
                object : YouTubePlayer.OnInitializedListener {
                    override fun onInitializationSuccess(
                        p0: YouTubePlayer.Provider?,
                        p1: YouTubePlayer?,
                        p2: Boolean
                    ) {
                        p1?.loadVideo(incomingLink)
                        currentLink = incomingLink
                        youtubePlayer = p1
                    }

                    override fun onInitializationFailure(
                        p0: YouTubePlayer.Provider?,
                        p1: YouTubeInitializationResult?
                    ) {
                        layoutUtils.createToast(
                            applicationContext,
                            "Error al iniciar Youtube"
                        )
                    }
                })

Answer 1

这是复杂运动布局场景的问题。要在同一转换上使用 onClick 和 onSwipe，您需要：

1. 处理运动场景转换中的 onSwipe

2. 从运动布局的子类处理 onClick

3. 在MotionLayout（自定义View）的子类中，重写这2个方法：

class MyMotionLayout @JvmOverloads constructor(context: Context):MotionLayout(context) {

       override fun onInterceptTouchEvent(ev: MotionEvent): Boolean {
           //Check if we have MotionEvent.ACTION_UP while MotionEvent.ACTION_MOVE<0.5
           // i.e ..this was a click
           if(ev==MotionEvent.ACTION_UP){
               return true
           }
           return false
       }
       override fun onTouchEvent(event: MotionEvent): Boolean {
           // Here we actually handle the touch event 
           // This method will only be called if the touch event was intercepted in
           // onInterceptTouchEvent
           callOnClick() 
      
       }
   }