GridLayout ve Row / Column Span Woe

121

Tanıtan Android Geliştiricileri Blog yayınıGridLayout yakalanan görünen açıklıklı otomatik indeks tahsisi nasıl etkilediğini bu diyagramı:

otomatik dizin ayırma

Aslında bunu bir GridLayout. Şimdiye kadar sahip olduğum şeyler:

<android.support.v7.widget.GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res/com.commonsware.android.gridlayout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    app:orientation="horizontal"
    app:columnCount="8">

    <Button
        app:layout_columnSpan="2"
        app:layout_rowSpan="2"
        android:layout_gravity="fill_horizontal"
        android:text="@string/string_1"/>

  <Button
    app:layout_columnSpan="2"
    android:layout_gravity="fill_horizontal"
    android:text="@string/string_2"/>

  <Button
    app:layout_rowSpan="4"
    android:text="@string/string_3"/>

  <Button
    app:layout_columnSpan="3"
    app:layout_rowSpan="2"
    android:layout_gravity="fill_horizontal"
    android:text="@string/string_4"/>

  <Button
    app:layout_columnSpan="3"
    android:layout_gravity="fill_horizontal"
    android:text="@string/string_5"/>

  <Button
    app:layout_columnSpan="2"
    android:layout_gravity="fill_horizontal"
    android:text="@string/string_6"/>

  <android.support.v7.widget.Space
    app:layout_column="0"
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

  <android.support.v7.widget.Space
    android:layout_width="36dp"
    />

</android.support.v7.widget.GridLayout>

<Space>Her bir sütunun minimum genişliğe sahip olmasını sağlamak için öğeleri tanıtmak zorunda kaldım, aksi takdirde bir grup sıfır genişlikli sütunum olurdu.

Ancak onlarla bile şunu anlıyorum:

örnek GridLayout

Özellikle:

  • Buna rağmen android:layout_gravity="fill_horizontal", sütun genişliğine sahip widget'larım yayılmış sütunları doldurmuyor

  • android:layout_rowSpanDeğerlere rağmen hiçbir şey sıraları kapsamaz

Blog gönderisindeki diyagramı a kullanarak herkes yeniden oluşturabilir GridLayoutmi?

Teşekkürler!

android  android-gridlayout 
— CommonsWare
kaynak
178
Sanırım soru sorarsan bile :)
— StackOverflow

Yanıtlar:

76

Oldukça zor geliyor, ancak ihtiyaç duyulanın ötesinde fazladan bir sütun ve satır ekleyerek doğru görünümü elde etmeyi başardım. Sonra fazladan sütunu her satırda bir yükseklik tanımlayan bir Boşluk ile doldurdum ve fazladan satırı her sütun için bir genişliği tanımlayan bir Boşluk ile doldurdum. Ekstra esneklik için, bu Uzay boyutlarının ağırlıklara benzer bir şey sağlamak için kodda ayarlanabileceğini düşünüyorum. Bir ekran görüntüsü eklemeye çalıştım, ancak gerekli itibara sahip değilim.

<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:columnCount="9"
android:orientation="horizontal"
android:rowCount="8" >

<Button
    android:layout_columnSpan="2"
    android:layout_gravity="fill"
    android:layout_rowSpan="2"
    android:text="1" />

<Button
    android:layout_columnSpan="2"
    android:layout_gravity="fill_horizontal"
    android:text="2" />

<Button
    android:layout_gravity="fill_vertical"
    android:layout_rowSpan="4"
    android:text="3" />

<Button
    android:layout_columnSpan="3"
    android:layout_gravity="fill"
    android:layout_rowSpan="2"
    android:text="4" />

<Button
    android:layout_columnSpan="3"
    android:layout_gravity="fill_horizontal"
    android:text="5" />

<Button
    android:layout_columnSpan="2"
    android:layout_gravity="fill_horizontal"
    android:text="6" />

<Space
    android:layout_width="36dp"
    android:layout_column="0"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="1"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="2"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="3"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="4"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="5"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="6"
    android:layout_row="7" />

<Space
    android:layout_width="36dp"
    android:layout_column="7"
    android:layout_row="7" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="0" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="1" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="2" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="3" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="4" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="5" />

<Space
    android:layout_height="36dp"
    android:layout_column="8"
    android:layout_row="6" />

</GridLayout>

ekran görüntüsü

