Persentase lebar dalam RelativeLayout

450

Saya sedang mengerjakan tata letak formulir untuk Login Activitydi Aplikasi Android saya. Gambar di bawah ini adalah bagaimana saya ingin terlihat seperti:

masukkan deskripsi gambar di sini

Saya dapat mencapai tata letak ini dengan XML berikut . Masalahnya adalah, ini sedikit meretas. Saya harus membuat hard-code lebar untuk host EditText. Secara khusus, saya harus menentukan:

android:layout_width="172dp"

Saya benar-benar ingin memberikan lebar persentase ke host dan port EditText. (Sesuatu seperti 80% untuk host, 20% untuk port.) Apakah ini mungkin? XML berikut berfungsi pada Droid saya, tetapi tampaknya tidak berfungsi untuk semua layar. Saya ingin solusi yang lebih kuat.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/main"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <TextView
        android:id="@+id/host_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/home"
        android:paddingLeft="15dp"
        android:paddingTop="0dp"
        android:text="host"
        android:textColor="#a5d4e2"
        android:textSize="25sp"
        android:textStyle="normal" />

    <TextView
        android:id="@+id/port_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/home"
        android:layout_toRightOf="@+id/host_input"
        android:paddingTop="0dp"
        android:text="port"
        android:textColor="#a5d4e2"
        android:textSize="25sp"
        android:textStyle="normal" />

    <EditText
        android:id="@+id/host_input"
        android:layout_width="172dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/host_label"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:layout_marginTop="4dp"
        android:background="@android:drawable/editbox_background"
        android:inputType="textEmailAddress" />

    <EditText
        android:id="@+id/port_input"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/host_label"
        android:layout_marginTop="4dp"
        android:layout_toRightOf="@id/host_input"
        android:background="@android:drawable/editbox_background"
        android:inputType="number" />

    <TextView
        android:id="@+id/username_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/host_input"
        android:paddingLeft="15dp"
        android:paddingTop="15dp"
        android:text="username"
        android:textColor="#a5d4e2"
        android:textSize="25sp"
        android:textStyle="normal" />

    <EditText
        android:id="@+id/username_input"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/username_label"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:layout_marginTop="4dp"
        android:background="@android:drawable/editbox_background"
        android:inputType="textEmailAddress" />

    <TextView
        android:id="@+id/password_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/username_input"
        android:paddingLeft="15dp"
        android:paddingTop="15dp"
        android:text="password"
        android:textColor="#a5d4e2"
        android:textSize="25sp"
        android:textStyle="normal" />

    <EditText
        android:id="@+id/password_input"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/password_label"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:layout_marginTop="4dp"
        android:background="@android:drawable/editbox_background"
        android:inputType="textPassword" />

    <ImageView
        android:id="@+id/home"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="false"
        android:paddingLeft="15dp"
        android:paddingRight="15dp"
        android:paddingTop="15dp"
        android:scaleType="fitStart"
        android:src="@drawable/home" />

    <Button
        android:id="@+id/login_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/password_input"
        android:layout_marginLeft="15dp"
        android:layout_marginTop="15dp"
        android:text="   login   "
        android:textSize="18sp" >
    </Button>

</RelativeLayout>
android  android-layout  android-relativelayout 
— Sarson
sumber
Saya mengambil beberapa waktu untuk menjelaskan semuanya dengan menjawab pertanyaan serupa ini: stackoverflow.com/questions/7846614/…
— hcpl
1
Pertimbangkan untuk menggunakan android: hint di EditText daripada TextView. Menghemat ruang
— almisoft
SIAPAPUN yang mencari Demo Dukungan Perpustakaan Persen code2concept.blogspot.in/2015/08/...
— nitesh

Jawaban:

760

Anda sedang mencari android:layout_weight atribut. Ini akan memungkinkan Anda untuk menggunakan persentase untuk menentukan tata letak Anda.

Pada contoh berikut, tombol kiri menggunakan 70% dari ruang, dan tombol kanan 30%.

