Görünüm ile düzeni nasıl kalan alanı doldurur?


188

Uygulama arayüzümü tasarlıyorum. Böyle bir düzen gerekir:

İstenen düzen örneği

(<ve> Düğmelerdir). Sorun, nasıl TextView iki boyutu sabit boyutu ile kalan alanı dolduracağından emin olmak için bilmiyorum.

Metin Görünümü için fill_parent kullanıyorsam, ikinci düğme (>) gösterilemez.

Görüntüye benzeyen bir düzeni nasıl oluşturabilirim?


kök düzeni olarak ne kullanıyorsunuz?
woodshy

1
@woodshy Herhangi bir Düzen sorun değil, önemli değil.
Luke Vo

Yanıtlar:


213

Woodshy'den gelen cevap benim için çalıştı ve kullanmadığı için Ungureanu Liviu'nun cevabından daha basit RelativeLayout. Açıklık için düzenimi veriyorum:

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

     <Button
        android:layout_width = "80dp"
        android:layout_weight = "0"
        android:layout_height = "wrap_content"
        android:text="&lt;"/>
     <TextView
        android:layout_width = "fill_parent"
        android:layout_height = "wrap_content"
        android:layout_weight = "1"/>
     <Button
        android:layout_width = "80dp"
        android:layout_weight = "0"
        android:layout_height = "wrap_content"
        android:text="&gt;"/>   
 </LinearLayout>

Asla elde edilemeyen alignLeftve gibi şeyler vardır . alignParentLeftLinearLayout
IcyFlame

Bunun nasıl mümkün olduğunu tam olarak anlamıyorum ama RelativeLayout'tan kaçınmak gerçekten harika bir hile
a.dibacco

2
Bu kabul edilen cevap nasıl olabilir? Görüntü görünümü yok, bu sadece çözümün bir parçası. En azından, Göreli Yerleşim ile eski üst oylama cevabından daha iyi (cevabımda neden olduğunu açıkladım)
Livio

dahi çözüm
Mohammad Elsayed

92

<METİN GÖRÜNÜMÜ> LinearLayout'a yerleştirilirse, TextView için <ve> Layout_weight proprty değerini <ve> 0 ve 1 olarak ayarlayın.
RelativeLayout olması durumunda, <ve> öğesini sola ve sağa hizalayın ve TextView özelliğinin "Layout of left" ve "Layout to right" özelliklerini <ve>


Hâlâ numune almaya ihtiyacı olan var mı?
woodshy

Tüm görünümü doldurmak için bu düzende görüntüler nasıl eklenir
Tushar Pandey

tüm görünümü doldurmak için göreceli düzen içine nasıl görüntü ekleyeceksiniz
Tushar Pandey

4
@woodshy evet bir örnek hala yardımcı olacaktır
Frank Schwieterman


71

Kullanırsanız RelativeLayout, böyle bir şey yapabilirsiniz:

<RelativeLayout
    android:layout_width = "fill_parent"
    android:layout_height = "fill_parent">
    <ImageView
        android:id = "@+id/my_image"
        android:layout_width = "wrap_content"
        android:layout_height = "wrap_content"
        android:layout_alignParentTop ="true" />
    <RelativeLayout
        android:id="@+id/layout_bottom"
        android:layout_width="fill_parent"
        android:layout_height = "50dp"
        android:layout_alignParentBottom = "true">
        <Button
            android:id = "@+id/but_left"
            android:layout_width = "80dp"
            android:layout_height = "wrap_content"
            android:text="&lt;"
            android:layout_alignParentLeft = "true"/>
        <TextView
            android:layout_width = "fill_parent"
            android:layout_height = "wrap_content"
            android:layout_toLeftOf = "@+id/but_right"
            android:layout_toRightOf = "@id/but_left" />
        <Button
            android:id = "@id/but_right"
            android:layout_width = "80dp"
            android:layout_height = "wrap_content"
            android:text="&gt;"
            android:layout_alignParentRight = "true"/>
    </RelativeLayout>
