Z podglądem 1 Studio Android 2.2 Google wydała nowy układ w swojej bibliotece wsparcia: ConstraintLayout. Dzięki ConstraintLayout łatwiej jest użyć narzędzia do projektowania w Android Studio, ale nie znalazłem sposobu na użycie względnych rozmiarów (procentów lub „wag” jak w LinearLayout). Czy istnieje sposób zdefiniowania ograniczeń opartych na procentach? Np. Spraw, aby widok zajmował 40% ekranu, utworzyć 20% marginesu między widokami, ustawić szerokość widoku na 50% szerokości innego widoku?

Obecnie możesz to zrobić na kilka sposobów.

Jednym z nich jest utworzenie prowadnic (kliknij prawym przyciskiem myszy obszar projektowania, a następnie kliknij dodaj prowadnicę pionową / poziomą). Następnie możesz kliknąć „nagłówek” prowadnicy, aby zmienić położenie na procentowe. Wreszcie możesz ograniczyć widoki do wytycznych.

Innym sposobem jest pozycjonowanie widoku przy użyciu odchylenia (procent), a następnie zakotwiczenie innych widoków w tym widoku.

To powiedziawszy, zastanawialiśmy się, jak zaoferować wymiary oparte na procentach. Nie mogę nic obiecać, ale chcielibyśmy to dodać.

Przydatne może być szybkie zapoznanie się z tym punktem.

Umieszczenie widoków

Użyj wytyczną przy app:layout_constraintGuide_percenttak:

<androidx.constraintlayout.widget.Guideline
    android:id="@+id/guideline"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    app:layout_constraintGuide_percent="0.5"/>

Następnie możesz użyć tej wytycznej jako punktów kontrolnych dla innych widoków.

lub

Użyj stronniczości za pomocą app:layout_constraintHorizontal_biasi / lub, app:layout_constraintVertical_biasaby zmodyfikować lokalizację widoku, gdy pozwala na to dostępna przestrzeń

<Button
    ...
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintHorizontal_bias="0.25"
    ...
    />

Rozmiar widoków

Inną wartością procentową jest wysokość i / lub szerokość elementów, za pomocą app:layout_constraintHeight_percenti / lub app:layout_constraintWidth_percent:

<Button
    ...
    android:layout_width="0dp"
    app:layout_constraintWidth_percent="0.5"
    ...
    />

Od „ConstraintLayout1.1.0-beta1” można użyć wartości procentowej do zdefiniowania szerokości i wysokości.

android:layout_width="0dp"
app:layout_constraintWidth_default="percent"
app:layout_constraintWidth_percent=".4"

Spowoduje to określenie szerokości wynoszącej 40% szerokości ekranu. Kombinacja tego i wytycznych w procentach pozwala utworzyć dowolny układ oparty na procentach.

Dzięki nowej wersji ConstraintLayout v1.1 możesz teraz wykonywać następujące czynności:

<Button
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintHeight_percent="0.2"
app:layout_constraintWidth_percent="0.65" />

Spowoduje to ograniczenie przycisku do 20% wysokości i 65% szerokości widoku rodzica.

Jak korzystać z Wytycznych

Przyjęta odpowiedź jest nieco niejasna, jak korzystać z wytycznych i czym jest „nagłówek”.

Kroki

Najpierw dodaj wytyczną.

Wybierz linię prowadzącą lub przesuń ją trochę, aby uwidocznić ograniczenia.

Następnie kliknij okrągły okrąg („nagłówek”), aż stanie się procentem. Następnie możesz przeciągnąć ten procent do 50% lub cokolwiek chcesz.

Następnie możesz ograniczyć widok do Wytycznych, aby uczynić go pewnym procentem rodzica (używając match_constraintw widoku).

Wytyczne są nieocenione - a aplikacja: layout_constraintGuide_percent jest świetnym przyjacielem ... Jednak czasami chcemy procentów bez wytycznych. Teraz można używać obciążników :

android:layout_width="0dp"
app:layout_constraintHorizontal_weight="1"

Oto bardziej kompletny przykład wykorzystujący wytyczne z dodatkowymi wagami :

<?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"
    android:padding="16dp"
    tools:context="android.itomerbu.layoutdemo.MainActivity">

    <android.support.constraint.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.44"/>

    <Button
        android:id="@+id/btnThird"
        android:layout_width="0dp"
        app:layout_constraintHorizontal_weight="1"
        android:layout_height="wrap_content"
        android:text="@string/btnThird"
        app:layout_constraintLeft_toLeftOf="parent"
        android:layout_marginBottom="8dp"
        app:layout_constraintRight_toLeftOf="@+id/btnTwoThirds"
        app:layout_constraintBottom_toTopOf="@+id/guideline"
        android:layout_marginStart="8dp"
        android:layout_marginLeft="8dp"/>

    <Button
        android:id="@+id/btnTwoThirds"
        app:layout_constraintHorizontal_weight="2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:text="@string/btnTwoThirds"
        app:layout_constraintBottom_toBottomOf="@+id/btnThird"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toRightOf="@+id/btnThird"/>