<LinearLayout
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"
    android:orientation="horizontal">

    <Button
        android:text="left" 
        android:layout_width="0dp" 
        android:layout_height="wrap_content" 
        android:layout_weight=".70" /> 

    <Button
        android:text="right" 
        android:layout_width="0dp" 
        android:layout_height="wrap_content" 
        android:layout_weight=".30" />

</LinearLayout>

Ini berfungsi sama dengan segala jenis Tampilan, Anda dapat mengganti tombol dengan beberapa EditText yang sesuai dengan kebutuhan Anda.

Pastikan untuk mengatur layout_widthke 0dpatau tampilan Anda mungkin tidak diskalakan dengan benar.

Perhatikan bahwa jumlah bobot tidak harus sama dengan 1, saya hanya merasa lebih mudah dibaca seperti ini. Anda dapat mengatur bobot pertama menjadi 7 dan yang kedua menjadi 3 dan itu akan memberikan hasil yang sama.

— Dalma
sumber
171
ini masuk akal untuk menggunakan LinearLayout namun dia menginginkan RelativeLayout. Apakah ada cara untuk melakukan ini karena saya harus menggunakan RelativeLayout untuk item Daftar
— Michael Allen
33
Ya, buat LinearLayout bersarang di dalam RelativeLayout Anda, tempat Anda ingin menggunakan persentase.
— Dalmas
17
Jawaban yang diberikan di atas oleh LadaRaider hanya berfungsi untuk saya ketika saya mengatur lebar ke 0px. android: layout_width = "0px"
— Anhsirk Reddy
6
Atau hanya Tampilan alih-alih Tombol. Lebih jelas itu tidak melakukan hal seperti itu.
— Lance Nanek
13
Jawaban ini berfungsi dengan baik, tetapi jika Anda tidak dapat menggunakan RelativeLayout, Anda sekarang dapat menggunakan PercentRelativeLayout dari pustaka dukungan versi 23.0.0.
— butuh
290

Ini tidak cukup menjawab pertanyaan awal, yaitu untuk pemisahan 70/30, tetapi dalam kasus khusus pemisahan 50/50 antara komponen ada cara: letakkan penyangga tidak terlihat di tengah dan gunakan untuk menempatkan posisi dua komponen yang menarik.

<RelativeLayout 
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <View android:id="@+id/strut"
        android:layout_width="0dp"
        android:layout_height="0dp" 
        android:layout_centerHorizontal="true"/>
    <Button
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_alignRight="@id/strut"
        android:layout_alignParentLeft="true"
        android:text="Left"/> 
    <Button 
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@id/strut"
        android:layout_alignParentRight="true"
        android:text="Right"/>
</RelativeLayout>

Karena ini adalah kasus yang cukup umum, solusi ini lebih dari sekadar rasa ingin tahu. Ini sedikit hack tetapi efisien karena strut yang kosong dan berukuran nol harus sangat murah.

Namun secara umum, yang terbaik adalah jangan berharap terlalu banyak dari layout Android stock ...

— olefevre
sumber
8
Saya sangat menyukai ide itu! Saya sangat suka RelativeLayout, dan ini adalah satu lagi alasan bagi saya untuk menghindari penggunaan TableLayout. Terima kasih! :)
— mreichelt
19
Mengapa kita membutuhkan solusi sama sekali adalah apa yang ingin saya ketahui. Ini adalah fitur dasar dan lama dari HTML. Tentunya para pengembang Android dapat melihat HTML untuk memahami apa yang akan dibutuhkan dan digunakan orang!
— JohnK
2
@ JohnK sepenuhnya setuju. html / css jauh lebih baik dan sederhana daripada sistem tata letak android.
— Nico AD
1
Bagaimana jika saya ingin mencapai 70/30 RelativeLayout?
— Adil Malik
16
Anda bahkan dapat menentukan android:visibility="invisible"pada penyangga untuk melewatkan panggilan onDraw;)
— MartinodF
134

