android.support.v7.widget.GridLayout se déforme sur les petits appareils à l'écran android

J'utilise Grid Layout de la bibliothèque de support v7 pour créer une disposition de la grille dans android. La mise en page se construit parfaitement sur les grands écrans (tailles d'écran> 4 "), ce que j'ai confirmé en prévisualisant les écrans dans android studio, mais la mise en page déforme mal sur les petits écrans (vérifiés sur un vrai appareil) . visible jusqu'à la fin l'écran suivant les captures d'écran:android.support.v7.widget.GridLayout se déforme sur les petits appareils à l'écran android

sur un appareil à écran de petite taille (Galaxy S dans ce cas)

sur un appareil à écran plus grand (5.1" dans ce cas)

est sous le code pour le même:

<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" 
    android:background="#BDBDBD" 
    android:padding="3dp" 
    app:columnCount="3" 
    app:rowCount="2" 
    android:layout_below="@+id/pager" 
    android:layout_marginLeft="0dp" 
    > 

    <LinearLayout 
     app:layout_column="0" 
     app:layout_columnWeight="1" 
     app:layout_rowWeight="1" 
     android:layout_marginLeft="0dp" 
     android:background="#FFF" 
     android:layout_marginRight="2dp" 
     android:layout_marginBottom="2dp" 
     android:orientation="vertical" 
     android:gravity="center" 
     android:onClick="buttonActions" 
     android:id="@+id/menu1" 
     android:clickable="true" 
     app:layout_row="0" 
     > 
     <ImageButton 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:src="@drawable/menu11" 
      android:background="#FFF" 
      android:layout_gravity="center" 
      android:id="@+id/menu1_img" 
      android:onClick="buttonActions" 
      /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="@string/menu1" 
      android:gravity="center" 
      android:layout_gravity="center" 
      android:layout_marginTop="3dp" 
      android:id="@+id/menu1_txt" 
      android:onClick="buttonActions" 
      /> 
    </LinearLayout> 
    <LinearLayout 
     app:layout_column="1" 
     app:layout_columnWeight="1" 
     app:layout_rowWeight="1" 
     android:layout_marginLeft="0dp" 
     android:background="#FFF" 
     android:layout_marginRight="2dp" 
     android:layout_marginBottom="2dp" 
     android:orientation="vertical" 
     android:gravity="center" 
     android:id="@+id/menu2" 
     android:onClick="buttonActions" 
     app:layout_row="0" 
     > 
     <ImageButton 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:src="@drawable/menu12" 
      android:background="#FFF" 
      android:layout_gravity="center" 
      android:id="@+id/menu2_img" 
      android:onClick="buttonActions" 
      /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="@string/menu2" 
      android:gravity="center" 
      android:layout_gravity="center" 
      android:layout_marginTop="3dp" 
      android:id="@+id/menu2_txt" 
      android:onClick="buttonActions" 
      /> 
    </LinearLayout> 
    <LinearLayout 
     app:layout_column="2" 
     app:layout_columnWeight="1" 
     app:layout_rowWeight="1" 
     android:layout_marginLeft="0dp" 
     android:background="#FFF" 
     android:layout_marginRight="2dp" 
     android:layout_marginBottom="2dp" 
     android:orientation="vertical" 
     android:gravity="center" 
     android:onClick="buttonActions" 
     android:id="@+id/menu3" 
     app:layout_row="0" 
     > 
     <ImageButton 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:src="@drawable/menu13" 
      android:background="#FFF" 
      android:layout_gravity="center" 
      android:onClick="buttonActions" 
      android:id="@+id/menu3_img" 
      /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="@string/menu3" 
      android:gravity="center" 
      android:layout_gravity="center" 
      android:layout_marginTop="3dp" 
      android:onClick="buttonActions" 
      android:id="@+id/menu3_txt" 
      /> 
    </LinearLayout> 
    <LinearLayout 
     app:layout_column="0" 
     app:layout_columnWeight="1" 
     app:layout_rowWeight="1" 
     android:layout_marginLeft="0dp" 
     android:background="#FFF" 
     android:layout_marginRight="2dp" 
     android:layout_marginBottom="2dp" 
     android:orientation="vertical" 
     android:gravity="center" 
     android:id="@+id/menu4" 
     android:onClick="buttonActions" 
     > 
     <ImageButton 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:src="@drawable/menu14" 
      android:background="#FFF" 
      android:layout_gravity="center" 
      android:id="@+id/menu4_img" 
      android:onClick="buttonActions" 
      /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="@string/menu4" 
      android:gravity="center" 
      android:layout_gravity="center" 
      android:layout_marginTop="3dp" 
      android:id="@+id/menu4_txt" 
      android:onClick="buttonActions" 
      /> 
    </LinearLayout> 
    <LinearLayout 
     app:layout_column="1" 
     app:layout_columnWeight="1" 
     app:layout_rowWeight="1" 
     android:layout_marginLeft="0dp" 
     android:background="#FFF" 
     android:layout_marginRight="2dp" 
     android:layout_marginBottom="2dp" 
     android:orientation="vertical" 
     android:gravity="center" 
     android:id="@+id/menu5" 
     android:onClick="buttonActions" 
     > 
     <ImageButton 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:src="@drawable/menu15" 
      android:background="#FFF" 
      android:layout_gravity="center" 
      android:id="@+id/menu5_img" 
      android:onClick="buttonActions" 
      /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="@string/menu5" 
      android:gravity="center" 
      android:layout_gravity="center" 
      android:layout_marginTop="3dp" 
      android:id="@+id/menu5_txt" 
      android:onClick="buttonActions" 
      /> 
    </LinearLayout> 
    <LinearLayout 
     app:layout_column="2" 
     app:layout_columnWeight="1" 
     app:layout_rowWeight="1" 
     android:layout_marginLeft="0dp" 
     android:background="#FFF" 
     android:layout_marginRight="2dp" 
     android:layout_marginBottom="2dp" 
     android:orientation="vertical" 
     android:gravity="center" 
     android:onClick="buttonActions" 
     android:id="@+id/menu6" 
     > 
     <ImageButton 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:src="@drawable/menu16" 
      android:background="#FFF" 
      android:layout_gravity="center" 
      android:onClick="buttonActions" 
      android:id="@+id/menu6_img" 
      /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="@string/menu6" 
      android:gravity="center" 
      android:layout_gravity="center" 
      android:layout_marginTop="3dp" 
      android:onClick="buttonActions" 
      android:id="@+id/menu6_txt" 
      /> 
    </LinearLayout> 
    <LinearLayout 
     app:layout_column="0" 
     app:layout_columnWeight="1" 
     app:layout_rowWeight="1" 
     android:layout_marginLeft="0dp" 
     android:background="#FFF" 
     android:layout_marginRight="2dp" 
     android:layout_marginBottom="2dp" 
     android:orientation="vertical" 
     android:gravity="center" 
     android:id="@+id/menu7" 
     android:onClick="buttonActions" 
     > 
     <ImageButton 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:src="@drawable/menu17" 
      android:background="#FFF" 
      android:layout_gravity="center" 
      android:id="@+id/menu7_img" 
      android:onClick="buttonActions" 
      /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="@string/menu7" 
      android:gravity="center" 
      android:layout_gravity="center" 
      android:layout_marginTop="3dp" 
      android:onClick="buttonActions" 
      android:id="@+id/menu7_txt" 
      /> 
    </LinearLayout> 
    <LinearLayout 
     app:layout_column="1" 
     app:layout_columnWeight="1" 
     app:layout_rowWeight="1" 
     android:layout_marginLeft="0dp" 
     android:background="#FFF" 
     android:layout_marginRight="2dp" 
     android:layout_marginBottom="2dp" 
     android:orientation="vertical" 
     android:gravity="center" 
     android:onClick="buttonActions" 
     android:id="@+id/menu8" 
     > 
     <ImageButton 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:src="@drawable/menu18" 
      android:background="#FFF" 
      android:layout_gravity="center" 
      android:onClick="buttonActions" 
      android:id="@+id/menu8_img" 
      /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="@string/menu8" 
      android:gravity="center" 
      android:layout_gravity="center" 
      android:layout_marginTop="3dp" 
      android:onClick="buttonActions" 
      android:id="@+id/menu8_txt" 
      /> 
    </LinearLayout> 
    <LinearLayout 
     app:layout_column="2" 
     app:layout_columnWeight="1" 
     app:layout_rowWeight="1" 
     android:layout_marginLeft="0dp" 
     android:background="#FFF" 
     android:layout_marginRight="2dp" 
     android:layout_marginBottom="2dp" 
     android:orientation="vertical" 
     android:gravity="center" 
     android:onClick="buttonActions" 
     android:id="@+id/menu9" 
     > 
     <ImageButton 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:src="@drawable/menu19" 
      android:background="#FFF" 
      android:layout_gravity="center" 
      android:onClick="buttonActions" 
      android:id="@+id/menu9_img" 
      /> 
     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="@string/menu9" 
      android:gravity="center" 
      android:layout_gravity="center" 
      android:layout_marginTop="3dp" 
      android:onClick="buttonActions" 
      android:id="@+id/menu9_txt" 
      /> 
    </LinearLayout> 

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

Aide à cet égard, pour résoudre la question de la compatibilité sur les petits appareils seraient appréciés. Merci d'avance.

Source

2016-03-28 Karan Dua

Vous pourriez trouver ce ([blog sur GridLayout] http://android-developers.blogspot.com/2011/11/new -layout-widgets-space-and-gridlayout.html) utile. Ou il pourrait être plus facile pour vous d'éliminer le GridLayout et juste utiliser [LinearLayout avec des poids] (http://developer.android.com/guide/topics/ui/layout/linear.html#Weight). – tachyonflux

Vous venez d'obtenir la mise en page complète avec LinearLayout avec des poids et fonctionne sur tous les appareils. Merci. –

Ceci est mon approche à l'aide LinearLayouts avec des poids

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" 
android:layout_height="match_parent" android:paddingLeft="@dimen/activity_horizontal_margin" 
android:paddingRight="@dimen/activity_horizontal_margin" 
android:paddingTop="@dimen/activity_vertical_margin" 
android:paddingBottom="@dimen/activity_vertical_margin" 
tools:context="com.ttl.thetravellerslounge.TopNavigation"> 
<include 
    layout="@layout/toolbar" 
    android:id="@+id/toolbar"></include> 

<TextView 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:textAppearance="?android:attr/textAppearanceLarge" 
    android:text="TTL Immigration" 
    android:id="@+id/textView" 
    android:textColor="#fff" 
    android:padding="7dp" 
    android:layout_centerHorizontal="true" 
    android:textSize="35sp" 
    /> 
<android.support.v4.view.ViewPager 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@+id/pager" 
    android:layout_width="match_parent" 
    android:layout_height="170dp" 
    android:layout_below="@+id/toolbar" 
    > 
</android.support.v4.view.ViewPager> 

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" 
    android:layout_below="@+id/pager" 
    android:layout_marginTop="2dp" 
    > 
    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     > 
     <LinearLayout 
      android:layout_height="match_parent" 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_marginLeft="0dp" 
      android:background="#FFF" 
      android:layout_marginRight="2dp" 
      android:layout_marginBottom="2dp" 
      android:orientation="vertical" 
      android:gravity="center" 
      android:onClick="buttonActions" 
      android:id="@+id/menu1" 
      android:clickable="true" 

      > 
      <ImageButton 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/menu11" 
       android:background="#FFF" 
       android:layout_gravity="center" 
       android:id="@+id/menu1_img" 
       android:onClick="buttonActions" 
       /> 
      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="@string/menu1" 
       android:gravity="center" 
       android:layout_gravity="center" 
       android:layout_marginTop="3dp" 
       android:id="@+id/menu1_txt" 
       android:onClick="buttonActions" 
       /> 
     </LinearLayout> 
     <LinearLayout 
      android:layout_height="match_parent" 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_marginLeft="0dp" 
      android:background="#FFF" 
      android:layout_marginRight="2dp" 
      android:layout_marginBottom="2dp" 
      android:orientation="vertical" 
      android:gravity="center" 
      android:id="@+id/menu2" 
      android:onClick="buttonActions" 

      > 
      <ImageButton 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/menu12" 
       android:background="#FFF" 
       android:layout_gravity="center" 
       android:id="@+id/menu2_img" 
       android:onClick="buttonActions" 
       /> 
      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="@string/menu2" 
       android:gravity="center" 
       android:layout_gravity="center" 
       android:layout_marginTop="3dp" 
       android:id="@+id/menu2_txt" 
       android:onClick="buttonActions" 
       /> 
     </LinearLayout> 
     <LinearLayout 
      android:layout_height="match_parent" 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_marginLeft="0dp" 
      android:background="#FFF" 
      android:layout_marginRight="2dp" 
      android:layout_marginBottom="2dp" 
      android:orientation="vertical" 
      android:gravity="center" 
      android:onClick="buttonActions" 
      android:id="@+id/menu3" 

      > 
      <ImageButton 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/menu13" 
       android:background="#FFF" 
       android:layout_gravity="center" 
       android:onClick="buttonActions" 
       android:id="@+id/menu3_img" 
       /> 
      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="@string/menu3" 
       android:gravity="center" 
       android:layout_gravity="center" 
       android:layout_marginTop="3dp" 
       android:onClick="buttonActions" 
       android:id="@+id/menu3_txt" 
       /> 
     </LinearLayout> 
    </LinearLayout> 
    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     > 
     <LinearLayout 
      android:layout_height="match_parent" 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_marginLeft="0dp" 
      android:background="#FFF" 
      android:layout_marginRight="2dp" 
      android:layout_marginBottom="2dp" 
      android:orientation="vertical" 
      android:gravity="center" 
      android:id="@+id/menu4" 
      android:onClick="buttonActions" 
      android:paddingLeft="1dp" 
      > 
      <ImageButton 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/menu14" 
       android:background="#FFF" 
       android:layout_gravity="center" 
       android:id="@+id/menu4_img" 
       android:onClick="buttonActions" 
       /> 
      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="@string/menu4" 
       android:gravity="center" 
       android:layout_gravity="center" 
       android:layout_marginTop="3dp" 
       android:id="@+id/menu4_txt" 
       android:onClick="buttonActions" 
       /> 
     </LinearLayout> 
     <LinearLayout 
      android:layout_height="match_parent" 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_marginLeft="0dp" 
      android:background="#FFF" 
      android:layout_marginRight="2dp" 
      android:layout_marginBottom="2dp" 
      android:orientation="vertical" 
      android:gravity="center" 
      android:id="@+id/menu5" 
      android:onClick="buttonActions" 
      > 
      <ImageButton 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/menu15" 
       android:background="#FFF" 
       android:layout_gravity="center" 
       android:id="@+id/menu5_img" 
       android:onClick="buttonActions" 
       /> 
      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="@string/menu5" 
       android:gravity="center" 
       android:layout_gravity="center" 
       android:layout_marginTop="3dp" 
       android:id="@+id/menu5_txt" 
       android:onClick="buttonActions" 
       /> 
     </LinearLayout> 
     <LinearLayout 
      android:layout_height="match_parent" 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_marginLeft="0dp" 
      android:background="#FFF" 
      android:layout_marginRight="2dp" 
      android:layout_marginBottom="2dp" 
      android:orientation="vertical" 
      android:gravity="center" 
      android:onClick="buttonActions" 
      android:id="@+id/menu6" 
      > 
      <ImageButton 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/menu16" 
       android:background="#FFF" 
       android:layout_gravity="center" 
       android:onClick="buttonActions" 
       android:id="@+id/menu6_img" 
       /> 
      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="@string/menu6" 
       android:gravity="center" 
       android:layout_gravity="center" 
       android:layout_marginTop="3dp" 
       android:onClick="buttonActions" 
       android:id="@+id/menu6_txt" 
       /> 
     </LinearLayout> 
    </LinearLayout> 
    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     > 
     <LinearLayout 
      android:layout_height="match_parent" 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_marginLeft="0dp" 
      android:background="#FFF" 
      android:layout_marginRight="2dp" 
      android:layout_marginBottom="2dp" 
      android:orientation="vertical" 
      android:gravity="center" 
      android:id="@+id/menu7" 
      android:onClick="buttonActions" 
      > 
      <ImageButton 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/menu17" 
       android:background="#FFF" 
       android:layout_gravity="center" 
       android:id="@+id/menu7_img" 
       android:onClick="buttonActions" 
       /> 
      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="@string/menu7" 
       android:gravity="center" 
       android:layout_gravity="center" 
       android:layout_marginTop="3dp" 
       android:onClick="buttonActions" 
       android:id="@+id/menu7_txt" 
       /> 
     </LinearLayout> 
     <LinearLayout 
      android:layout_height="match_parent" 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_marginLeft="0dp" 
      android:background="#FFF" 
      android:layout_marginRight="2dp" 
      android:layout_marginBottom="2dp" 
      android:orientation="vertical" 
      android:gravity="center" 
      android:onClick="buttonActions" 
      android:id="@+id/menu8" 
      > 
      <ImageButton 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/menu18" 
       android:background="#FFF" 
       android:layout_gravity="center" 
       android:onClick="buttonActions" 
       android:id="@+id/menu8_img" 
       /> 
      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="@string/menu8" 
       android:gravity="center" 
       android:layout_gravity="center" 
       android:layout_marginTop="3dp" 
       android:onClick="buttonActions" 
       android:id="@+id/menu8_txt" 
       /> 
     </LinearLayout> 
     <LinearLayout 
      android:layout_height="match_parent" 
      android:layout_width="0dp" 
      android:layout_weight="1" 
      android:layout_marginLeft="0dp" 
      android:background="#FFF" 
      android:layout_marginRight="2dp" 
      android:layout_marginBottom="2dp" 
      android:orientation="vertical" 
      android:gravity="center" 
      android:onClick="socialDialog" 
      android:id="@+id/menu9" 
      > 
      <ImageButton 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:src="@drawable/menu19" 
       android:background="#FFF" 
       android:layout_gravity="center" 
       android:onClick="socialDialog" 
       android:id="@+id/menu9_img" 
       /> 
      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:text="@string/menu9" 
       android:gravity="center" 
       android:layout_gravity="center" 
       android:layout_marginTop="3dp" 
       android:onClick="socialDialog" 
       android:id="@+id/menu9_txt" 
       /> 
     </LinearLayout> 


    </LinearLayout> 
</LinearLayout>

Source

2016-04-08 03:49:23

android.support.v7.widget.GridLayout se déforme sur les petits appareils à l'écran android

Répondre

Questions connexes