我如何使用ConstraintLayout將圖標放在中間的一些旁邊

Question

我嘗試將Icon放在中間的一些旁邊但我失敗了，有人可以留下名稱屬性來解決這個問題嗎？

XML

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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="match_parent"
    android:background="@color/SSA1Background"
    tools:context=".SplashScreen">

    <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginBottom="8dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <TextView
            android:id="@+id/txtSignInVia"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_margin="5dp"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"
            android:layout_marginEnd="8dp"
            android:layout_marginBottom="8dp"
            android:fontFamily="@font/main_font_file"
            android:text="@string/SSA1SignInVia"
            android:textColor="@color/SSA1SignInText"
            android:textSize="25sp"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent" />

        <Button
            android:id="@+id/btnFacebook"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_margin="5dp"
            android:layout_marginStart="8dp"
            android:layout_marginTop="8dp"
            android:background="@drawable/s_s_a_1_facebook_btn"
            android:fontFamily="@font/icons_brands"
            android:text="@string/SSA1FacebookIcon"
            android:textColor="@color/SSA1FacebookText"
            android:textSize="20sp"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/txtSignInVia" />

        <Button
            android:id="@+id/btnGoogle"
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:layout_margin="5dp"
            android:layout_marginTop="8dp"
            android:layout_marginEnd="8dp"
            android:background="@drawable/s_s_a_1_google_btn"
            android:fontFamily="@font/icons_brands"
            android:text="@string/SSA1GoogleIcon"
            android:textColor="@color/SSA1GoogleText"
            android:textSize="20sp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/txtSignInVia" />

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

電話結果

Facebook和谷歌圖標我希望他們在中心。

Answer 1

將視圖的末尾（左/右）約束到彼此，並將水平鏈樣式設置為打包，如下所示：

• 另外..不需要將約束布局嵌套在另一個約束布局中。 刪除未使用的父Constraint Layout

   <androidx.constraintlayout.widget.ConstraintLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginStart="8dp" android:layout_marginTop="8dp" android:layout_marginEnd="8dp" android:layout_marginBottom="8dp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent"> <TextView android:id="@+id/txtSignInVia" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="5dp" android:layout_marginStart="8dp" android:layout_marginTop="8dp" android:layout_marginEnd="8dp" android:layout_marginBottom="8dp" android:fontFamily="@font/main_font_file" android:text="@string/SSA1SignInVia" android:textColor="@color/SSA1SignInText" android:textSize="25sp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent" /> <Button android:id="@+id/btnFacebook" android:layout_width="50dp" android:layout_height="50dp" android:layout_margin="5dp" android:layout_marginStart="8dp" android:layout_marginTop="8dp" android:background="@drawable/s_s_a_1_facebook_btn" android:fontFamily="@font/icons_brands" android:text="@string/SSA1FacebookIcon" android:textColor="@color/SSA1FacebookText" android:textSize="20sp" app:layout_constraintEnd_toStartOf="@id/btnGoogle" app:layout_constraintHorizontal_chainStyle="packed" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/txtSignInVia" /> <Button android:id="@+id/btnGoogle" android:layout_width="50dp" android:layout_height="50dp" android:layout_margin="5dp" android:layout_marginTop="8dp" android:layout_marginEnd="8dp" android:background="@drawable/s_s_a_1_google_btn" android:fontFamily="@font/icons_brands" android:text="@string/SSA1GoogleIcon" app:layout_constraintStart_toEndOf="@id/btnFacebook" app:layout_constraintHorizontal_chainStyle="packed" android:textColor="@color/SSA1GoogleText" android:textSize="20sp" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintTop_toBottomOf="@+id/txtSignInVia" /> </androidx.constraintlayout.widget.ConstraintLayout> 

Answer 2

對於button ID btnFacebook ，添加

app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.4"`

對於button ID btnGoogle ，請添加

app:layout_constraintStart_toStartOf="parent"
app:layout_constraintHorizontal_bias="0.6"` 

因為如果沒有設置所有約束，則視圖將不在我們想要的位置。 我希望這有幫助。