Perbarui 1

Seperti yang ditunjukkan oleh @EmJiHash PercentRelativeLayout tidak digunakan lagi di API level 26.0.0

Di bawah ini mengutip komentar google:

Kelas ini sudah tidak digunakan lagi di API level 26.0.0. pertimbangkan untuk menggunakan ConstraintLayout dan tata letak terkait sebagai gantinya. Berikut ini menunjukkan cara mereplikasi fungsi tata letak persentase dengan ConstraintLayout

Google memperkenalkan API baru bernama android.support.percent

Kemudian Anda bisa menentukan persentase untuk dilihat

Tambahkan kompilasi seperti ketergantungan 

implementation 'com.android.support:percent:22.2.0

dalam hal itu, PercentRelativeLayout adalah apa yang dapat kita lakukan dengan tata letak yang bijaksana

 <android.support.percent.PercentRelativeLayout
     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">
     <ImageView
         app:layout_widthPercent="50%"
         app:layout_heightPercent="50%"
         app:layout_marginTopPercent="25%"
         app:layout_marginLeftPercent="25%"/>
 </android.support.percent.PercentRelativeLayout>
— NJ
sumber
4
jika Anda ingin menggunakannya untuk item listview, itu tidak akan berfungsi
— jemo mgebrishvili
1
Kelas ini sudah tidak digunakan lagi di API level 26.0.0-beta1. pertimbangkan untuk menggunakan ConstraintLayout dan tata letak terkait sebagai gantinya
— EmJiHash
1
kompilasi tidak digunakan lagi, gunakan implementasi.
— Bay
81

Anda tidak dapat menggunakan persentase untuk menentukan dimensi Tampilan di dalam RelativeLayout. Cara terbaik untuk melakukannya adalah dengan menggunakan LinearLayout dan bobot, atau Tata Letak khusus.

— Guy Romain
sumber
15
Saatnya untuk memperbarui jawaban Anda,
— Andalah yang
31

Anda dapat melihat di perpustakaan dukungan persen yang baru. 

compile 'com.android.support:percent:22.2.0'

docs

Sampel

— gbero
sumber
1
Kelas ini sudah tidak digunakan lagi di API level 26.0.0-beta1. pertimbangkan untuk menggunakan ConstraintLayout dan tata letak terkait sebagai gantinya.
— EmJiHash
19

Anda dapat menggunakan PercentRelativeLayout , Ini adalah tambahan tidak berdokumen baru-baru ini ke Perpustakaan Dukungan Desain , memungkinkan kemampuan untuk menentukan tidak hanya elemen relatif satu sama lain tetapi juga persentase total ruang yang tersedia.

Subkelas RelativeLayout yang mendukung dimensi dan margin berdasarkan persentase. Anda dapat menentukan dimensi atau margin anak dengan menggunakan atribut dengan akhiran "Persen".

<android.support.percent.PercentRelativeLayout
     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">
  <ImageView
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      app:layout_widthPercent="50%"
      app:layout_heightPercent="50%"
      app:layout_marginTopPercent="25%"
      app:layout_marginLeftPercent="25%"/>
</android.support.percent.PercentFrameLayout>

Paket Persen menyediakan API untuk mendukung penambahan dan pengelolaan dimensi berbasis persentase di aplikasi Anda.

Untuk menggunakannya, Anda perlu menambahkan perpustakaan ini ke daftar dependensi Gradle Anda :

dependencies {
    compile 'com.android.support:percent:22.2.0'//23.1.1
}
— IntelliJ Amiya
sumber
1
masih perlu mendefinisikanandroid:layout_width="match_parent"
— li2
Saya punya masalah dengan TextView yang padding font menyebabkan pemotongan teks, dan ini benar-benar menyelesaikannya. Terima kasih banyak!
— dianakarenms
1
Kelas ini sudah tidak digunakan lagi di API level 26.0.0-beta1. pertimbangkan untuk menggunakan ConstraintLayout dan tata letak terkait sebagai gantinya
— EmJiHash
12

