Bild Ausrichtung Problem mit Rasterlayout

Question

Ich hatte ein Problem mit der Ausrichtung für das Bild, wenn ich das APK zum Telefon für den Test exportieren. Die Ausrichtung ist völlig anders und außerhalb des Rasters.

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    xmlns:tools="http://schemas.android.com/tools" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:paddingBottom="@dimen/activity_vertical_margin" 
    android:paddingLeft="@dimen/activity_horizontal_margin" 
    android:paddingRight="@dimen/activity_horizontal_margin" 
    android:paddingTop="@dimen/activity_vertical_margin" 
    app:layout_behavior="@string/appbar_scrolling_view_behavior" 
    tools:context="sg.edu.rp.c346.tictactoee.MainActivity" 
    tools:showIn="@layout/activity_main"> 

    <GridLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:background="@drawable/board" 
     android:columnCount="4" 
     android:rowCount="3" 
     android:layout_centerVertical="true" 
     android:layout_centerHorizontal="true" 
     android:id="@+id/gridLayout"> 

     <ImageView 
      android:layout_width="90dp" 
      android:layout_height="90dp" 
      android:id="@+id/imageView0" 
      android:layout_row="0" 
      android:layout_column="0" 
      android:onClick="gameLogic" 
      android:tag="0" 
      android:layout_marginLeft="0dp" 
      android:layout_marginTop="50dp" /> 

     <ImageView 
      android:layout_width="90dp" 
      android:layout_height="90dp" 
      android:id="@+id/imageView1" 
      android:layout_row="0" 
      android:layout_column="1" 
      android:onClick="gameLogic" 
      android:tag="1" 
      android:layout_marginTop="50dp" 
      android:layout_marginLeft="7dp" /> 

     <ImageView 
      android:layout_width="90dp" 
      android:layout_height="90dp" 
      android:id="@+id/imageView2" 
      android:layout_row="0" 
      android:layout_column="2" 
      android:layout_marginLeft="20dp" 
      android:layout_marginTop="50dp" 
      android:onClick="gameLogic" 
      android:tag="2" /> 

     <ImageView 
      android:layout_width="90dp" 
      android:layout_height="90dp" 
      android:id="@+id/imageView3" 
      android:layout_row="1" 
      android:layout_column="0" 
      android:layout_marginLeft="0dp" 
      android:layout_marginTop="50dp" 
      android:onClick="gameLogic" 
      android:tag="3"/> 

     <ImageView 
      android:layout_width="90dp" 
      android:layout_height="90dp" 
      android:id="@+id/imageView4" 
      android:layout_row="1" 
      android:layout_column="1" 
      android:layout_marginTop="50dp" 
      android:layout_marginLeft="7dp" 
      android:onClick="gameLogic" 
      android:tag="4"/> 

     <ImageView 
      android:layout_width="90dp" 
      android:layout_height="90dp" 
      android:id="@+id/imageView5" 
      android:layout_row="1" 
      android:layout_column="2" 
      android:layout_marginLeft="15dp" 
      android:layout_marginTop="50dp" 
      android:onClick="gameLogic" 
      android:tag="5"/> 

     <ImageView 
      android:layout_width="90dp" 
      android:layout_height="90dp" 
      android:id="@+id/imageView6" 
      android:layout_row="2" 
      android:layout_column="0" 
      android:layout_marginLeft="0dp" 
      android:layout_marginTop="30dp" 
      android:onClick="gameLogic" 
      android:tag="6"/> 

     <ImageView 
      android:layout_width="90dp" 
      android:layout_height="90dp" 
      android:id="@+id/imageView7" 
      android:layout_row="2" 
      android:layout_column="1" 
      android:layout_marginTop="30dp" 
      android:layout_marginLeft="7dp" 
      android:onClick="gameLogic" 
      android:tag="7"/> 

     <ImageView 
      android:layout_width="90dp" 
      android:layout_height="90dp" 
      android:id="@+id/imageView8" 
      android:layout_row="2" 
      android:layout_column="2" 
      android:layout_marginLeft="15dp" 
      android:layout_marginTop="30dp" 
      android:onClick="gameLogic" 
      android:tag="8"/> 

    </GridLayout> 

    <LinearLayout 
     android:orientation="vertical" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerVertical="true" 
     android:layout_centerHorizontal="true" 
     android:background="#1eccd5" 
     android:padding="35dp" 
     android:id="@+id/winnerLayout"> 

     <TextView 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:textAppearance="?android:attr/textAppearanceLarge" 
      android:id="@+id/textView" 
      android:textColor="#FFFFFFFF" /> 

     <Button 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:text="Play Again" 
      android:id="@+id/button" 
      android:onClick="playAgain" /> 
    </LinearLayout> 

