webentwicklung-frage-antwort-db.com.de

ConstraintLayout - Überlappen vermeiden

Es gibt ein ConstraintLayout Layout:

<Android.support.constraint.ConstraintLayout
    xmlns:Android="http://schemas.Android.com/apk/res/Android"
    xmlns:app="http://schemas.Android.com/apk/res-auto"
    Android:layout_width="match_parent"
    Android:layout_height="match_parent">

    <Button
        Android:id="@+id/button10"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:ellipsize="end"
        Android:singleLine="true"
        Android:text="small text"
        app:layout_constraintLeft_toLeftOf="parent"/>

    <Button
        Android:ellipsize="end"
        Android:singleLine="true"
        Android:id="@+id/button11"
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:text="small text"
        app:layout_constraintRight_toRightOf="parent"/>

</Android.support.constraint.ConstraintLayout>

Es wird wie folgt angezeigt:  введите сюда описание изображения Nun ist OK, aber wenn ich Android:text="small text" in Android:text="big teeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeext" ändere, überlappen sich die Ansichten.

Ich muss sicherstellen, dass bei einem kleinen Text ein "Wrap-Inhalt" vorhanden ist, wie ich es auf dem Screenshot oben tat, aber bei einem größeren Text müssen die Textansichten horizontal maximal etwa 40 Prozent des übergeordneten Elements einnehmen . Nun, auch dass der Text nicht übertragen wurde - ich Android: ellipsize =" end " und Android: singleLine =" true.

So sollte es sein (in Photoshop zur Demonstration bearbeitet):  введите сюда описание изображения Wie geht das mit ConstraintLayout oder wenn nicht - mit anderen Layouts?

7
ilw

sie können dies auch mit Guideline und layout_constraintWidth_default property wie im folgenden Beispiel tun

<?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"
    tools:showIn="@layout/activity_home">


    <Button
        Android:id="@+id/button10"
        Android:layout_width="0dp"
        app:layout_constraintWidth_default="wrap"
        Android:layout_height="wrap_content"
        Android:ellipsize="end"
        Android:singleLine="true"
        Android:text="sdtessdsdsdsdsdsdsdsddsdsdxt"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        Android:layout_marginLeft="0dp"
        app:layout_constraintHorizontal_bias="0"
        Android:layout_marginTop="8dp"
        app:layout_constraintRight_toLeftOf="@+id/guideline"
        Android:layout_marginRight="8dp" />

    <Button
        Android:ellipsize="end"
        Android:singleLine="true"
        Android:id="@+id/button11"
        Android:layout_width="0dp"
        app:layout_constraintWidth_default="wrap"
        Android:layout_height="wrap_content"
        Android:text="ddddddsdssdsdsdsdsdsdddt"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        Android:layout_marginTop="8dp"
        Android:layout_marginRight="-1dp"
        Android:layout_marginLeft="8dp"
        app:layout_constraintHorizontal_bias="1"
        app:layout_constraintLeft_toLeftOf="@+id/guideline" />

    <Android.support.constraint.Guideline
        Android:layout_width="wrap_content"
        Android:layout_height="wrap_content"
        Android:id="@+id/guideline"
        Android:orientation="vertical"
        app:layout_constraintGuide_percent="0.5" />

</Android.support.constraint.ConstraintLayout>
16
Pavan

Das kannst du so machen:

<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">

<Button
    Android:id="@+id/button10"
    Android:layout_width="0dp"
    Android:layout_height="wrap_content"
    Android:layout_marginTop="30dp"
    Android:ellipsize="end"
    Android:maxLines="1"
    Android:gravity="center_vertical"
    Android:text="small text"
    Android:layout_marginRight="20dp"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toLeftOf="@+id/button11"
    app:layout_constraintTop_toTopOf="parent" />

<Button
    Android:id="@+id/button11"
    Android:layout_width="0dp"
    Android:layout_height="wrap_content"
    Android:ellipsize="end"
    Android:maxLines="1"
    Android:layout_marginLeft="20dp"
    Android:gravity="center_vertical"
    Android:text="small textsfdgdfjkghkdfhgjkdfhgkhgkhkjjkgfkgjkfgjkgjkjgfdkj"
    app:layout_constraintLeft_toRightOf="@+id/button10"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="@+id/button10" />

3
Shweta Chauhan

Das folgende Attribut funktioniert:

app:layout_constrainedWidth="true"

https://developer.Android.com/reference/Android/support/constraint/ConstraintLayout

WRAP_CONTENT: Erzwingen von Einschränkungen (hinzugefügt in 1.1) Wenn eine Dimension auf WRAP_CONTENT gesetzt ist, werden sie in Versionen vor 1.1 als literale Dimension behandelt. Das bedeutet, dass Einschränkungen die resultierende Dimension nicht begrenzen. Während dies im Allgemeinen ausreichend ist (und schneller ist), möchten Sie möglicherweise in einigen Situationen WRAP_CONTENT verwenden, aber erzwingen Sie weiterhin Einschränkungen, um die resultierende Dimension zu begrenzen. In diesem Fall können Sie eines der entsprechenden Attribute hinzufügen:

app: layout_constrainedWidth = "true | false" app: layout_constrainedHeight = "true | false"

0

Wenn die Einschränkung von links/rechts ist

    set vertical guideline
    set component layout_width = 0dp

Wenn die Einschränkung von oben/unten ist

    set horizontal guideline
    set component layout_height = 0dp
0
kapsid