如何在MotionLayout中使用PlayerView时使其在横向模式下全屏显示

huangapple go评论65阅读模式
英文:

How to make PlayerView full screen in landscape mode when used in MotionLayout

问题

我想使得横屏模式下的 PlayerView 全屏显示,但是我无法做到。到目前为止,我尝试在配置变更为横屏模式时以编程方式设置 playerView 的布局参数,但仍然没有成功。

我创建的布局如下:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.motion.widget.MotionLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/player_motion_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_collapseMode="parallax"
    app:layoutDescription="@xml/vod_player_scene"
    app:viewToDetectTouch="@id/top_player_container">

    <!-- 其他布局元素 -->

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

我在代码中这样处理:

@Override
public void onConfigurationChanged(@NonNull Configuration newConfig) {
    super.onConfigurationChanged(newConfig);
    int newOrientation = newConfig.orientation;

    if (newOrientation == Configuration.ORIENTATION_LANDSCAPE) {
        MotionLayout.LayoutParams params = (MotionLayout.LayoutParams)
                getPlayerView().getLayoutParams();
        params.width = params.MATCH_PARENT;
        params.height = params.MATCH_PARENT;
        getPlayerView().setLayoutParams(params);
    } else {

    }
}

此外,在 Manifest.xml 文件中,我已将活动声明为:

<activity
    android:name=".main.MainActivity"       
    android:configChanges="keyboard|keyboardHidden|orientation|screenSize|screenLayout|smallestScreenSize|uiMode"
    android:label="@string/app_name"
    android:theme="@style/MainTheme"
    android:windowSoftInputMode="adjustPan" />

如果你需要更多信息,请告诉我。提前感谢你。

英文:

I want to make it possible to make the PlayerView in landscape mode full screen but I can't make it work. So far, I have tried to set the playerView layout params programmatically when configuration changes to landscape mode, but it still isn't working.

Layout that I have created

<?xml version="1.0" encoding="utf-8"?>

