模拟器预览与实际设备不一样

Question

我做了一个简单的布局，其中有一个 ImageView 和两个 Buttons。

预览图布局如下：

Layout as shown in android studio preview

我运行我为 Lg3（5.5"，1440x2560）创建的模拟器，我得到了以下结果（好结果就像我设计的一样）

Emulator result

但是，当我真正下载apk到真实的Lg3设备时，结果如下：

Actual result

我尝试使用 layout-normal、layout-small、layout-large 但是 none 有效。

.xml 看起来如下：

<?xml version="1.0" encoding="utf-8"?>
<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:background="@color/White"
    tools:context=".MainActivity">

<ImageView
    android:id="@+id/main_background"
    android:layout_width="230dp"
    android:layout_height="230dp"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="115dp"
    android:src="@drawable/main_background" />

<Button
    android:id="@+id/Sign_In"
    android:layout_width="match_parent"
    android:layout_height="60dp"
    android:layout_marginLeft="30dp"
    android:layout_marginRight="30dp"
    android:layout_marginTop="160dp"
    android:layout_below="@+id/main_background"
    android:layout_centerInParent="true"
    android:background="@drawable/white_buttons"
    android:fontFamily="@font/assistant"
    android:text="Sign In"
    android:textAllCaps="false"
    android:textColor="@color/Fonts"
    android:textSize="20dp" />

<Button
    android:id="@+id/Sign_Up"
    android:layout_width="match_parent"
    android:layout_height="60dp"
    android:layout_below="@+id/Sign_In"
    android:layout_centerInParent="true"
    android:layout_marginTop="20dp"
    android:layout_marginLeft="30dp"
    android:layout_marginRight="30dp"
    android:background="@drawable/colored_buttons"
    android:fontFamily="@font/assistant"
    android:text="Sign Up"
    android:textAllCaps="false"
    android:textColor="@color/White"
    android:textSize="20dp" />

</RelativeLayout>

我想知道我是否做错了什么导致模拟器和真实设备之间的结果不相等。

非常感谢

Answer 1

如CommonsWare所述-可能是因为屏幕密度不同。

我建议您使用 ConstraintLayout 为所有屏幕尺寸开发一种布局。

来自文档：

ConstraintLayout allows you to create large and complex layouts with a flat view hierarchy (no nested view groups). It's similar to RelativeLayout in that all views are laid out according to relationships between sibling views and the parent layout, but it's more flexible than RelativeLayout and easier to use with Android Studio's Layout Editor.

这是一个使用 ConstraintLayout 而不使用 fixed-sized 值的示例：

<androidx.constraintlayout.widget.ConstraintLayout 
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:background="@null"
  tools:context=".MainActivity">


<Button
    android:id="@+id/button"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:text="Button"
    app:layout_constraintHeight_percent="0.1"
    app:layout_constraintBottom_toTopOf="@+id/button2"
    app:layout_constraintEnd_toEndOf="@+id/button2"
    app:layout_constraintStart_toStartOf="@+id/button2" />

<Button
    android:id="@+id/button2"
    android:layout_width="0dp"
    android:layout_height="0dp"
    android:layout_marginStart="8dp"
    android:layout_marginEnd="8dp"
    android:layout_marginBottom="8dp"
    android:text="Button"
    app:layout_constraintHeight_percent="0.1"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent" />

<ImageView
    android:id="@+id/imageView"
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintBottom_toTopOf="@+id/button"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintWidth_percent="0.5"
    app:layout_constraintHeight_percent="0.5"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    tools:srcCompat="@tools:sample/avatars[14]" />
</androidx.constraintlayout.widget.ConstraintLayout>

看起来像这样：

有关 ConstraintLayout 的更多信息，您还可以 guidelines and Chains 支持不同的屏幕尺寸。

模拟器预览与实际设备不一样

Emulator preview is not same to actual device

layout

android

android-emulator

android-relativelayout