Saya telah memecahkan ini dengan membuat Tampilan khusus:

public class FractionalSizeView extends View {
  public FractionalSizeView(Context context, AttributeSet attrs) {
    super(context, attrs);
  }

  public FractionalSizeView(Context context, AttributeSet attrs, int defStyle) {
    super(context, attrs, defStyle);
  }

  @Override
  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
    int width = MeasureSpec.getSize(widthMeasureSpec);
    setMeasuredDimension(width * 70 / 100, 0);
  }
}

Ini adalah strut tak terlihat yang bisa saya gunakan untuk menyelaraskan tampilan lain di dalam RelativeLayout.

— Ivan Volosyuk
sumber
11

Memperbarui

Seperti yang ditunjukkan oleh @EmJiHash PercentRelativeLayout dan PercentFrameLayout tidak digunakan lagi di API level 26.0.0

Pertimbangkan Menggunakan ConstraintLayout

Google memperkenalkan API baru bernama android.support.percent

1) PercentRelativeLayout

2) PercentFrameLayout

Tambahkan kompilasi seperti ketergantungan

compile 'com.android.support:percent:23.1.1'

Anda dapat menentukan dimensi dalam persentase sehingga mendapatkan manfaat RelativeLayoutdan persentase

 <android.support.percent.PercentRelativeLayout
         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"/>
     <TextView
         app:layout_widthPercent="40%"
         app:layout_heightPercent="40%"
         app:layout_marginTopPercent="15%"
         app:layout_marginLeftPercent="15%"/>
 </android.support.percent.PercentRelativeLayout/>
— ColdFusion
sumber
jika Anda ingin menggunakannya untuk item listview, itu tidak akan berfungsi
— jemo mgebrishvili
1
Kelas ini sudah tidak digunakan lagi di API level 26.0.0-beta1. pertimbangkan untuk menggunakan ConstraintLayout dan tata letak terkait sebagai gantinya.
— EmJiHash
11

Karena PercentRelativeLayout tidak digunakan lagi dalam 26.0.0 dan tata letak bersarang seperti LinearLayout di dalam RelativeLayout memiliki dampak negatif pada kinerja ( Memahami manfaat kinerja dari ConstraintLayout ) pilihan terbaik bagi Anda untuk mencapai lebar persentase adalah dengan mengganti RelativeLayout Anda dengan ConstraintLayout.

Ini bisa diselesaikan dengan dua cara.

SOLUSI # 1 Menggunakan pedoman dengan persentase offset

Editor Tata Letak

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

    <TextView
        android:id="@+id/host_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Host"
        android:layout_marginTop="16dp"
        android:layout_marginLeft="8dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="@+id/host_input" />

    <TextView
        android:id="@+id/port_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Port"
        android:layout_marginTop="16dp"
        android:layout_marginLeft="8dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="@+id/port_input" />

    <EditText
        android:id="@+id/host_input"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:inputType="textEmailAddress"
        app:layout_constraintTop_toBottomOf="@+id/host_label"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/guideline" />

    <EditText
        android:id="@+id/port_input"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:inputType="number"
        app:layout_constraintTop_toBottomOf="@+id/port_label"
        app:layout_constraintLeft_toLeftOf="@+id/guideline"
        app:layout_constraintRight_toRightOf="parent" />

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

</android.support.constraint.ConstraintLayout>

SOLUSI # 2 Menggunakan rantai dengan lebar tertimbang untuk EditText