&lt;androidx.constraintlayout.motion.widget.MotionLayout xmlns:android=&quot;http://schemas.android.com/apk/res/android&quot;
    xmlns:app=&quot;http://schemas.android.com/apk/res-auto&quot;
    xmlns:tools=&quot;http://schemas.android.com/tools&quot;
    android:id=&quot;@+id/player_motion_layout&quot;
    android:layout_width=&quot;match_parent&quot;
    android:layout_height=&quot;match_parent&quot;
    app:layout_collapseMode=&quot;parallax&quot;
    app:layoutDescription=&quot;@xml/vod_player_scene&quot;
    app:viewToDetectTouch=&quot;@id/top_player_container&quot;&gt;

    &lt;androidx.constraintlayout.widget.ConstraintLayout
        android:id=&quot;@+id/top_player_container&quot;
        android:layout_width=&quot;match_parent&quot;
        android:layout_height=&quot;280dp&quot;
        android:background=&quot;#272727&quot;
        app:layout_constrainedWidth=&quot;true&quot;
        app:layout_constraintEnd_toEndOf=&quot;parent&quot;
        app:layout_constraintStart_toStartOf=&quot;parent&quot;
        app:layout_constraintTop_toTopOf=&quot;parent&quot; /&gt;

    &lt;com.google.android.exoplayer2.ui.PlayerView
        android:id=&quot;@+id/playerView&quot;
        android:layout_width=&quot;match_parent&quot;
        android:layout_height=&quot;280dp&quot;
        android:focusable=&quot;true&quot;
        app:controller_layout_id=&quot;@layout/exo_playback_control_view_vod&quot;
        app:fastforward_increment=&quot;10000&quot;
        app:hide_on_touch=&quot;true&quot;
        app:layout_constrainedWidth=&quot;true&quot;
        app:layout_constraintEnd_toEndOf=&quot;parent&quot;
        app:layout_constraintStart_toStartOf=&quot;parent&quot;
        app:layout_constraintTop_toTopOf=&quot;parent&quot;
        app:resize_mode=&quot;fixed_width&quot;
        app:rewind_increment=&quot;10000&quot;
        app:show_timeout=&quot;2000&quot; /&gt;

    &lt;ProgressBar
        android:id=&quot;@+id/progress_bar&quot;
        android:layout_width=&quot;64dp&quot;
        android:layout_height=&quot;64dp&quot;
        android:visibility=&quot;gone&quot;
        app:layout_constraintBottom_toBottomOf=&quot;@id/playerView&quot;
        app:layout_constraintEnd_toEndOf=&quot;@id/playerView&quot;
        app:layout_constraintStart_toStartOf=&quot;@id/playerView&quot;
        app:layout_constraintTop_toTopOf=&quot;@id/playerView&quot; /&gt;

    &lt;androidx.appcompat.widget.AppCompatImageView
        android:id=&quot;@+id/image_play&quot;
        android:layout_width=&quot;wrap_content&quot;
        android:layout_height=&quot;wrap_content&quot;
        android:layout_marginEnd=&quot;10dp&quot;
        android:alpha=&quot;0&quot;
        app:layout_constraintBottom_toBottomOf=&quot;@id/top_player_container&quot;
        app:layout_constraintEnd_toStartOf=&quot;@id/image_clear&quot;
        app:layout_constraintTop_toTopOf=&quot;@id/top_player_container&quot;
        app:srcCompat=&quot;@drawable/ic_play_arrow_32dp&quot;
        app:tint=&quot;@color/white&quot; /&gt;

    &lt;androidx.appcompat.widget.AppCompatImageView
        android:id=&quot;@+id/image_clear&quot;
        android:layout_width=&quot;wrap_content&quot;
        android:layout_height=&quot;wrap_content&quot;
        android:layout_marginEnd=&quot;10dp&quot;
        android:alpha=&quot;0&quot;
        android:background=&quot;?attr/selectableItemBackgroundBorderless&quot;
        app:layout_constraintBottom_toBottomOf=&quot;@id/top_player_container&quot;
        app:layout_constraintEnd_toEndOf=&quot;@id/top_player_container&quot;
        app:layout_constraintTop_toTopOf=&quot;@id/top_player_container&quot;
        app:srcCompat=&quot;@drawable/ic_clear_32dp&quot;
        app:tint=&quot;@color/white&quot; /&gt;

    &lt;com.google.android.material.textview.MaterialTextView
        android:id=&quot;@+id/video_title&quot;
        android:layout_width=&quot;0dp&quot;
        android:layout_height=&quot;wrap_content&quot;
        android:layout_marginStart=&quot;10dp&quot;
        android:layout_marginEnd=&quot;10dp&quot;
        android:ellipsize=&quot;end&quot;
        android:fontFamily=&quot;@font/montserrat_semi_bold&quot;
        android:maxLines=&quot;1&quot;
        android:textColor=&quot;@color/white&quot;
        app:layout_constraintBottom_toBottomOf=&quot;@id/top_player_container&quot;
        app:layout_constraintEnd_toStartOf=&quot;@id/image_play&quot;
        app:layout_constraintStart_toEndOf=&quot;@id/playerView&quot;
        app:layout_constraintTop_toTopOf=&quot;@id/top_player_container&quot;
        tools:text=&quot;Blade Runner&quot; /&gt;

    &lt;FrameLayout
        android:id=&quot;@+id/recyclerview_container&quot;
        android:layout_width=&quot;0dp&quot;
        android:layout_height=&quot;0dp&quot;
        android:background=&quot;@color/video_club_background&quot;
        app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
        app:layout_constraintEnd_toEndOf=&quot;parent&quot;
        app:layout_constraintStart_toStartOf=&quot;parent&quot;
        app:layout_constraintTop_toBottomOf=&quot;@id/top_player_container&quot; /&gt;

    &lt;androidx.recyclerview.widget.RecyclerView
        android:id=&quot;@+id/recyclerview_front&quot;
        android:layout_width=&quot;0dp&quot;
        android:layout_height=&quot;0dp&quot;
        android:background=&quot;@color/video_club_background&quot;
        app:layout_constraintBottom_toBottomOf=&quot;parent&quot;
        app:layout_constraintEnd_toEndOf=&quot;parent&quot;
        app:layout_constraintStart_toStartOf=&quot;parent&quot;
        app:layout_constraintTop_toBottomOf=&quot;@id/top_player_container&quot; /&gt;

    &lt;ProgressBar
        android:id=&quot;@+id/recyclerView_progressView&quot;
        android:layout_width=&quot;wrap_content&quot;
        android:layout_height=&quot;wrap_content&quot;
        android:layout_marginTop=&quot;20dp&quot;
        android:visibility=&quot;gone&quot;
        app:layout_constraintEnd_toEndOf=&quot;@id/recyclerview_front&quot;
        app:layout_constraintStart_toStartOf=&quot;@id/recyclerview_front&quot;
        app:layout_constraintTop_toTopOf=&quot;@id/recyclerview_front&quot; /&gt;