</RelativeLayout>

Teşekkürler, işe yarıyor :) Ama anlamıyorum. TextView neden >düğme için değil, tüm alanı doldurmuyor ?
Luke Vo

2
Neden iki iç içe göreli düzen var? Kök olan yeterli olmalıdır. Sonra, tek yapmanız gereken alt göreceli düzen çocuklarının tüm alignParentBottom = "true" olduğundan emin olmaktır
Noel

@Noel Haklısın. 2 düzeni seçiyorum çünkü bu benim kullandığım yöntem: uygulamalarımda birkaç görünümün görünürlüğünü değiştirmem gerekebilir ve hepsini bir düzene koymak ve görünürlüğü sadece bu düzen için değiştirmek daha kolay olabilir . Örneğim mükemmel değil ama işe yarıyor ve birisi için yararlı olabilir.
Ungureanu Liviu

1
@WN Bu benim için de bir durgunluk :) Sanırım metin görünümü tüm alanı kullanmıyor çünkü sağ tuş sabit bir genişliğe sahip. Eğer android değiştirirseniz: layout_width = "80dp" android için: layout_width = "wrap_content" sağ düğme için kim işe yarayacak.
Ungureanu Liviu

2
Bu cevap gerçekten kötü! Göreli düzen her zaman çizim için 2 geçiş yaptığından (diğer düzen türleri için 1'e karşı) 2 göreli mizanpajı iç içe yerleştirmekten kaçınmalısınız. Onları yuvaladığınızda üstel hale gelir. Soldaki alanı doldurmak istediğiniz öğede width = 0 ve weight = 1 olan doğrusal düzen kullanmalısınız. Unutmayın: SADECE başka seçeneğiniz yoksa göreceli düzeni kullanın. stackoverflow.com/questions/4069037/…
Livio

30

Kullanarak ConstraintLayout, gibi bir şey buldum

<Button
    android:id="@+id/left_button"
    android:layout_width="80dp"
    android:layout_height="48dp"
    android:text="&lt;"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<TextView
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toRightOf="@+id/left_button"
    app:layout_constraintRight_toLeftOf="@+id/right_button"
    app:layout_constraintTop_toTopOf="parent" />

<Button
    android:id="@+id/right_button"
    android:layout_width="80dp"
    android:layout_height="48dp"
    android:text="&gt;"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

İşler. Anahtar, sağ, sol, üst ve alt kenar kısıtlamalarını uygun şekilde ayarlamak, sonra genişliği ve yüksekliği ayarlamak 0dpve kendi boyutunu belirlemesine izin vermektir.


4
Sadece ConstraintLayout kullanmaya başlayarak, genişlik ve yüksekliğin "0", bunun için Thanx olarak ayarlandığında kısıtlamalarla belirlenebileceğini bilmek harika :)
MQoder

Her bir kısıtlamanın ok yönüne dikkat etmek önemlidir . TextViewSol ve sağ kısıtlamalara sahip olduğundan emin olun . TextViewİlk eğer esneme yapmaz Buttonhakkı kısıtlaması vardır TextViewve son Buttonsol kısıtlaması vardır TextView.
Manuel

çok daha iyi! iç içe yerleşimler olmadan performansı artırır. Bize 0dp hilesini hatırlattığınız için teşekkür ederiz
OzzyTheGiant

7

Çok basit minWidth veya minHeight'ı ayarlayabilirsiniz, yatay veya dikey olarak aradığınız şeye bağlıdır. Ve diğer nesne için (kalan alanı doldurmak istediğiniz nesne) 1 ağırlığını ayarlarsınız (içeriğini sarmak için genişliği ayarlarsınız), Böylece alanın geri kalanını dolduracaktır.

<LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center|left"
        android:orientation="vertical" >
</LinearLayout>
<LinearLayout
        android:layout_width="80dp"
        android:layout_height="fill_parent"
        android:minWidth="80dp" >
</LinearLayout>

4

