模拟器上的布局与 android studio 预览不同

Question

所以，我运行我的应用在 nexus 5(1080x1920, dpi:480) 和 nexus 6P(1440x2560, dpi:560) 模拟器上。我用这个提供的公式来计算最小宽度（sw）。

连结 5：1080/(480/160) = 360。连结 6P：1440/(560/160) = 411.

问题 1： 我为这两款手机创建了标准的 sw320 布局。 nexus 5 上的其中一张图像比预览和 6P 的尺寸显着减小，所有其他图像看起来都很好。

已显示预览 here, nexus 6P shown here, nexus 5 shown here。

此外，我注意到当我在 android 工作室预览中围绕信号条图像移动时，图像会改变大小。

问题 2： 我创建了显示的不同 sw 布局 here. However, the default layout preview is all messed up now, shown here. Before, I added all the sw layouts, it look like this。

问题一：两部手机画质差异巨大的原因是什么？

问题 2：在 android studio 预览中，图像在拖动时会改变大小是什么原因？

问题 3：即使我没有更改该文件中的任何代码，默认布局还是乱七八糟的原因是什么？

使用 xml 代码更新：

<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:background="@drawable/joystick_background"
tools:context="com.example.android.toybot.JoyStickActivity">

<RelativeLayout
    android:id="@+id/relativeLayout"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"

    android:layout_weight="0.5"

    android:layout_marginTop="70dp"
    android:layout_alignParentTop="true"
    android:layout_centerHorizontal="true">

    <ImageView
        android:id="@+id/imageView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginEnd="11dp"
        android:layout_below="@+id/exit_switch_id"

        android:scaleX="0.5"
        android:scaleY="0.5"
        android:layout_marginTop="1dp"
        android:layout_marginLeft="30dp"
        android:src="@drawable/text_exit"/>


    <ImageView
        android:id="@+id/imageView8"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleX="0.5"
        android:scaleY="0.5"
        android:src="@drawable/text_turbo"
        android:layout_alignTop="@+id/imageView4"
        android:layout_toEndOf="@+id/exit_switch_id"
        android:layout_alignBottom="@+id/imageView4" />

    <Switch
        android:id="@+id/exit_switch_id"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:rotation="90"
        android:scaleX="0.8"
        android:scaleY="0.8"
        android:thumb="@drawable/joystick_hat"
        android:track="@drawable/joystick_lever_switch"
        android:layout_alignBaseline="@+id/turbo_switch_id"
        android:layout_alignBottom="@+id/turbo_switch_id"
        android:layout_alignParentStart="true"
        android:layout_marginStart="14dp" />

    <Switch
        android:id="@+id/turbo_switch_id"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="14dp"
        android:rotation="90"
        android:scaleX="0.8"
        android:scaleY="0.8"
        android:thumb="@drawable/joystick_hat"
        android:track="@drawable/joystick_lever_switch"
        android:layout_alignParentTop="true"
        android:layout_toEndOf="@+id/exit_switch_id" />

</RelativeLayout>

<LinearLayout
    android:id="@+id/linearLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:layout_alignParentBottom="true"
    android:layout_alignParentStart="true">

    <com.example.android.toybot.JoyStickView
        android:id="@+id/joystickLeft"
        android:layout_width="wrap_content"
        android:layout_height="200dp"
        android:layout_alignParentStart="true"
        android:layout_weight="0.5" />


    <com.example.android.toybot.JoyStickView
        android:id="@+id/joystickRight"
        android:layout_width="wrap_content"
        android:layout_height="200dp"
        android:layout_weight="0.5" />

</LinearLayout>

<LinearLayout
    android:id="@+id/linearLayout3"
    android:layout_width="100dp"
    android:layout_height="wrap_content"
    android:layout_weight="0.5"
    android:orientation="horizontal"
    android:layout_above="@+id/linearLayout4"
    android:layout_alignParentStart="true">

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="RM:" />

    <TextView
        android:id="@+id/x_coo"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="x_coo" />

</LinearLayout>

<LinearLayout
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:id="@+id/linearLayout5"
    android:layout_above="@+id/linearLayout3"
    android:layout_alignParentStart="true">

    <TextView
        android:id="@+id/textview6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"

        android:layout_alignBaseline="@+id/dir_view"
        android:layout_alignBottom="@+id/dir_view"
        android:layout_marginEnd="15dp"
        android:layout_toStartOf="@+id/dir_view"
        android:layout_weight="0.04"
        android:text="Direction:" />

    <TextView
        android:id="@+id/dir_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_above="@+id/linearLayout3"
        android:layout_marginStart="15dp"
        android:layout_toEndOf="@+id/linearLayout2"
        android:layout_weight="0.01"
        android:text="TextView" />
</LinearLayout>

<LinearLayout
    android:layout_width="100dp"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:id="@+id/linearLayout4"
    android:layout_above="@+id/linearLayout"
    android:layout_alignParentStart="true"
    android:layout_marginBottom="17dp">

    <TextView
        android:id="@+id/ly_id"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="LM:" />

    <TextView
        android:id="@+id/ly_id_display"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:text="left_y_coo" />

</LinearLayout>

<TextView
    android:id="@+id/RSSI_id"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/linearLayout5"
    android:layout_alignEnd="@+id/linearLayout3"
    android:layout_marginBottom="14dp"
    android:text="rssi value" />

<FrameLayout
    android:id="@+id/singal_bar_layout"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginBottom="17dp"
    android:layout_above="@+id/RSSI_id"
    android:layout_alignParentEnd="true">


    <ImageView
        android:scaleX="0.8"
        android:scaleY="0.8"
        android:id="@+id/signal_bar_0"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:visibility="visible"
        android:src="@drawable/signal_bars0_01" />

    <ImageView
        android:scaleX="0.8"
        android:scaleY="0.8"
        android:id="@+id/signal_bar_1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/signal_bars1_01"
        android:visibility="invisible" />

    <ImageView
        android:scaleX="0.8"
        android:scaleY="0.8"
        android:id="@+id/signal_bar_2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/signal_bars2_01"
        android:visibility="invisible" />

    <ImageView
        android:scaleX="0.8"
        android:scaleY="0.8"
        android:id="@+id/signal_bar_3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/signal_bars3_01"
        android:visibility="invisible" />

    <ImageView
        android:id="@+id/signal_bar_4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:scaleX="0.8"
        android:scaleY="0.8"
        android:src="@drawable/signal_bars4_01"
        android:visibility="invisible" />

</FrameLayout>

Answer 1

为了解决我的问题 1，我没有创建可绘制文件，而是创建了 mipmap 文件，这样，图像只保持一种尺寸，这对我来说很有效。

问题2，之前的之所以乱七八糟，是因为编辑器中的设备是在apple watch视图中，而不是真正的phone视图，它只是一个正方形。

模拟器上的布局与 android studio 预览不同

layout is different on the emulator than android studio preview

android

android-layout

screen-size