ConstraintLayout gleiche Höhe und Breite von Textviews mit ziehbar Bild und verschiedenen Texten

Ich möchtenConstraintLayout gleiche Höhe und Breite von Textviews mit ziehbar Bild und verschiedenen Texten

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:id="@+id/constraintLayout" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" 
    tools:context="com.xyz.constraintlayout.MainActivity$PlaceholderFragment"> 

    <TextView 
     android:id="@+id/section_label" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_marginBottom="@dimen/activity_vertical_margin" 
     android:layout_marginEnd="@dimen/activity_horizontal_margin" 
     android:layout_marginStart="@dimen/activity_horizontal_margin" 
     android:layout_marginTop="@dimen/activity_vertical_margin" 
     android:gravity="center" 
     android:text="Section Number" /> 

    <LinearLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content"> 

     <TextView 
      android:id="@+id/first_text" 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_gravity="center" 
      android:layout_margin="4dp" 
      android:layout_weight="1" 
      android:background="@drawable/border" 
      android:drawablePadding="10dp" 
      android:drawableTop="@drawable/ic_not_interested_black_48dp" 
      android:fontFamily="sans-serif-smallcaps" 
      android:gravity="center" 
      android:padding="6dp" 
      android:text="Book of first_text Language" 
      android:textColor="@color/colorPrimaryDark" 
      android:textStyle="bold" /> 

     <TextView 
      android:id="@+id/second_text" 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_gravity="center" 
      android:layout_margin="4dp" 
      android:layout_weight="1" 
      android:background="@drawable/border" 
      android:drawablePadding="10dp" 
      android:drawableTop="@drawable/ic_not_interested_black_48dp" 
      android:fontFamily="sans-serif-smallcaps" 
      android:gravity="center" 
      android:padding="6dp" 
      android:text="Book of second_text" 
      android:textColor="@color/colorPrimaryDark" 
      android:textStyle="bold" /> 

     <TextView 
      android:id="@+id/third_text" 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_gravity="center" 
      android:layout_margin="4dp" 
      android:layout_weight="1" 
      android:background="@drawable/border" 
      android:drawablePadding="10dp" 
      android:drawableTop="@drawable/ic_not_interested_black_48dp" 
      android:fontFamily="sans-serif-smallcaps" 
      android:gravity="center" 
      android:padding="6dp" 
      android:text="Book of third_text Topics and Miscellaneous" 
      android:textColor="@color/colorPrimaryDark" 
      android:textStyle="bold" /> 
    </LinearLayout> 
</LinearLayout>

und der Ausgang ist das unter Linearlayout Eltern und Kind Blick auf ConstraintLayout replizieren:

LinearLayout

Ich versuchte, ConstraintLayout mit Spread-Ketten zu replizieren, wie unten

<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:id="@+id/constraintLayout" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    tools:context="com.sed.constraintlayout.MainActivity$PlaceholderFragment"> 

    <TextView 
     android:id="@+id/section_label" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:layout_marginBottom="@dimen/activity_vertical_margin" 
     android:layout_marginEnd="@dimen/activity_horizontal_margin" 
     android:layout_marginStart="@dimen/activity_horizontal_margin" 
     android:layout_marginTop="@dimen/activity_vertical_margin" 
     android:gravity="center" 
     android:text="Section Number" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintTop_toTopOf="@+id/constraintLayout" 
     tools:layout_constraintLeft_creator="1" 
     tools:layout_constraintTop_creator="1" /> 

    <TextView 
     android:id="@+id/first_text" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center" 
     android:layout_margin="4dp" 
     android:background="@drawable/border" 
     android:drawablePadding="10dp" 
     android:drawableTop="@drawable/ic_not_interested_black_48dp" 
     android:fontFamily="sans-serif-smallcaps" 
     android:gravity="center" 
     android:padding="6dp" 
     android:text="Book of first_text Language" 
     android:textColor="@color/colorPrimaryDark" 
     android:textStyle="bold" 
     app:layout_constraintEnd_toStartOf="@+id/second_text" 
     app:layout_constraintHorizontal_bias="0.5" 
     app:layout_constraintHorizontal_chainStyle="spread" 
     app:layout_constraintHorizontal_weight="1" 
     app:layout_constraintStart_toStartOf="parent" 
     app:layout_constraintTop_toBottomOf="@id/section_label" /> 

    <TextView 
     android:id="@+id/second_text" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center" 
     android:layout_margin="4dp" 
     android:background="@drawable/border" 
     android:drawablePadding="10dp" 
     android:drawableTop="@drawable/ic_not_interested_black_48dp" 
     android:fontFamily="sans-serif-smallcaps" 
     android:gravity="center" 
     android:padding="6dp" 
     android:text="Book of second_text" 
     android:textColor="@color/colorPrimaryDark" 
     android:textStyle="bold" 
     app:layout_constraintEnd_toStartOf="@+id/third_text" 
     app:layout_constraintHorizontal_bias="0.5" 
     app:layout_constraintHorizontal_weight="1" 
     app:layout_constraintStart_toEndOf="@+id/first_text" 
     app:layout_constraintTop_toBottomOf="@id/section_label" /> 

    <TextView 
     android:id="@+id/third_text" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_gravity="center" 
     android:layout_margin="4dp" 
     android:background="@drawable/border" 
     android:drawablePadding="10dp" 
     android:drawableTop="@drawable/ic_not_interested_black_48dp" 
     android:fontFamily="sans-serif-smallcaps" 
     android:gravity="center" 
     android:padding="6dp" 
     android:text="Book of third_text Topics and Miscellaneous" 
     android:textColor="@color/colorPrimaryDark" 
     android:textStyle="bold" 
     app:layout_constraintEnd_toEndOf="parent" 
     app:layout_constraintHorizontal_bias="0.5" 
     app:layout_constraintHorizontal_weight="1" 
     app:layout_constraintStart_toEndOf="@+id/second_text" 
     app:layout_constraintTop_toBottomOf="@id/section_label" /> 

