Prozentsatz der maximalen Breite von ConstraintLayout

Ich habe mit ConstraintLayout experimentiert. Gibt es eine Möglichkeit, die maximale Breite einer Ansicht auf einen Prozentsatz der übergeordneten Ansicht festzulegen (und ein Höhen-Match-Einschränkungs- und Dimensionsverhältnis von 1:1)?

Hier ist der Code ohne Verwendung der maximalen Breite:

<?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"
  android:layout_width="match_parent"
  android:layout_height="wrap_content">

   <FrameLayout
      android:id="@+id/frameLayout3"
      android:layout_width="0dp"
      android:layout_height="259dp"
      android:layout_marginEnd="8dp"
      android:layout_marginStart="8dp"
      android:background="@android:color/black"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintHorizontal_bias="0.0"
      app:layout_constraintStart_toEndOf="@+id/imageView"
      app:layout_constraintTop_toTopOf="parent"/>

   <ImageView
      android:id="@+id/imageView"
      android:layout_width="0dp"
      android:layout_height="0dp"
      android:src="https://stackoverflow.com/questions/49255147/@android:drawable/ic_menu_add"
      app:layout_constraintBottom_toBottomOf="@+id/frameLayout3"
      app:layout_constraintDimensionRatio="1:1"
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintTop_toTopOf="parent"
      app:layout_constraintWidth_percent="0.3"/>

</android.support.constraint.ConstraintLayout>

Das ist das Ergebnis:

Tablette:

Telefon:

Ich habe den maximalen Breitenprozentsatz mithilfe von zwei Attributen erreicht:

app:layout_constraintWidth_max="wrap"
app:layout_constraintWidth_percent="0.4" 

Beispiel:

<TextView
    android:id="@+id/textView2"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_marginStart="8dp"
    android:layout_marginTop="8dp"
    android:text="Helo world"
    android:textAlignment="viewStart"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintWidth_max="wrap"
    app:layout_constraintWidth_percent="0.4" />

Die Textbreite wird auf 40 % der übergeordneten Textbreite erhöht und dann umbrochen, wenn der Inhalt diese Breite überschreitet.

Wenn ich Ihr Problem richtig verstehe, haben Sie es fast geschafft. Ich glaube, du gibst frameLayout Statische Höhe, deshalb liefert es auf dem Tablet nicht das richtige Ergebnis, weil Sie die Höhe entsprechend der Telefonvorschau eingestellt haben. Was Sie tun müssen, ist die Höhe festzulegen frameLayout relativ zu imageView.. also wann imageView wächst in der Größe frameLayout wächst auch mit.

Ich denke, Sie sollten so etwas 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"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:src="https://stackoverflow.com/questions/49255147/@android:drawable/ic_menu_add"
        app:layout_constraintDimensionRatio="1:1"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintWidth_percent="0.3" />    

    <FrameLayout
        android:id="@+id/frameLayoutTwo"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="@android:color/black"
        app:layout_constraintBottom_toBottomOf="@+id/imageView"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/imageView"
        app:layout_constraintTop_toTopOf="parent" /> 

</android.support.constraint.ConstraintLayout>

Ich habe es überprüft und es ergibt das gleiche Ergebnis auf dem Telefon und dem Tablet. Korrigieren Sie mich, wenn ich Ihr Problem falsch verstanden habe.

Nein, da ist kein. Ich denke, wir sollten eine Funktionsanfrage stellen. Ich bin mir ziemlich sicher, dass PercentRelativeLayout diese Funktion ebenfalls nicht hat. (Diese Antwort gilt für ConstraintLayout 1.1)

Sie können eine festlegen LinearLayout oder andere ViewGroup als exakter Prozentsatz width und platzieren Sie Ihre wrap_content Blick in dieses Layout.

        <androidx.constraintlayout.widget.ConstraintLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <ImageView
                android:id="@+id/image_place_holder"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:scaleType="centerCrop"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

            <!-- This LinearLayout will have exact 80% of parent width-->
            <LinearLayout
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintWidth_percent="0.8">

                
                <!-- This MaterialCardView will get a wrap_content width, 
                with a max width of his parent LinearLayout, which is 80% -->
                <com.google.android.material.card.MaterialCardView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="@dimen/half_activity_horizontal_margin"
                    android:layout_marginTop="@dimen/half_activity_vertical_margin"
                    android:layout_marginEnd="@dimen/half_activity_horizontal_margin"
                    android:layout_marginBottom="@dimen/half_activity_vertical_margin"
                    android:backgroundTint="?attr/colorPrimary">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:maxLines="1"
                        android:paddingStart="@dimen/half_activity_horizontal_margin"
                        android:paddingEnd="@dimen/half_activity_horizontal_margin"
                        android:text="Lorem ipsum"
                        android:textAppearance="?attr/textAppearanceCaption" />

                </com.google.android.material.card.MaterialCardView>

            </LinearLayout>

        </androidx.constraintlayout.widget.ConstraintLayout>