yüksek layout_weight özelliği kullanabilirsiniz. Aşağıda, ListView öğesinin altındaki düğmelerle tüm boş alanı kapladığı bir düzen görebilirsiniz:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    tools:context=".ConfigurationActivity"
    android:orientation="vertical"
    >

        <ListView
            android:id="@+id/listView"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_weight="1000"
            />


        <Button
            android:id="@+id/btnCreateNewRule"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Create New Rule" />



        <Button
            android:id="@+id/btnConfigureOk"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Ok" />


</LinearLayout>

3

<LinearLayout...>Benim yaptığım gibi aynı aksaklığa sahip olanlar için :

Belirtmek önemlidir android:layout_width="fill_parent", işe yaramaz wrap_content.

OTOH, atlayabilirsiniz android:layout_weight = "0", gerekli değildir.

Kodum temel olarak https://stackoverflow.com/a/25781167/755804 (Vivek Pandey tarafından) koduyla aynı


3

Göreli düzen her zaman çizim için 2 geçiş yaptığından (diğer düzen türleri için 1'e karşı) 2 göreli mizanpajı iç içe yerleştirmekten kaçınmalısınız. Onları yuvaladığınızda üstel hale gelir. Soldaki alanı doldurmak istediğiniz öğede width = 0 ve weight = 1 olan doğrusal düzen kullanmalısınız. Bu cevap performans ve uygulamalar için daha iyidir. Unutmayın: SADECE başka seçeneğiniz yoksa göreceli düzeni kullanın.

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

    <ImageView
        android:id="@+id/imageview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

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

        <Button
            android:id="@+id/prev_button"
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:text="&lt;" />

        <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:ellipsize="end"
            android:singleLine="true"
            android:gravity="center"
            android:text="TextView" />

        <Button
            android:id="@+id/next_button"
            android:layout_width="80dp"
            android:layout_height="wrap_content"
            android:text="&gt;" />
    </LinearLayout>
</LinearLayout>

0

Sen setini kullanabilirsiniz layout_widthya layout_widthkadar 0dp(oryantasyon siz kalan boşluğu doldurmak istiyor). Sonra layout_weightkalan alanı doldurmak için kullanın .


0

LinearLayout'u sarmak için bir Relativelayout kullanın

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:round="http://schemas.android.com/apk/res-auto"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:orientation="vertical">
    <Button
        android:layout_width = "wrap_content"
        android:layout_height = "wrap_content"
        android:text="&lt;"/>
    <TextView
        android:layout_width = "fill_parent"
        android:layout_height = "wrap_content"
        android:layout_weight = "1"/>
    <Button
        android:layout_width = "wrap_content"
        android:layout_height = "wrap_content"
        android:text="&gt;"/>

</LinearLayout>

</RelativeLayout>`

0

buldum

 <TextView
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_marginEnd="10dp"
        android:fontFamily="casual"
        android:text="(By Zeus B0t)"
     ``   android:textSize="10sp"
        android:gravity="bottom"
        android:textStyle="italic" />

0

Göreli bir düzen kullanırken, görünümün gerilmesi gereken görünümlerin her ikisine de sabitleyerek görünümü uzatabilirsiniz. Belirtilen yükseklik dikkate alınmayacak olsa da, Android hala bir yükseklik özelliği gerektiriyor, bu yüzden "0dp" yazdım. Misal:

<View
    android:id="@+id/topView"
    android:layout_width="match_parent"
    android:layout_height="40dp"
    android:layout_alignParentTop="true"
    android:layout_marginTop="8dp"/>

<View
    android:id="@+id/stretchableView"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_below="@id/topView"
    android:layout_above="@+id/bottomView"
    android:layout_marginTop="8dp"
    android:layout_marginBottom="8dp"
    android:adjustViewBounds="true"/>

<View
    android:id="@id/bottomView"
    android:layout_width="wrap_content"
    android:layout_height="40dp"
    android:layout_alignParentBottom="true"
    android:layout_marginBottom="16dp"/>
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.