</android.support.constraint.ConstraintLayout>

W przypadku ConstraintLayout v1.1.2 wymiar należy ustawić na, 0dpa następnie ustawić atrybuty layout_constraintWidth_percentlub layout_constraintHeight_percentna wartość z zakresu od 0 do 1, na przykład:

<!-- 50% width centered Button -->
<Button
    android:id="@+id/button"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintWidth_percent=".5" />

(Nie musisz ustawiać app:layout_constraintWidth_default="percent"ani app:layout_constraintHeight_default="percent"używać ConstraintLayout 1.1.2 i następujących wersji)

Układ ograniczeń 1.0 sprawiający, że widok zajmuje procent wymaganego ekranu, tworząc dwie wytyczne. W Constraint Layout 1.1 został uproszczony, umożliwiając łatwe ograniczenie dowolnego widoku do procentowej szerokości lub wysokości.

Czy to nie fantastyczne? Wszystkie widoki obsługują atrybuty layout_constraintWidth_percent i layout_constraintHeight_percent. Spowoduje to, że ograniczenie zostanie ustalone na procent dostępnego miejsca. Tak więc rozwinięcie przycisku lub TextView do wypełnienia procenta ekranu można wykonać za pomocą kilku wierszy XML.

Na przykład, jeśli chcesz ustawić szerokość przycisku na 70% ekranu, możesz to zrobić w następujący sposób:

<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_constraintWidth_percent="0.7" />

Należy pamiętać, że należy podać wymiar, który należy zastosować jako wartość procentową do 0dp, ponieważ podaliśmy android: layout_width do 0dp powyżej.

Podobnie, jeśli chcesz ustawić wysokość przycisku na 20% ekranu, możesz to zrobić w następujący sposób:

<Button
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_constraintHeight_percent="0.2" />

Widzieć! tym razem podaliśmy android: layout_height do 0dp, ponieważ chcemy, aby przycisk używał wysokości jako wartości procentowej.

Wypróbuj ten kod. Możesz zmienić wartości procentowe wysokości i szerokości za pomocą app: layout_constraintHeight_percent i app: layout_constraintWidth_percent.

<?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="match_parent">

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="#FF00FF"
        android:orientation="vertical"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintHeight_percent=".6"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintWidth_percent=".4"></LinearLayout>

</android.support.constraint.ConstraintLayout>

Stopień:

dependencies {
...
    implementation 'com.android.support.constraint:constraint-layout:1.1.3'
}

możesz użyć app:layout_constraintVertical_weighttego samego jak layout_weightwlinearlayout

<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/button4"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="Button"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toLeftOf="@+id/button5"
    app:layout_constraintVertical_weight="1"/>

<Button
    android:id="@+id/button5"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="Button"
    app:layout_constraintLeft_toRightOf="@+id/button4"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintVertical_weight="1"/>
</android.support.constraint.ConstraintLayout>

UWAGA: app:layout_constraintVertical_weight( app:layout_constraintHorizontal_weight) będzie działać z android:layout_width="0dp"(android:layout_height="0dp"

Dla kogoś, kto może się przydać, możesz użyć layout_constraintDimensionRatiodowolnego widoku podrzędnego wewnątrz a, ConstraintLayouta my możemy zdefiniować stosunek wysokości lub szerokości drugiego wymiaru (co najmniej jeden musi mieć wartość 0dp albo szerokość albo wysokość) przykład

 <ImageView
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:src="@drawable/top_image"
        app:layout_constraintDimensionRatio="16:9"        
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"/>

w tym przypadku proporcje to 16: 9 app:layout_constraintDimensionRatio="16:9" , więcej informacji znajdziesz TUTAJ

Wiem, że nie było to bezpośrednio to, o co pierwotnie prosił OP, ale bardzo mi pomogło w tej sytuacji, gdy miałem podobne pytanie. Dodanie tego dla osób, które chcą zmienić rozmiar okna układu (z którego regularnie korzystam), za pomocą kodu . Dodaj to do swojego onCreate w pytaniu. (Zmienia to na 80%)

DisplayMetrics dm = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);

int width = dm.widthPixels;
int height = dm.heightPixels;

getWindow().setLayout((int)(width * 0.8), (int)(height * 0.8));

Po prostu po prostu zamień w etykiecie z wytycznymi

app:layout_constraintGuide_begin="291dp"

z

app:layout_constraintGuide_percent="0.7"

gdzie 0,7 oznacza 70%.

Również jeśli teraz spróbujesz przeciągnąć prowadnice, przeciągnięta wartość pojawi się teraz w% wieku.

Korzystając z prowadnic, możesz zmienić położenie na procentowe

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

Możesz także użyć w ten sposób

android:layout_width="0dp"
app:layout_constraintWidth_default="percent"
app:layout_constraintWidth_percent="0.4"