Unterschiede zwischen Android Studio Vorschau und Telefon

Question

Ich habe ein Image 'neura_bar_img' und zwei Textviews auf sein Recht genannt:

Der XML-Code:

<android.support.v7.widget.CardView 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:id="@+id/summaryCard" 
    android:layout_below="@+id/topCard" 
    android:layout_alignParentLeft="true" 
    android:layout_alignParentStart="true" 
    app:layout_heightPercent="25%" 
    app:layout_marginTopPercent="3%" 
    > 

    <RelativeLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:paddingTop="3dp" 
     android:paddingBottom="3dp"> 

     <RelativeLayout 
      android:layout_width="wrap_content" 
      android:layout_height="wrap_content" 
      android:layout_centerHorizontal="true"> 
      <ImageView 
       android:layout_width="270dp" 
       android:layout_height="113dp" 
       android:id="@+id/neura_bar_img" 
       android:src="@drawable/detailed_daily_sum" 
       android:layout_centerVertical="true" /> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:layout_alignTop="@id/neura_bar_img" 
       android:layout_alignBottom="@id/neura_bar_img" 
       android:layout_alignLeft="@id/neura_bar_img" 
       android:layout_alignRight="@id/neura_bar_img" 
       android:gravity="center" 
       android:id="@+id/detailed_goal_text" 
       android:textStyle="italic" 
       android:text="0" 
       android:textSize="30sp" 
       android:textColor="@color/graphicsBlue"/> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:id="@+id/detailed_bites_eaten_text" 
       android:layout_alignTop="@id/neura_bar_img" 
       android:layout_alignBottom="@id/neura_bar_img" 
       android:layout_alignLeft="@id/neura_bar_img" 
       android:layout_alignRight="@id/neura_bar_img" 
       android:gravity="center" 
       android:layout_marginRight="170dp" 
       android:layout_marginTop="10dp" 
       android:textStyle="bold|italic" 
       android:text="0" 
       android:textSize="45sp" /> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:id="@+id/sports_part_text" 
       android:layout_alignTop="@id/neura_bar_img" 
       android:layout_alignBottom="@id/neura_bar_img" 
       android:gravity="center" 
       android:layout_marginTop="58dp" 
       android:layout_marginLeft="0dp" 
       android:layout_toRightOf="@+id/neura_bar_img" 
       android:text="---" 
       android:textSize="30sp" 
       android:textColor="@color/graphicsOrange"/> 

      <TextView 
       android:layout_width="wrap_content" 
       android:layout_height="wrap_content" 
       android:id="@+id/bites_part_text" 
       android:layout_alignTop="@id/neura_bar_img" 
       android:layout_alignBottom="@id/neura_bar_img" 
       android:gravity="center" 
       android:layout_marginBottom="54dp" 
       android:layout_marginLeft="0dp" 
       android:layout_toRightOf="@+id/neura_bar_img" 
       android:text="0" 
       android:textSize="30sp" 
       android:textColor="@color/graphicsGrey"/> 
     </RelativeLayout> 
    </RelativeLayout> 
</android.support.v7.widget.CardView> 

Auf Vorschau Android Studio es sieht gut aus. Auf manchen Geräten gibt es jedoch eine Lücke zwischen der ImageView und der Textansicht. Hier ein Beispiel:

• Dieses Bild wird von LG G3 zum Beispiel genommen wurde, aber ich sah das gleiche Problem auf Moto G

Ich habe keine Ahnung, warum dies geschieht, und habe keine ähnlichen Fälle online gefunden.

Vielen Dank im Voraus!

Answer 1

Ihre imageView fehlt das scaleType Attribut, das standardmäßig als fitcenter gesetzt und ist damit auf dem Gerät abhängig, versuchen diese

<ImageView 
    android:id="@+id/ZKt_qF_kgP" 
    android:layout_width="270dp" 
    android:layout_height="113dp" 
    android:src="@drawable/neura_bar_img" 
    android:layout_centerVertical="true" 
    android:scaleType="fitXY" 
      /> 

auch andere android hat oft verschiedene Bildschirm Metriken:

LG 3: 480dp x 835dp
Moto G: 360dp x 640dp
Nexus 4 (Standard Android Studio Vorschau in meinem Fall): 384dp x 640dp
Sehen Sie diese table für weitere Geräte Metriken.

, wenn Sie Ihre Anwendung für die drei Geräte einzustellen oben ein Layout für jede Metrik angeben müssen (hier Breite) in den entsprechenden Ordnern:

layout-sw360dplayout-sw480dplayout-sw384dp

Answer 2

Nun, es ist wahrscheinlich die Art des Layouts, das Sie verwenden.

Bildschirmdichten sind unterschiedlich, einige der von Ihnen verwendeten Werte (px, dp usw.) sehen auf verschiedenen Geräten möglicherweise nicht gleich aus.

Ich benutze fast immer das LinearLayout wegen der Tatsache, dass ich das Attribut "Gewicht" verwenden kann.

Ich weiß nicht, ob dies die Antwort, die Sie suchen, aber ich habe versucht: D