</RelativeLayout> 

Es zeigt wie dieses mit Android Studio:

Allerdings, wenn ich es auf mein Android-Handy zu exportieren, die Ausrichtung völlig ändert und aus Gittern, jemand in der Lage, mir zu helfen?

Answer 1

Ich denke, Sie sind neu in Android. Android verwendet die Abmessungen des Geräts, während view(screen) auf Ihrem Gerät erstellt wird. Android unterstützt verschiedene Dimensionen wie,

1. hdpi
2. xhdpi
3. xxhdpi
4. xxxhdpi usw.

Also für Ihren Fall, Android-System versuchen, alle Ansichten in absoluter Größe zu passen gegeben von dir.

Ich empfehle Verwendung wrap_content für width und height Ihrer Ansicht.

Sie können Ihr Layout-Datei wie unten ändern:

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout 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:paddingBottom="@dimen/activity_vertical_margin" 
       android:paddingLeft="@dimen/activity_horizontal_margin" 
       android:paddingRight="@dimen/activity_horizontal_margin" 
       android:paddingTop="@dimen/activity_vertical_margin" 
       app:layout_behavior="@string/appbar_scrolling_view_behavior"> 

    <GridLayout 
     android:id="@+id/gridLayout" 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_centerHorizontal="true" 
     android:layout_centerVertical="true" 
     android:columnCount="4" 
     android:rowCount="3"> 

     <ImageView 
      android:id="@+id/imageView0" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_column="0" 
      android:layout_row="0" 
      android:onClick="gameLogic" 
      android:padding="30dp" 
      android:src="@android:drawable/ic_menu_add" 
      android:tag="0"/> 

     <ImageView 
      android:id="@+id/imageView1" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_column="1" 
      android:layout_row="0" 
      android:onClick="gameLogic" 
      android:padding="30dp" 
      android:src="@android:drawable/ic_menu_add" 
      android:tag="1"/> 

     <ImageView 
      android:id="@+id/imageView2" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_column="2" 
      android:layout_row="0" 
      android:onClick="gameLogic" 
      android:padding="30dp" 
      android:src="@android:drawable/ic_menu_add" 
      android:tag="2"/> 

     <ImageView 
      android:id="@+id/imageView3" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_column="0" 
      android:layout_row="1" 
      android:onClick="gameLogic" 
      android:padding="30dp" 
      android:src="@android:drawable/ic_menu_add" 
      android:tag="3"/> 

     <ImageView 
      android:id="@+id/imageView4" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_column="1" 
      android:layout_row="1" 
      android:onClick="gameLogic" 
      android:padding="30dp" 
      android:src="@android:drawable/ic_menu_add" 
      android:tag="4"/> 

     <ImageView 
      android:id="@+id/imageView5" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_column="2" 
      android:layout_row="1" 
      android:onClick="gameLogic" 
      android:padding="30dp" 
      android:src="@android:drawable/ic_menu_add" 
      android:tag="5"/> 

     <ImageView 
      android:id="@+id/imageView6" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_column="0" 
      android:layout_row="2" 
      android:onClick="gameLogic" 
      android:padding="30dp" 
      android:src="@android:drawable/ic_menu_add" 
      android:tag="6"/> 

     <ImageView 
      android:id="@+id/imageView7" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_column="1" 
      android:layout_row="2" 
      android:onClick="gameLogic" 
      android:padding="30dp" 
      android:src="@android:drawable/ic_menu_add" 
      android:tag="7"/> 

     <ImageView 
      android:id="@+id/imageView8" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_column="2" 
      android:layout_row="2" 
      android:onClick="gameLogic" 
      android:padding="30dp" 
      android:src="@android:drawable/ic_menu_add" 
      android:tag="8"/> 

    </GridLayout> 

    <LinearLayout 
     android:id="@+id/winnerLayout" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerHorizontal="true" 
     android:layout_centerVertical="true" 
     android:background="#1eccd5" 
     android:orientation="vertical" 
     android:padding="35dp" 
     android:visibility="gone"> 

     <TextView 
      android:id="@+id/textView" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:textAppearance="?android:attr/textAppearanceLarge" 
      android:textColor="#FFFFFFFF"/> 

     <Button 
      android:id="@+id/button" 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:onClick="playAgain" 
      android:text="Play Again"/> 
    </LinearLayout> 