Editor Tata Letak

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

    <TextView
        android:id="@+id/host_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Host"
        android:layout_marginTop="16dp"
        android:layout_marginLeft="8dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="@+id/host_input" />

    <TextView
        android:id="@+id/port_label"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Port"
        android:layout_marginTop="16dp"
        android:layout_marginLeft="8dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintLeft_toLeftOf="@+id/port_input" />

    <EditText
        android:id="@+id/host_input"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:inputType="textEmailAddress"
        app:layout_constraintHorizontal_weight="0.8"
        app:layout_constraintTop_toBottomOf="@+id/host_label"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toLeftOf="@+id/port_input" />

    <EditText
        android:id="@+id/port_input"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginTop="8dp"
        android:layout_marginLeft="8dp"
        android:layout_marginRight="8dp"
        android:inputType="number"
        app:layout_constraintHorizontal_weight="0.2"
        app:layout_constraintTop_toBottomOf="@+id/port_label"
        app:layout_constraintLeft_toRightOf="@+id/host_input"
        app:layout_constraintRight_toRightOf="parent" />

</android.support.constraint.ConstraintLayout>

Dalam kedua kasus, Anda mendapatkan sesuatu seperti ini

Tampilan Hasil

— Eugene Brusov
sumber
tata letak kendala jauh lebih lambat dan buggier
— Dragos Rachieru
7

PercentRelativeLayout sudah usang dari Revisi 26.0.0 dari Perpustakaan dukungan.

Google memperkenalkan Layout baru yang disebut ConstraintLayout .

Tambahkan pustaka sebagai dependensi dalam file build.gradle tingkat modul Anda:

     dependencies {
        compile 'com.android.support.constraint:constraint-layout:1.0.1'
      }

cukup tambahkan file tata letak:

<?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">
</android.support.constraint.ConstraintLayout>

Kendala

Kendala membantu Anda menjaga agar widget tetap selaras. Anda dapat menggunakan jangkar, seperti pegangan kendala yang ditunjukkan di bawah, untuk menentukan aturan penyelarasan antara berbagai widget.

  1. Wrap Content: Tampilan meluas sesuai kebutuhan agar sesuai dengan isinya.
  2. Match Constraints: Pandangan meluas sesuai kebutuhan untuk memenuhi definisi kendala setelah memperhitungkan margin. Namun, jika dimensi yang diberikan hanya memiliki satu kendala, maka tampilan meluas agar sesuai dengan isinya. Menggunakan mode ini pada ketinggian atau lebar juga memungkinkan Anda untuk mengatur rasio ukuran.
  3. Fixed: Anda menentukan dimensi tertentu dalam kotak teks di bawah ini atau dengan mengubah ukuran tampilan di editor.
  4. Spread: Pandangan didistribusikan secara merata (setelah margin diperhitungkan). Ini standarnya.
  5. Spread inside: Tampilan pertama dan terakhir ditempelkan pada batasan di setiap ujung rantai dan sisanya didistribusikan secara merata.
  6. Weighted: Ketika rantai diatur untuk menyebar atau menyebar di dalam, Anda dapat mengisi ruang yang tersisa dengan mengatur satu atau lebih tampilan untuk "cocok dengan kendala" (0dp). Secara default, ruang didistribusikan secara merata di antara setiap tampilan yang diatur ke "cocok dengan batasan," tetapi Anda dapat memberikan bobot yang penting untuk setiap tampilan menggunakan atribut layout_constraintHorizontal_weight dan layout_constraintVertical_weight. Jika Anda terbiasa dengan layout_weight dalam tata letak linier, ini bekerja dengan cara yang sama. Jadi tampilan dengan nilai bobot tertinggi mendapat ruang paling banyak; tampilan yang memiliki bobot yang sama mendapatkan jumlah ruang yang sama.
  7. Packed: Tampilan dikemas bersama (setelah margin diperhitungkan). Anda kemudian dapat menyesuaikan bias seluruh rantai (kiri / kanan atau atas / bawah) dengan mengubah bias tampilan kepala rantai.
  8. Center Horizontally or Center Vertically: Untuk membuat rantai pandangan dengan cepat, pilih semuanya, klik kanan salah satu tampilan, dan lalu pilih Tengah Horisontal atau Tengah Vertikal, untuk membuat rantai horizontal atau vertikal
  9. Baseline alignment: Sejajarkan garis dasar teks dari tampilan dengan garis dasar teks dari tampilan lain.
  10. Constrain to a guideline: Anda dapat menambahkan pedoman vertikal atau horizontal yang dapat Anda batasi tampilan, dan panduan itu tidak akan terlihat oleh pengguna aplikasi. Anda dapat memposisikan pedoman dalam tata letak berdasarkan pada unit dp atau persen, relatif terhadap tepi tata letak.
  11. Adjust the constraint bias: Ketika Anda menambahkan batasan pada kedua sisi tampilan (dan ukuran tampilan untuk dimensi yang sama adalah "tetap" atau "membungkus konten"), tampilan menjadi terpusat di antara dua kendala dengan bias 50% secara default. Anda dapat menyesuaikan bias dengan menyeret slider bias di jendela Properties
  12. Set size as a ratio: Anda dapat mengatur ukuran tampilan ke rasio seperti 16: 9 jika setidaknya satu dimensi tampilan diatur ke "cocok dengan kendala" (0dp).

