Gridlayout + ScrollView

Quiero crear un diseño como la primera página del mercado de Android. Estoy tratando de usar gridlayout como me gustaría poner imageview con diferentes tamaños y ubicación, también tengo que introducir scrollview.

En realidad mi problema es cómo introducir scrollview dentro de android.support.v7.widget.GridLayout?

He intentado:

<?xml version="1.0" encoding="utf-8"?> <ScrollView xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res/com.astuetz.viewpager.extensions.example" android:id="@+id/scrollView1" android:layout_width="wrap_content" android:layout_height="wrap_content" > <android.support.v7.widget.GridLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" app:columnCount="10" > <ImageView android:id="@+id/ImageView1" android:layout_width="130dp" android:layout_height="130dp" app:layout_column="2" app:layout_gravity="left" app:layout_row="1" android:src="@drawable/tab_background_focused" /> <EditText android:id="@+id/editText1" android:layout_width="wrap_content" android:layout_height="wrap_content" app:layout_column="5" app:layout_gravity="bottom" app:layout_row="1" android:ems="10" > <requestFocus /> </EditText> <ImageView android:id="@+id/ImageView2" android:layout_width="130dp" android:layout_height="130dp" app:layout_column="1" app:layout_columnSpan="3" app:layout_gravity="left" app:layout_row="2" android:src="@drawable/tab_background_focused" /> <ImageView android:id="@+id/ImageView3" android:layout_width="130dp" android:layout_height="130dp" app:layout_column="2" app:layout_gravity="left" app:layout_row="4" app:layout_rowSpan="2" android:src="@drawable/tab_background_focused" android:adjustViewBounds="true"/> <ImageButton android:id="@+id/imageButton1" android:layout_width="130dp" android:layout_height="130dp" app:layout_column="2" app:layout_gravity="left" app:layout_row="7" android:src="@drawable/background_dots" /> <ImageView android:id="@+id/imageView4" android:layout_width="130dp" android:layout_height="130dp" app:layout_column="2" app:layout_gravity="left" app:layout_row="9" android:adjustViewBounds="true" android:src="@drawable/tab_background"/> <ImageView android:id="@+id/imageView5" android:layout_width="130dp" android:layout_height="match_parent" app:layout_column="2" app:layout_gravity="left" app:layout_row="9" android:adjustViewBounds="true" /> <ImageView android:id="@+id/imageView6" android:layout_width="130dp" android:layout_height="130dp" app:layout_column="2" app:layout_gravity="left" app:layout_row="9" android:adjustViewBounds="true"/> <ImageView android:id="@+id/imageView7" android:layout_width="130dp" android:layout_height="130dp" app:layout_column="2" app:layout_gravity="left" app:layout_row="2" /> <android.support.v7.widget.Space android:id="@+id/space1" android:layout_width="145dp" android:layout_height="1dp" app:layout_column="0" app:layout_gravity="left" app:layout_row="0" /> <android.support.v7.widget.Space android:layout_width="1dp" android:layout_height="21dp" app:layout_column="0" app:layout_row="0" /> <android.support.v7.widget.Space android:id="@+id/space2" android:layout_width="1dp" android:layout_height="127dp" app:layout_column="0" app:layout_gravity="left" app:layout_row="1" /> <android.support.v7.widget.Space android:id="@+id/space3" android:layout_width="10dp" android:layout_height="1dp" app:layout_column="0" app:layout_gravity="left" app:layout_row="0" /> <android.support.v7.widget.Space android:id="@+id/space4" android:layout_width="1dp" android:layout_height="10dp" app:layout_column="0" app:layout_gravity="left" app:layout_row="1" /> <android.support.v7.widget.Space android:id="@+id/space5" android:layout_width="44dp" android:layout_height="1dp" app:layout_column="3" app:layout_gravity="left" app:layout_row="0" /> <android.support.v7.widget.Space android:layout_width="1dp" android:layout_height="58dp" app:layout_column="0" app:layout_row="5" /> <android.support.v7.widget.Space android:layout_width="1dp" android:layout_height="10dp" app:layout_column="0" app:layout_row="3" /> <android.support.v7.widget.Space android:id="@+id/space6" android:layout_width="1dp" android:layout_height="17dp" app:layout_column="0" app:layout_gravity="left" app:layout_row="6" /> <android.support.v7.widget.Space android:id="@+id/space7" android:layout_width="238dp" android:layout_height="1dp" app:layout_column="4" app:layout_gravity="left" app:layout_row="0" /> <android.support.v7.widget.Space android:id="@+id/space8" android:layout_width="1dp" android:layout_height="16dp" app:layout_column="0" app:layout_gravity="left" app:layout_row="8" /> <android.support.v7.widget.Space android:layout_width="26dp" android:layout_height="1dp" app:layout_column="2" app:layout_row="0" /> </android.support.v7.widget.GridLayout> </ScrollView> 

