我為第三方視頻播放器制作了自定義控制元件。我在對齊某些元素時遇到了麻煩。我希望我的控制元件像這樣對齊,搜索欄占據了父級的大部分寬度,搜索欄時間和 cc 按鈕在搜索欄開始和結束處的搜索欄上方對齊:
其他播放器控制元件
這是我的播放器當前的樣子,頂部有搜索欄時間和抄送按鈕: 我的播放器控制元件
這是我的代碼:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/jw_surface_transparent_black"
android:clickable="true">
<RelativeLayout
android:id="@ id/loading_panel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:visibility="gone">
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/jw_transparent"
android:indeterminate="true"
android:indeterminateDrawable="@drawable/ic_jw_buffer" />
</RelativeLayout>
<LinearLayout
android:id="@ id/center_controls"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:orientation="horizontal">
<ImageButton
android:id="@ id/rewind_button"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_gravity="center"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="@color/jw_transparent"
android:src="@drawable/rw_15_btn"
android:visibility="invisible" />
<ImageButton
android:id="@ id/play_and_pause_button"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_gravity="center"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="@color/jw_transparent"
android:src="@drawable/ic_jw_play" />
<ImageButton
android:id="@ id/fast_forward_button"
android:layout_width="70dp"
android:layout_height="70dp"
android:layout_gravity="center"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="@color/jw_transparent"
android:src="@drawable/ff_15_btn"
android:visibility="invisible" />
</LinearLayout>
<RelativeLayout
android:id="@ id/mid_bottom_controls"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignStart="@id/seek"
android:layout_alignEnd="@id/seek"
android:gravity="bottom">
<androidx.appcompat.widget.AppCompatTextView
android:id="@ id/seekbar_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:text="@string/seekbar_text"
android:textColor="@color/white"
android:visibility="invisible" />
<ImageButton
android:id="@ id/cc_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:background="@color/jw_transparent"
android:src="@drawable/ic_jw_captions_selector"
android:visibility="invisible"
app:tint="@color/white" />
</RelativeLayout>
<LinearLayout
android:id="@ id/seek"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginStart="@dimen/player_margin"
android:layout_marginEnd="@dimen/player_margin"
android:layout_marginBottom="@dimen/player_margin_bottom"
android:orientation="horizontal">
<SeekBar
android:id="@ id/seek_bar"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/player_margin_bottom"
android:layout_weight="1"
android:background="@color/jw_transparent"
android:paddingTop="7dp"
android:progressBackgroundTint="@color/white"
android:thumb="@drawable/custom_thumb"
android:visibility="invisible" />
</LinearLayout>
</RelativeLayout>
如何使搜索欄文本和抄送按鈕位于搜索欄上方?先感謝您。
更新將我的 mid_bottom_controls 更改為:
<RelativeLayout
android:id="@ id/mid_bottom_controls"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignStart="@id/seek"
android:layout_alignTop="@id/seek"
android:layout_alignEnd="@id/seek"
android:gravity="bottom">
我的播放器看起來像這樣: 我的播放器控制 2
當我嘗試在其底部添加底部邊距時, mid_bottom_controls 完全消失。我也不確定為什么搜索欄文本和抄送按鈕沒有相互對齊。
uj5u.com熱心網友回復:
首先我應該說,這種復雜的布局可以通過 ConstraintLayout 實作,比這種嵌套布局的方法更容易和更快。但無論如何這都不是問題,您唯一需要做的就是為您的 RelativeLayout 添加一些帶有 id 的屬性,mid_bottom_controls使其與搜索欄的頂部對齊。所以請像下面這樣更新它:
<RelativeLayout
android:id="@ id/mid_bottom_controls"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignStart="@id/seek"
android:layout_alignEnd="@id/seek"
android:layout_alignTop="@id/seek"
android:gravity="bottom">
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/491684.html
