2017-06-30 23 views
1

我的佈局中有四個按鈕的網格。我已經將它們水平鏈接起來,這樣左右兩側按鈕之間的空間就會被均勻加權。使用ConstraintLayout,我可以獲得垂直約束來匹配鏈的動態寬度嗎?

screenshot of my app's buttons

我可以讓按鍵的兩行具有相同的空間量垂直它們之間,因此不會顯得不均勻?我寧願不只是他們居中垂直像我一樣達到的水平間距,該地感謝@AdamK這個帖子:Evenly spacing views using ConstraintLayout

activity_main.xml中:

<android.support.constraint.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" 
    tools:context="com.jason.notifier.MainActivity" 
    tools:layout_editor_absoluteY="81dp" 
    tools:layout_editor_absoluteX="0dp"> 

    <ImageView 
     android:id="@+id/imageView3" 
     android:layout_width="388dp" 
     android:layout_height="164dp" 
     app:srcCompat="@drawable/banner" 
     android:layout_marginStart="8dp" 
     app:layout_constraintTop_toTopOf="parent" 
     android:layout_marginTop="4dp" 
     android:layout_marginLeft="8dp" 
     app:layout_constraintLeft_toLeftOf="parent" /> 

    <Button 
     android:id="@+id/testbutton" 
     android:layout_width="171dp" 
     android:layout_height="136dp" 
     android:onClick="sampleNotification" 
     android:text="Test" 
     app:layout_constraintRight_toLeftOf="@+id/settingsbutton" 
     app:layout_constraintLeft_toLeftOf="parent" 
     android:layout_marginTop="8dp" 
     app:layout_constraintTop_toBottomOf="@+id/historybutton" /> 

    <Button 
     android:id="@+id/settingsbutton" 
     android:layout_width="171dp" 
     android:layout_height="136dp" 
     android:text="Settings" 
     android:onClick="settingsbutton" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintLeft_toRightOf="@+id/testbutton" 
     android:layout_marginTop="8dp" 
     app:layout_constraintTop_toBottomOf="@+id/pingbutton" /> 

    <Button 
     android:id="@+id/pingbutton" 
     android:layout_width="171dp" 
     android:layout_height="136dp" 
     android:onClick="pingbutton" 
     android:text="ping" 
     android:layout_marginTop="-31dp" 
     app:layout_constraintTop_toBottomOf="@+id/textView2" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintLeft_toRightOf="@+id/historybutton" /> 

    <Button 
     android:id="@+id/historybutton" 
     android:layout_width="171dp" 
     android:layout_height="136dp" 
     android:onClick="historybutton" 
     android:text="History" 
     android:layout_marginTop="-31dp" 
     app:layout_constraintTop_toBottomOf="@+id/textView2" 
     app:layout_constraintRight_toLeftOf="@+id/pingbutton" 
     app:layout_constraintLeft_toLeftOf="parent" /> 

    <TextView 
     android:id="@+id/textView2" 
     android:layout_width="358dp" 
     android:layout_height="42dp" 
     android:text="TextView" 
     android:gravity="center" 
     tools:layout_editor_absoluteX="2dp" 
     android:layout_marginTop="8dp" 
     app:layout_constraintTop_toBottomOf="@+id/imageView3" /> 

</android.support.constraint.ConstraintLayout> 
+0

分享約束佈局XML –

回答

0

廣場一個位於佈局中心的View小部件,尺寸比例爲1:1,左側約束historybutton,右側約束pingbutton。這會給你一個正方形,每一邊都是水平間距的長度。

<View 
    android:id="@+id/spacerView" 
    android:layout_width="0dp" 
    android:layout_height="0dp" 
    android:layout_margin="0dp" 
    app:layout_constraintDimensionRatio="H,1:1" 
    app:layout_constraintEnd_toStartOf="@+id/pingbutton" 
    app:layout_constraintStart_toEndOf="@+id/historybutton" 
    app:layout_constraintTop_toBottomOf="@+id/historybutton" /> 

現在約束底部的兩個按鈕,你方的底部如下:

<Button 
    android:id="@+id/testbutton" 
    android:layout_width="171dp" 
    android:layout_height="136dp" 
    android:text="Test" 
    app:layout_constraintTop_toBottomOf="@+id/spacerView" 
    app:layout_constraintEnd_toEndOf="@+id/historybutton" /> 

<Button 
    android:id="@+id/settingsbutton" 
    android:layout_width="171dp" 
    android:layout_height="136dp" 
    android:text="Settings" 
    app:layout_constraintTop_toBottomOf="@+id/spacerView" 
    app:layout_constraintStart_toStartOf="@+id/pingbutton" /> 

而且應該這樣做。我使方形視圖可見,所以我們可以看到它,但你應該使它看不見。這是一個效果的圖像。

enter image description here

相關問題