En este código, la vista de la imagen comienza a sobrescribirse entre sí al final.

He resuelto esto, es necesario mantener la estructura de diseño lineal, a continuación, agregar gridlayout dentro de este y establecer layout_height = "the_value_you_need". Me gusta esto:

 <?xml version="1.0" encoding="utf-8"?> <ScrollView xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" xmlns:app="http://schemas.android.com/apk/res/com.astuetz.viewpager.extensions.example"> <LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <android.support.v7.widget.GridLayout android:layout_width="match_parent" android:layout_height="900dp" > <ImageView android:id="@+id/imageView1" android:layout_width="130dp" android:layout_height="130dp" app:layout_column="0" app:layout_columnSpan="2" app:layout_gravity="left" app:layout_row="0" app:layout_rowSpan="2" android:src="@drawable/tab_background_pressed" /> <ImageView android:id="@+id/imageView2" android:layout_width="130dp" android:layout_height="130dp" app:layout_column="0" app:layout_gravity="right" app:layout_row="3" android:src="@drawable/tab_background_pressed" /> <ImageView android:id="@+id/imageView3" android:layout_width="130dp" android:layout_height="130dp" app:layout_column="0" app:layout_gravity="left" app:layout_row="5" android:src="@drawable/tab_background_pressed" /> <ImageView android:id="@+id/imageView4" android:layout_width="130dp" android:layout_height="130dp" app:layout_column="0" app:layout_gravity="left" app:layout_row="7" android:src="@drawable/tab_background_pressed" /> <ImageView android:id="@+id/imageView5" android:layout_width="130dp" android:layout_height="130dp" app:layout_column="0" app:layout_gravity="left" app:layout_row="7" android:src="@drawable/tab_background_pressed" /> <android.support.v7.widget.Space android:layout_width="32dp" android:layout_height="1dp" app:layout_column="0" app:layout_row="0" /> <android.support.v7.widget.Space android:id="@+id/space1" android:layout_width="1dp" android:layout_height="16dp" app:layout_column="0" app:layout_gravity="left" app:layout_row="2" /> <android.support.v7.widget.Space android:id="@+id/space2" android:layout_width="1dp" android:layout_height="16dp" app:layout_column="0" app:layout_gravity="left" app:layout_row="4" /> <android.support.v7.widget.Space android:id="@+id/space3" android:layout_width="1dp" android:layout_height="16dp" app:layout_column="0" app:layout_gravity="left" app:layout_row="6" /> </android.support.v7.widget.GridLayout> </LinearLayout> </ScrollView> 

Para tener desplazamiento horizontal, cambie layout_widht a un valor fijo.

  • Múltiples WebViews en ScrollView dando problemas (Android)
  • Hacer scrollbars flash de código (como iOS flashScrollIndicators)
  • Hacer que una vista secundaria coincida con el ancho de una vista de desplazamiento principal
  • Android: ¿Vista de lista horizontal en la vista de desplazamiento vertical?
  • Cómo detener ScrollView desde el desplazamiento hasta la parte inferior de la página cargada actual en WebView
  • Android: cómo escuchar los eventos de desplazamiento?
  • ScrollView oculta el diseño lineal inferior
  • Anulación de onTouchEvent que compite con ScrollView
  • Vista emergente de Android No funciona
  • ¿Cómo puedo mostrar mi diseño de desplazamiento por encima del teclado?
  • Vista ScrollView con niños, cómo interceptar desplazamiento condicional
  • FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.