</RelativeLayout> 

Sie padding und src wie pro Ihre Anforderung ändern können.

Bitte Bild hinzufügen, wie Sie es wollen, wenn dies anders ist!

Weitere Informationen finden Sie unter link.

Answer 2

Add Polsterung in Ihrer Bildansicht

android:padding="10dp" 

Zum Beispiel:

<ImageView 
      android:layout_width="90dp" 
      android:layout_height="90dp" 
      android:id="@+id/imageView0" 
      android:layout_row="0" 
      android:layout_column="0" 
      android:padding="10dp" 
      android:onClick="gameLogic" 
      android:tag="0" 
      android:layout_marginLeft="0dp" 
      android:layout_marginTop="50dp" /> 

Dies wird Ihr Problem lösen.

Answer 3

• Ändern Sie GridLayout zu android.support.v7.widget.Gridlayout

• hinzufügen

  app:columnCount="3" 
  app:rowCount="3" 
  

  zu Gridview

• Auf Image Verwendung

  app:layout_columnWeight="1" 
  app:layout_rowWeight="1" 
  

statt

android:layout_width="90dp" 
    android:layout_height="90dp" 

XML-Datei wird so aussehen,

<android.support.v7.widget.GridLayout 
    xmlns:app="http://schemas.android.com/apk/res-auto" 
    android:layout_width="match_parent" 
    android:layout_height="500dp" 
    app:columnCount="3" 
    app:orientation="horizontal" 
    app:rowCount="3" 
    app:useDefaultMargins="true"> 

     <ImageView 
      app:layout_columnWeight="1" 
      app:layout_rowWeight="1" 
      android:id="@+id/imageView0" 
      android:tag="0" 
      android:background="#ff0000" /> 

     <ImageView 
      app:layout_columnWeight="1" 
      app:layout_rowWeight="1" 
      android:id="@+id/imageView1" 
      android:onClick="gameLogic" 
      android:tag="1" 
      android:background="#ff0000"/> 

     <ImageView 
      app:layout_columnWeight="1" 
      app:layout_rowWeight="1" 
      android:id="@+id/imageView2" 
      android:background="#ff0000" 
      android:onClick="gameLogic" 
      android:tag="2" /> 

     <ImageView 
      app:layout_columnWeight="1" 
      app:layout_rowWeight="1" 
      android:id="@+id/imageView3" 
      android:background="#ff0000" 
      android:onClick="gameLogic" 
      android:tag="3"/> 

     <ImageView 
      app:layout_columnWeight="1" 
      app:layout_rowWeight="1" 
      android:id="@+id/imageView4" 
      android:background="#ff0000" 
      android:onClick="gameLogic" 
      android:tag="4"/> 

     <ImageView 
      app:layout_columnWeight="1" 
      app:layout_rowWeight="1" 
      android:id="@+id/imageView5" 
      android:background="#ff0000" 
      android:onClick="gameLogic" 
      android:tag="5"/> 

     <ImageView 
      app:layout_columnWeight="1" 
      app:layout_rowWeight="1" 
      android:id="@+id/imageView6" 
      android:background="#ff0000" 
      android:onClick="gameLogic" 
      android:tag="6"/> 

     <ImageView 
      app:layout_columnWeight="1" 
      app:layout_rowWeight="1" 
      android:id="@+id/imageView7" 
      android:background="#ff0000" 
      android:onClick="gameLogic" 
      android:tag="7"/> 

     <ImageView 
      app:layout_columnWeight="1" 
      app:layout_rowWeight="1" 
      android:id="@+id/imageView8" 
      android:background="#ff0000" 
      android:onClick="gameLogic" 
      android:tag="8"/> 

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