</android.support.constraint.ConstraintLayout>

Der Ausgang ist:

ConstraintLayout

Wie es offensichtlich ist, dass die Höhe der Ansichten in dem Constraint-Layout nicht gerade ist. Wie macht man es gleich? Danke für jede Hilfe.

Quelle

2017-11-24 Abdullah

> Versuchen Sie folgendes:

<?xml version="1.0" encoding="utf-8"?> 
<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"> 

    <TextView 
     android:id="@+id/section_label" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:gravity="center" 
     android:text="Section Number" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toTopOf="parent" /> 

    <TextView 
     android:id="@+id/first_text" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_margin="4dp" 
     android:background="@mipmap/ic_launcher" 
     android:drawablePadding="10dp" 
     android:drawableTop="20dp" 
     android:fontFamily="sans-serif-smallcaps" 
     android:gravity="center" 
     android:padding="6dp" 
     android:text="Book of first_text Language" 
     android:textColor="@color/colorPrimaryDark" 
     android:textStyle="bold" 
     app:layout_constraintLeft_toLeftOf="parent" 
     app:layout_constraintRight_toLeftOf="@+id/second_text" 
     app:layout_constraintTop_toBottomOf="@id/section_label" /> 

    <TextView 
     android:id="@+id/second_text" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_marginLeft="4dp" 
     android:layout_marginRight="4dp" 
     android:background="@mipmap/ic_launcher" 
     android:drawablePadding="10dp" 
     android:drawableTop="20dp" 
     android:fontFamily="sans-serif-smallcaps" 
     android:gravity="center" 
     android:padding="6dp" 
     android:text="Book of second_text" 
     android:textColor="@color/colorPrimaryDark" 
     android:textStyle="bold" 
     app:layout_constraintLeft_toRightOf="@+id/first_text" 
     app:layout_constraintRight_toLeftOf="@id/third_text" 
     app:layout_constraintTop_toTopOf="@id/first_text" /> 

    <TextView 
     android:id="@+id/third_text" 
     android:layout_width="0dp" 
     android:layout_height="wrap_content" 
     android:layout_marginLeft="4dp" 
     android:layout_marginRight="4dp" 
     android:background="@mipmap/ic_launcher" 
     android:drawablePadding="10dp" 
     android:drawableTop="20dp" 
     android:fontFamily="sans-serif-smallcaps" 
     android:gravity="center" 
     android:padding="6dp" 
     android:text="Book of third_text" 
     android:textColor="@color/colorPrimaryDark" 
     android:textStyle="bold" 
     app:layout_constraintLeft_toRightOf="@id/second_text" 
     app:layout_constraintRight_toRightOf="parent" 
     app:layout_constraintTop_toTopOf="@id/second_text" /> 

</android.support.constraint.ConstraintLayout>

Quelle

2017-11-24 07:01:06

Es Sie die Ketten entfernt haben scheint zuweisen möchten, Ist es sogar möglich, Gruppen von Ansichten ohne Kette gleich groß und breit zu machen? Ich habe Ihren Code ausprobiert, aber nicht die gewünschten Ergebnisse erzielt. – Abdullah

warten wird Sie aktualisieren –

Hinweis:

Die layout_height Sie für die drei Textview ist gegeben sind "wrap_content".
Wenn Sie "match_parent" anwenden, können Sie eine gleichmäßige Höhe erreichen, aber diese
drei TextView belegt den gesamten Platz.
Hoffentlich wissen Sie, dass die Höhe der TextView erweitert wird abhängig von die Inhaltsgröße in es.
Sie können das Design erreichen, was Sie mit dem gleichen hardcore
Höhe Wert (wie 120dp) für diese drei Textview

Quelle

2017-11-24 07:27:37

Danke. Wie Sie vorgeschlagen haben, wenn ich die Höhe fest codierte, zu 150dp für alle Ansichten wurde ihre Höhe gerade. Ich möchte jedoch wissen, ob es eine Möglichkeit gibt, dies ohne hardcoded Werte zu erreichen, wie ich im LineareLayout Beispiel in meiner Frage, wo ich Match_Parent für alle Ansichten – Abdullah

Ya in LinearLayout Probe Höhe als "Match_Parent" von TextView nehmen Sie die Höhe seiner Eltern, die bereits ein "wrap_content" –

Check Richtlinien ----- https://constraintlayout.github.io/basics/guidelines.html –

ConstraintLayout gleiche Höhe und Breite von Textviews mit ziehbar Bild und verschiedenen Texten

Antwort

Verwandte Themen