Anda dapat belajar lebih banyak dari dokumen resmi .

— Sayang
sumber
3

Anda dapat melakukan ini melalui bobot tata letak. Bobot menentukan bagaimana bagian layar yang tidak diklaim dibagi. Berikan setiap EditText layout_width dari 0, dan bobot proporsional. Yaitu, beri satu bobot 2, dan yang lainnya seberat 1 jika Anda ingin yang pertama mengambil ruang dua kali lebih banyak.

— Cheryl Simon
sumber
3

Cukup menarik, membangun jawaban dari @olefevre, kita tidak hanya bisa melakukan 50/50 layout dengan "struts tak terlihat", tetapi semua jenis layout melibatkan kekuatan dua.

Misalnya, berikut adalah tata letak yang memotong lebar menjadi empat bagian yang sama (sebenarnya tiga, dengan bobot 1, 1, 2):

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <View
        android:id="@+id/strut"
        android:layout_width="1dp"
        android:layout_height="match_parent"
        android:layout_centerHorizontal="true"
        android:background="#000000" />

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_toLeftOf="@+id/strut" >

        <View
            android:id="@+id/left_strut"
            android:layout_width="1dp"
            android:layout_height="match_parent"
            android:layout_toLeftOf="@+id/strut"
            android:layout_centerHorizontal="true"
            android:background="#000000" />

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignRight="@+id/left_strut"
            android:text="Far Left" />

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_toRightOf="@+id/left_strut"
            android:text="Near Left" />
    </RelativeLayout>

        <Button
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_alignLeft="@id/strut"
            android:layout_alignParentRight="true"
            android:text="Right" />

</RelativeLayout>
— kelapa
sumber
1
Usaha yang bagus, tetapi Anda akhirnya menemukan sesuatu yang lebih rumit daripada solusi LinearLayout, yang kami coba hindari. Kebutuhan adalah untuk memiliki semua tampilan dalam satu tata letak relatif yang unik (ini adalah untuk memungkinkan kendala relatif di antara mereka)
— Orabîg
1
untuk tata letak kinerja bersarang harus dihindari. Solusi dengan tampilan terpusat untuk pemecahan 50/50 adalah solusi yang bagus berkat kesederhanaannya. Solusi ini tidak lagi sederhana sama sekali. Saya tidak akan merekomendasikannya.
— hcpl
3

Cukup letakkan dua host tampilan teks dan porta di horizontal linearlayout independen dan gunakan android: layout_weight untuk membuat persentase

— Cyatophilum
sumber
1

Periksa https://github.com/mmin18/FlexLayout yang dapat Anda gunakan persen atau ekspresi java langsung di tata letak xml.

<EditText
    app:layout_left="0%"
    app:layout_right="60%"
    app:layout_height="wrap_content"/>
<EditText
    app:layout_left="prev.right+10dp"
    app:layout_right="100%"
    app:layout_height="wrap_content"/>
— mmin
sumber
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.