&lt;/androidx.constraintlayout.motion.widget.MotionLayout&gt;

And programatically, I am doing it this way (see below code)

    @Override
    public void onConfigurationChanged(@NonNull Configuration newConfig) {
        super.onConfigurationChanged(newConfig);
        int newOrientation = newConfig.orientation;

        if (newOrientation == Configuration.ORIENTATION_LANDSCAPE) {
            MotionLayout.LayoutParams params = (MotionLayout.LayoutParams)
                    getPlayerView().getLayoutParams();
            params.width = params.MATCH_PARENT;
            params.height = params.MATCH_PARENT;
            getPlayerView().setLayoutParams(params);
        } else {

        }
    }

Also in Manifest.xml I have declared activity as

    &lt;activity
         android:name=&quot;.main.MainActivity&quot;       
android:configChanges=&quot;keyboard|keyboardHidden|orientation|screenSize|screenLayout|smallestScreenSize|uiMode&quot;
         android:label=&quot;@string/app_name&quot;
         android:theme=&quot;@style/MainTheme&quot;
         android:windowSoftInputMode=&quot;adjustPan&quot; /&gt;

Let me know if you need anything else to share with you.
Thanks in advance.

答案1

得分: 1

为了能够改变任何具有MotionLayout作为父级的视图,我们应该与MotionScene一起使用。

为了解决这个问题,我创建了两个函数,一个用于将playerView宽度高度设置为MATCH_PARENT,另一个用于将其重置为以前的状态(当屏幕方向恢复为纵向时)。

private void setPlayerToMatchHeight() {
    ConstraintSet expandedSet = getMotionLayout().getConstraintSet(R.id.expanded);
    ConstraintSet.Constraint topPlayerContainerSet = expandedSet.getConstraint(R.id.top_player_container);
    topPlayerContainerSet.layout.mHeight = ViewGroup.LayoutParams.MATCH_PARENT;
}

private void setPlayerTo16x9dimensionRatio() {
    ConstraintSet expandedSet = getMotionLayout().getConstraintSet(R.id.expanded);
    ConstraintSet.Constraint topPlayerContainerSet = expandedSet.getConstraint(R.id.top_player_container);
    topPlayerContainerSet.layout.mHeight = 0;
    topPlayerContainerSet.layout.dimensionRatio = "16:9";
}

然后,在onConfigurationChanged中,根据newOrientation,我依次调用这些函数。

英文:

To be able to change any of the views that have MotionLayout as parent, we should work with MotionScene.

What I did to fix this problem, I created two functions, one to make playerView width and height to MATCH_PARENT and the other to reset it to previous state (when screen orientation back to portrait).

private void setPlayerToMatchHeight() {
    ConstraintSet expandedSet = getMotionLayout().getConstraintSet(R.id.expanded);
    ConstraintSet.Constraint topPlayerContainerSet = expandedSet.getConstraint(R.id.top_player_container);
    topPlayerContainerSet.layout.mHeight = ViewGroup.LayoutParams.MATCH_PARENT;
}

private void setPlayerTo16x9dimensionRatio() {
    ConstraintSet expandedSet = getMotionLayout().getConstraintSet(R.id.expanded);
    ConstraintSet.Constraint topPlayerContainerSet = expandedSet.getConstraint(R.id.top_player_container);
    topPlayerContainerSet.layout.mHeight = 0;
    topPlayerContainerSet.layout.dimensionRatio = &quot;16:9&quot;;
}

And then, in onConfigurationChanged, based on newOrientation, I call these functions respectively.

huangapple
  • 本文由 发表于 2020年10月11日 04:42:04
  • 转载请务必保留本文链接:https://go.coder-hub.com/64298094.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定