— kturney
kaynak
7
Pekala, IMHO, bugüne kadar sunulan diğer çözümden kademeli olarak daha az keskindir - en azından burada, fiziksel bağlantılı boyutlar Spaceunsurlardadır. Gelecekteki okuyucular için bir ekran görüntüsü ekledim. Teşekkürler!
— CommonsWare
Neden rowCount8'e ayarlandı? 4 satıra (en büyüğünün boyutu rowSpan) ve fazladan olan satıra ihtiyacımız var , Spaceböylece bu 5 olmalıdır. Neyi kaçırıyorum?
— curioustechizen
Orijinal sorudaki resimdeki satır ve sütun sayılarıyla gittim (kendisi bir Android geliştirici blog gönderisinden alınmıştır). Daha sonra, dış kenar boşluklarına yer açmak için satır ve sütun sayılarına 1 ekledim. Sadece 5 sıra ile de iyi çalışmalıdır.
— kturney
5
Bu çözüm yalnızca çalışır bulmak <Gridlayout>aksine<android.support.v7.widget.GridLayout>
— Didia
Row_span ve sütun aralığını dinamik olarak nasıl ayarlayabilirim ... çalışacak?
17 
<RelativeLayout 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" >

    <GridLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:columnCount="8"
        android:rowCount="7" >

        <TextView
            android:layout_width="50dip"
            android:layout_height="50dip"
            android:layout_columnSpan="2"
            android:layout_rowSpan="2"
            android:background="#a30000"
            android:gravity="center"
            android:text="1"
            android:textColor="@android:color/white"
            android:textSize="20dip" />

        <TextView
            android:layout_width="50dip"
            android:layout_height="25dip"
            android:layout_columnSpan="2"
            android:layout_rowSpan="1"
            android:background="#0c00a3"
            android:gravity="center"
            android:text="2"
            android:textColor="@android:color/white"
            android:textSize="20dip" />

        <TextView
            android:layout_width="25dip"
            android:layout_height="100dip"
            android:layout_columnSpan="1"
            android:layout_rowSpan="4"
            android:background="#00a313"
            android:gravity="center"
            android:text="3"
            android:textColor="@android:color/white"
            android:textSize="20dip" />

        <TextView
            android:layout_width="75dip"
            android:layout_height="50dip"
            android:layout_columnSpan="3"
            android:layout_rowSpan="2"
            android:background="#a29100"
            android:gravity="center"
            android:text="4"
            android:textColor="@android:color/white"
            android:textSize="20dip" />

        <TextView
            android:layout_width="75dip"
            android:layout_height="25dip"
            android:layout_columnSpan="3"
            android:layout_rowSpan="1"
            android:background="#a500ab"
            android:gravity="center"
            android:text="5"
            android:textColor="@android:color/white"
            android:textSize="20dip" />

        <TextView
            android:layout_width="50dip"
            android:layout_height="25dip"
            android:layout_columnSpan="2"
            android:layout_rowSpan="1"
            android:background="#00a9ab"
            android:gravity="center"
            android:text="6"
            android:textColor="@android:color/white"
            android:textSize="20dip" />
    </GridLayout>

</RelativeLayout>

ScreenShot

— HandlerExploit
kaynak
2
Teşekkürler! İlginç GridLayoutolan, Android Destek paketinden geçiş yaparsam , düzen bozuluyor ve ikisinin tamamen uyumlu olmadığını gösteriyor. Ayrıca, bunu yapmanın, widget'ların fiziksel boyutlarını içermeyen bir yolu olduğunu umuyorum. Başka hangi cevapların (varsa) geldiğini görmek için bunun biraz ilerlemesine izin vereceğim, ama daha iyi bir şey çıkmazsa seninkini kabul edeceğim. Tekrar teşekkürler!
— CommonsWare
4
"Android Destek paketinden GridLayout'a geçersem, düzen bozulur" - aslında bu benim hatamdı, gerekli android:öznitelikleri app:arka portun XML ad alanını kullanarak bire dönüştürmemek . Backport ile çalışıyor.
— CommonsWare
Bazılarını dinamik olarak boyutlandırmanın bir yolunu buldum, ancak bu yalnızca sütunların veya satırların tam genişliği zaten bitişik görünümler tarafından tanımlanmışsa. Ağırlıkların yaptığı gibi çalıştıklarını ve tanımlanan açıklıklara bağlı olarak alanı eşit olarak dağıttıklarını sanmıyorum. Mükemmel değil ama mevcut projemde ihtiyacım olan şey için mükemmel çalışıyor.
— HandlerExploit
Peki, örneğiniz daha çok bir AbsoluteLayout yaklaşımı ile RelativeLayout için bir karıştırmaya benziyor, değil mi? Bu ne dinamik ne de taşınabilir. Bunun için tam olarak neden bir GridLayout'a ihtiyacınız var? Her neyse, GridLayout,
— imho
@Bondax Bu uygulama, ızgara öğesini hem yükseklik, genişlik, sütun genişliği ve sütun genişliği açısından açıkça tanımlar. Izgara düzeni, ızgaraya farklı genişlikler tanımlandığında (ekran genişliği) ızgara öğelerinizi sınırlı alan içinde yüzer. Bu bir proje için bir gereklilikti ve bu sorunu mükemmel bir şekilde çözdü.
— HandlerExploit
6

Sütunlarınız için hem layout_gravity hem de layout_columntWeight ayarlamalısınız

<android.support.v7.widget.GridLayout
    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">

    <TextView android:text="سوم شخص"
        app:layout_gravity="fill_horizontal"
        app:layout_columnWeight="1"
        />

    <TextView android:text="دوم شخص"
        app:layout_gravity="fill_horizontal"
        app:layout_columnWeight="1"
        />

    <TextView android:text="اول شخص"
        app:layout_gravity="fill_horizontal"
        app:layout_columnWeight="1"
        />
 </android.support.v7.widget.GridLayout>
— Hossein Shahdoost
kaynak
2

Android Desteği V7 GridLayout kitaplığı, ağırlık ilkesini barındırarak fazla alan dağıtımını kolaylaştırır. Bir sütunu uzatmak için, içindeki bileşenlerin bir ağırlık veya yer çekimi tanımladığından emin olun. Bir kolonun esnemesini önlemek için, kolondaki bileşenlerden birinin bir ağırlık veya yerçekimi tanımlamadığından emin olun. Bu kitaplık için bağımlılık eklemeyi unutmayın. Ekle com.android.support:gridlayout-v7:25.0.1 build.gradle içinde.

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout 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"
app:columnCount="2"
app:rowCount="2">

<TextView
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:gravity="center"
    android:text="First"
    app:layout_columnWeight="1"
    app:layout_rowWeight="1" />

<TextView
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:gravity="center"
    android:text="Second"
    app:layout_columnWeight="1"
    app:layout_rowWeight="1" />

<TextView
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:gravity="center"
    android:text="Third"
    app:layout_columnWeight="1"
    app:layout_rowWeight="1" />

<TextView
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:gravity="center"        
    app:layout_columnWeight="1"
    app:layout_rowWeight="1"
    android:text="fourth"/>

</android.support.v7.widget.GridLayout>
— Permita
kaynak
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.