我正在嘗試對齊四個影像視圖和文本視圖，但影像視圖之間有三條線。我需要將TextView1與ImageView1對齊，TextView2與ImageView2對齊，TextView3與ImageView3對齊，TextView4與ImageView4對齊，但它沒有得到對齊。這是我的代碼。請幫助我如何實作這一點。我上傳了圖片供參考。
<LinearLayout。
android:id="@ id/constLayout"/span>
android:layout_width="wrap_content"
android:layout_height="wrap_content"。
android:layout_gravity="center"。
android:layout_marginStart="20dp"。
android:layout_marginTop="30dp"。
android:layout_marginEnd="20dp"。
android:gravity="center">
<ImageView。
android:id="@ id/image1"。
android:layout_width="40dp"。
android:layout_height="40dp"/span>
android:layout_gravity="center_vertical"。
android:layout_weight="1"。
android:src="@drawable/paid"
app:tint="@color/black" />
<View
android:id="@ id/line1"
android:layout_width="80dp"。
android:layout_height="2DP"
android:layout_gravity="center_vertical"。
android:layout_weight="1"。
android:background="@color/black" />
<ImageView
android:id="@ id/image2"
android:layout_width="40dp"。
android:layout_height="40dp"/span>
android:layout_gravity="center_vertical"。
android:layout_weight="1"。
android:src="@drawable/paid"
app:tint="@color/black" />
<View
android:id="@ id/line2"
android:layout_width="80dp"。
android:layout_height="2DP"
android:layout_gravity="center_vertical"。
android:layout_weight="1"。
android:background="@color/black" />
<ImageView
android:id="@ id/image3"
android:layout_width="40dp"。
android:layout_height="40dp"/span>
android:layout_gravity="center_vertical"。
android:layout_weight="1"。
android:src="@drawable/paid"
app:tint="@color/black" />
<View
android:id="@ id/line3"
android:layout_width="80dp"。
android:layout_height="2DP"
android:layout_gravity="center_vertical"。
android:layout_weight="1"。
android:background="@color/black" />
<ImageView
android:id="@ id/image4"/span>
android:layout_width="40dp"。
android:layout_height="40dp"/span>
android:layout_gravity="center_vertical"。
android:layout_weight="1"。
android:src="@drawable/paid"
app:tint="@color/black" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"/span>
android:layout_height="wrap_content"。
android:orientation="horizontal"/span>>
<TextView。
android:id="@ id/textView1"/span>
android:layout_width="wrap_content"
android:layout_height="wrap_content"。
android:gravity="center"。
android:layout_weight="1"。
android:text="Text One"/>
<TextView
android:id="@ id/textView2"/span>
android:layout_weight="1"。
android:layout_width="wrap_content"
android:layout_height="wrap_content"。
android:gravity="center"。
android:text="Text Two" <>
<TextView
android:id="@ id/textView3"
android:layout_weight="1"。
android:layout_width="wrap_content"
android:layout_height="wrap_content"。
android:gravity="center"。
android:text="Text Three" <>
<TextView
android:id="@ id/textView4"/span>
android:layout_weight="1"。
android:layout_width="wrap_content"
android:layout_height="wrap_content"。
android:gravity="center"。
android:text="Text Four" <>
</LinearLayout>
這是我的布局：
我需要這樣的布局：
uj5u.com熱心網友回復：
這應該能讓你了解如何使用RelativeLayout進行操作：
<RelativeLayout
android:layout_width="match_parent"。
android:layout_height="match_parent"/span>>
<View
android:id="@ id/left1"
android:layout_width="40dp"。
android:layout_height="10dp"/span>
android:layout_alignParentLeft="true"。
/>
<ImageView
android:id="@ id/img1"。
android:layout_width="50dp"。
android:layout_height="50dp"/span>
android:layout_toRightOf="@id/left1"/span>
android:src="@android:drawable/ic_dialog_info"
/>
<View
android:id="@ id/right1"
android:layout_width="40dp"。
android:layout_height="10dp"/span>
android:layout_toRightOf="@id/img1"。
/>
<FrameLayout
android:id="@ id/line1"
android:layout_width="200dp"。
android:layout_height="50dp"/span>
android:layout_toRightOf="@id/img1"
>
<View
android:layout_width="match_parent"。
android:layout_height="10dp"。
android:background="#00ff00"/span>
android:layout_gravity="center_vertical"。
/>
</FrameLayout>
<View
android:id="@ id/left2"
android:layout_width="40dp"。
android:layout_height="10dp"/span>
android:layout_toLeftOf="@id/img2"
/>
<ImageView
android:id="@ id/img2"。
android:layout_width="50dp"。
android:layout_height="50dp"/span>
android:src="@android:drawable/ic_dialog_info"
android:layout_toRightOf="@id/line1"
/>
<View
android:id="@ id/right2"
android:layout_width="40dp"。
android:layout_height="10dp"/span>
android:layout_toRightOf="@id/img2"。
/>
<TextView。
android:id="@ id/txt1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"。
android:text="This is a very long text 1"。
android:layout_below="@id/img1"。
android:layout_alignLeft="@id/left1"。
android:layout_alignRight="@id/right1"。
android:gravity="center"。
/>
<TextView
android:id="@ id/txt2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"。
android:text="This is a very long text 2"。
android:layout_below="@id/img2"。
android:layout_alignLeft="@id/left2"。
android:layout_alignRight="@id/right2"。
android:gravity="center"。
/>
</RelativeLayout>
uj5u.com熱心網友回復：
創建復雜布局的最好方法是使用ConstraintLayout
這里的示例代碼
<?xml version="1.0" encoding="utf-8"? >
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"/span>
android:layout_width="match_parent"。
android:layout_height="match_parent"。
xmlns:app="http://schemas.android.com/apk/res-auto"。
android:paddingTop="8dp">/span>
<!--影像視圖-->
<ImageView
android:id="@ id/img1"/span>
android:background="@color/red" /span>
android:layout_width="40dp"。
android:layout_height="40dp"/span>
app:layout_constraintTop_toTopOf="father"
app:layout_constraintLeft_toLeftOf="father"
app:layout_constraintRight_toLeftOf="@id/img2"/>
<ImageView。
android:id="@ id/img2"。
android:background="@color/red" /span>
android:layout_width="40dp"。
android:layout_height="40dp"/span>
app:layout_constraintTop_toTopOf="father"
app:layout_constraintLeft_toRightOf="@id/img1"。
app:layout_constraintRight_toLeftOf="@id/img3"/>
<ImageView。
android:id="@ id/img3"。
android:background="@color/red" /span>
android:layout_width="40dp"。
android:layout_height="40dp"/span>
app:layout_constraintTop_toTopOf="father"
app:layout_constraintLeft_toRightOf="@id/img2"。
app:layout_constraintRight_toLeftOf="@id/img4"/>
<ImageView。
android:id="@ id/img4"。
android:background="@color/red" /span>
android:layout_width="40dp"。
android:layout_height="40dp"/span>
app:layout_constraintTop_toTopOf="father"
app:layout_constraintLeft_toRightOf="@id/img3"。
app:layout_constraintRight_toRightOf="parent"/>/span>
<!--行間-->
<View
android:layout_width="0dp"/span>
android:layout_height="1dp"。
android:background="@color/black" /span>
app:layout_constraintTop_toTopOf="@id/img1"。
app:layout_constraintBottom_toBottomOf="@id/img1"。
app:layout_constraintLeft_toRightOf="@id/img1"。
app:layout_constraintRight_toLeftOf="@id/img2"/>
<View
android:layout_width="0dp"/span>
android:layout_height="1dp"。
android:background="@color/black" /span>
app:layout_constraintTop_toTopOf="@id/img1"。
app:layout_constraintBottom_toBottomOf="@id/img1"。
app:layout_constraintLeft_toRightOf="@id/img2"。
app:layout_constraintRight_toLeftOf="@id/img3"/>
<View
android:layout_width="0dp"/span>
android:layout_height="1dp"。
android:background="@color/black" /span>
app:layout_constraintTop_toTopOf="@id/img1"。
app:layout_constraintBottom_toBottomOf="@id/img1"。
app:layout_constraintLeft_toRightOf="@id/img3"。
app:layout_constraintRight_toLeftOf="@id/img4"/>
<!-- txt step-->
<TextView
android:id="@ id/txt_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"。
android:text="Step 1 text"。
app:layout_constraintTop_toBottomOf="@id/img1"。
app:layout_constraintLeft_toLeftOf="@id/img1"。
app:layout_constraintRight_toRightOf="@id/img1"/>
<TextView。
android:id="@ id/txt_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"。
android:text="Step 2 text"。
app:layout_constraintTop_toBottomOf="@id/img2"。
app:layout_constraintLeft_toLeftOf="@id/img2"。
app:layout_constraintRight_toRightOf="@id/img2"/>
<TextView。
android:id="@ id/txt_3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"。
android:text="Step 3 text"。
app:layout_constraintTop_toBottomOf="@id/img3"
app:layout_constraintLeft_toLeftOf="@id/img3"。
app:layout_constraintRight_toRightOf="@id/img3"/>
<TextView。
android:id="@ id/txt_4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"。
android:text="Step 4 text"。
app:layout_constraintTop_toBottomOf="@id/img4"。
app:layout_constraintLeft_toLeftOf="@id/img4"。
app:layout_constraintRight_toRightOf="@id/img4"/>
</androidx.constraintlayout.widget.ConstraintLayout>
和結果
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/324042.html
標籤：