菱形纽扣的排列

时间:2018-12-04 19:03:49

标签: android

查看有背景菱形图案。如图所示,有必要放置“按钮”。

我做了这种标记,但是如果这些按钮开始的空间大小加了。在我的情况下,如何摆脱静态尺寸?或者您可以提示是否有可能进行另一项安排?

<android.support.constraint.ConstraintLayout
       android:layout_width="match_parent"
       android:layout_height="0dp"
       android:layout_marginTop="10dp"
       app:layout_constraintBottom_toBottomOf="parent"
       app:layout_constraintEnd_toEndOf="parent"
       app:layout_constraintHorizontal_bias="0.5"
       app:layout_constraintHorizontal_weight="1"
       app:layout_constraintStart_toStartOf="parent"
       app:layout_constraintTop_toBottomOf="@+id/lastInfoTime"
       app:layout_constraintVertical_weight="1">

      <LinearLayout
          android:id="@+id/navigation"
          android:layout_width="0dp"
          android:layout_height="0dp"
          android:layout_marginEnd="8dp"
          android:background="@drawable/button_nav_background"
          android:gravity="center"
          android:orientation="vertical"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintDimensionRatio="1"
          app:layout_constraintEnd_toStartOf="@+id/auto"
          app:layout_constraintHorizontal_weight="1"
          app:layout_constraintStart_toStartOf="parent"
          app:layout_constraintTop_toTopOf="parent"
          app:layout_constraintVertical_weight="1">

         <android.support.v7.widget.AppCompatTextView
             android:id="@+id/navigationText"
             android:layout_width="match_parent"
             android:layout_height="wrap_content"
             android:drawablePadding="7dp"
             android:drawableTop="@drawable/ic_gas_station"
             android:fontFamily="@font/pfdindisplaypro_light"
             android:gravity="center"
             android:text="Навигация"
             android:textColor="@color/main_text_color"
             android:textSize="13sp" />
      </LinearLayout>

      <LinearLayout
          android:id="@+id/auto"
          android:layout_width="0dp"
          android:layout_height="0dp"
          android:layout_marginStart="8dp"
          android:background="@drawable/button_nav_background"
          android:gravity="center"
          android:orientation="vertical"
          app:layout_constraintBottom_toBottomOf="parent"
          app:layout_constraintDimensionRatio="1"
          app:layout_constraintEnd_toEndOf="parent"
          app:layout_constraintHorizontal_weight="1"
          app:layout_constraintStart_toEndOf="@+id/navigation"
          app:layout_constraintTop_toTopOf="parent"
          app:layout_constraintVertical_weight="1">

         <android.support.v7.widget.AppCompatTextView
             android:id="@+id/autoText"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:drawablePadding="7dp"
             android:drawableTop="@drawable/truck"
             android:fontFamily="@font/pfdindisplaypro_light"
             android:gravity="center"
             android:text="Авто"
             android:textColor="@color/main_text_color"
             android:textSize="13sp" />
      </LinearLayout>

      <LinearLayout
          android:id="@+id/message"
          android:layout_width="140dp"
          android:layout_height="140dp"
          android:layout_alignBottom="@id/navigation"
          android:layout_marginBottom="8dp"
          android:layout_toEndOf="@id/navigation"
          android:background="@drawable/button_nav_background"
          android:gravity="center"
          android:orientation="vertical">

         <android.support.v7.widget.AppCompatTextView
             android:id="@+id/messageText"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             android:drawablePadding="7dp"
             android:drawableTop="@drawable/ic_action_message"
             android:fontFamily="@font/pfdindisplaypro_light"
             android:gravity="center"
             android:text="Сообщения"
             android:textColor="@color/main_text_color"
             android:textSize="13sp" />
      </LinearLayout>


   </android.support.constraint.ConstraintLayout>

只有我不知道绑定顶部按钮的方式和方式。这样,在缩放时,它们都可以一起使用而不会影响整体外观。 @ + id /消息是顶部按钮。

enter image description here

1 个答案:

答案 0 :(得分:0)

implementation 'com.android.support.constraint:constraint-layout:1.1.3'    

<android.support.constraint.ConstraintLayout
        android:layout_width="0dp"
        android:layout_height="0dp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintDimensionRatio="1:1"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.5"
        app:layout_constraintHorizontal_weight="1"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_weight="1">

        <LinearLayout
            android:id="@+id/right"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_marginEnd="32dp"
            android:layout_marginStart="32dp"
            android:background="#0026ff"
            android:gravity="center"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintDimensionRatio="1"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.5"
            app:layout_constraintHorizontal_weight="1"
            app:layout_constraintStart_toEndOf="@+id/left"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_weight="1">

            <android.support.v7.widget.AppCompatTextView
                android:id="@+id/navigationText1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:drawablePadding="7dp"
                android:gravity="center"
                android:text="Right"
                android:textColor="#000"
                android:textSize="13sp" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/left"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_marginEnd="32dp"
            android:layout_marginStart="32dp"
            android:background="#ffb700"
            android:gravity="center"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintDimensionRatio="1"
            app:layout_constraintEnd_toStartOf="@+id/right"
            app:layout_constraintHorizontal_bias="0.5"
            app:layout_constraintHorizontal_weight="1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_weight="1">

            <android.support.v7.widget.AppCompatTextView
                android:id="@+id/autoText2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:drawablePadding="7dp"
                android:gravity="center"
                android:text="Left"
                android:textColor="#000"
                android:textSize="13sp" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/top"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_marginBottom="32dp"
            android:layout_marginEnd="8dp"
            android:layout_marginStart="8dp"
            android:layout_marginTop="32dp"
            android:background="#ff0000"
            android:gravity="center"
            app:layout_constraintBottom_toTopOf="@+id/bottom"
            app:layout_constraintDimensionRatio="1"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_bias="0.5"
            app:layout_constraintHorizontal_weight="1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintVertical_weight="1">

            <android.support.v7.widget.AppCompatTextView
                android:id="@+id/navigationText"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:drawablePadding="7dp"
                android:gravity="center"
                android:text="Top"
                android:textColor="#000"
                android:textSize="13sp" />
        </LinearLayout>

        <LinearLayout
            android:id="@+id/bottom"
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_marginBottom="32dp"
            android:layout_marginTop="32dp"
            android:background="#4cff00"
            android:gravity="center"
            android:orientation="vertical"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintDimensionRatio="1"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintHorizontal_weight="1"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toBottomOf="@+id/top"
            app:layout_constraintVertical_weight="1">

            <android.support.v7.widget.AppCompatTextView
                android:id="@+id/autoText"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:drawablePadding="7dp"
                android:gravity="center"
                android:text="Bottom"
                android:textColor="#000"
                android:textSize="13sp" />
        </LinearLayout>
    </android.support.constraint.ConstraintLayout>

enter image description here