java - Exoplayer ui分屏添加双击前进/后退循环效果

Question

我必须在 exoplayer 上重现以下循环效果。

我添加了两个 View ，exo_rew 和 exo_ffwd。

根据标准设置自动后退或前进。

这是我到目前为止编写的代码:

<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="fill_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto">

    <LinearLayout
        android:id="@+id/exo_rew"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:weightSum="1"
        android:gravity="center"
        android:clickable="true"
        android:focusable="true"
        android:background="#00000000"
        android:foreground="?attr/selectableItemBackground"
        tools:ignore="Orientation" />

    <LinearLayout
        android:id="@+id/exo_ffwd"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:weightSum="1"
        android:layout_alignParentLeft="false"
        android:layout_alignParentRight="true"
        android:gravity="center"
        android:clickable="true"
        android:focusable="true"
        android:background="#00000000"
        android:foreground="?attr/selectableItemBackground"
        tools:ignore="Orientation" />

    <LinearLayout
        android:id="@+id/play_pause_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#15ffffff"
        android:gravity="center"
        >

        <ImageButton
            android:id="@id/exo_play"
            style="@style/ExoMediaButton.Play"
            />

        <ImageButton
            android:id="@id/exo_pause"
            style="@style/ExoMediaButton.Pause"
            />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignWithParentIfMissing="false"
        android:layout_centerHorizontal="false"
        android:layout_centerVertical="false"
        android:gravity="center_vertical"
        >

        <TextView
            android:id="@id/exo_position"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:includeFontPadding="false"
            android:paddingLeft="4dp"
            android:paddingRight="4dp"
            android:text="00:00"
            android:textColor="#FFBEBEBE"
            android:textSize="14sp"
            android:textStyle="bold"
            />

        <com.google.android.exoplayer2.ui.DefaultTimeBar
            android:id="@id/exo_progress"
            android:layout_width="0dp"
            android:layout_height="26dp"
            android:layout_weight="1"
            app:played_color="#4589f2"
            />

        <TextView
            android:id="@id/exo_duration"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:includeFontPadding="false"
            android:paddingLeft="4dp"
            android:paddingRight="4dp"
            android:text="2:00:00"
            android:textColor="#FFBEBEBE"
            android:textSize="14sp"
            android:textStyle="bold"
            />

    </LinearLayout>

</RelativeLayout>

有两个问题我没能解决:

1) 每个 View 占据屏幕的一半，exo_rew 在左边，exo_ffwd 在右边。

我找不到在 xml 中指定等于 match_parent/2 的 layout_width 的方法。有办法吗？

我尝试将 weightSum 设置为 1，但它似乎不起作用。

2) 如图所示创建圆形效果。

疑惑最好用 Canvas 创建一个圆圈或者“圆圈显露”的效果。

谁能帮我一把？

Answer 1

最好的方法是使用 ConstraintLayout 并添加带有约束开始、结束、底部和顶部的这些图像，并为它们指定 0dp 的宽度，这样它们就会根据它们的约束占据宽度。ConstraintLayout 非常强大，它还会减少您的 View 层次结构。这将有助于您实现目标。