Android 布局与设备不匹配 [Android Studio]

标签 android android-layout android-constraintlayout

您好，我刚开始使用 android studio，我不明白为什么我在 IDE 预览中看到的布局与我在屏幕上看到的布局不匹配。我使用的是三星 J7 Prime。

这是我在预览中看到的

This is what I see in the preview

然而，这是我在我的设备上看到的。

this is what I see on my device.

请帮忙，提前谢谢。

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.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"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="65dp"
        android:layout_marginEnd="32dp"
        android:text="@string/original_price"
        app:layout_constraintBaseline_toBaselineOf="@+id/etNum1"
        app:layout_constraintEnd_toStartOf="@+id/etNum1"
        app:layout_constraintStart_toStartOf="parent" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="72dp"
        android:layout_marginTop="6dp"
        android:layout_marginEnd="60dp"
        android:text="@string/rate"
        app:layout_constraintEnd_toStartOf="@+id/etNum2"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/etNum2" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="65dp"
        android:layout_marginEnd="61dp"
        android:text="@string/discount"
        app:layout_constraintEnd_toStartOf="@+id/etNum3"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/etNum3" />

    <TextView
        android:id="@+id/textView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="65dp"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="46dp"
        android:text="@string/sales_price"
        app:layout_constraintEnd_toStartOf="@+id/etNum4"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="@+id/etNum4" />

    <EditText
        android:id="@+id/etNum1"
        android:layout_width="0dp"
        android:layout_height="39dp"
        android:layout_marginTop="101dp"
        android:layout_marginEnd="75dp"
        android:autofillHints=""
        android:ems="10"
        android:inputType="number"
        android:labelFor="@id/etNum1"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/textView"
        app:layout_constraintTop_toTopOf="parent" />

    <EditText
        android:id="@+id/etNum2"
        android:layout_width="0dp"
        android:layout_height="37dp"
        android:layout_marginTop="79dp"
        android:layout_marginEnd="72dp"
        android:layout_marginBottom="80dp"
        android:autofillHints=""
        android:ems="10"
        android:inputType="number"
        android:labelFor="@id/etNum2"
        app:layout_constraintBottom_toBottomOf="@+id/etNum3"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/textView2"
        app:layout_constraintTop_toTopOf="@+id/textView" />

    <EditText
        android:id="@+id/etNum3"
        android:layout_width="0dp"
        android:layout_height="34dp"
        android:layout_marginTop="143dp"
        android:layout_marginEnd="76dp"
        android:layout_marginBottom="143dp"
        android:autofillHints=""
        android:ems="10"
        android:inputType="number"
        android:labelFor="@id/etNum3"
        app:layout_constraintBottom_toTopOf="@+id/calculate"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/textView3"
        app:layout_constraintTop_toBottomOf="@+id/textView"
        android:editable="false"/>

    <EditText
        android:id="@+id/etNum4"
        android:layout_width="0dp"
        android:layout_height="39dp"
        android:layout_marginTop="47dp"
        android:layout_marginEnd="72dp"
        android:autofillHints=""
        android:ems="10"
        android:inputType="number"
        android:labelFor="@id/etNum4"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/textView4"
        app:layout_constraintTop_toBottomOf="@+id/etNum3"
        android:editable="false"/>

    <Button
        android:id="@+id/calculate"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="14dp"
        android:layout_marginBottom="229dp"
        android:text="@string/compute"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toEndOf="@+id/textView4" />

    <Button
        android:id="@+id/clear"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="29dp"
        android:text="@string/erase"
        app:layout_constraintStart_toStartOf="@+id/calculate"
        app:layout_constraintTop_toBottomOf="@+id/calculate" />

</android.support.constraint.ConstraintLayout>

最佳答案

您在很多地方使用固定大小的 View (例如 android:layout_marginTop="79dp" 和 android:layout_height="37dp") .

  • 因为不同的手机有不同的屏幕尺寸，当您在 View 上使用固定尺寸时，您的布局会降低响应速度。

  • 如果您想在屏幕的任何位置放置一些 View ，我建议您使用 guielines并将您的 View 限制在指南中，而不是为您的 View 提供固定大小值以适合预览(不要忘记，对于固定大小，适合一个屏幕的内容可能不适合另一个屏幕)。

  • 对于您想要的布局，您可以简单地使用 chains .

这是您希望使用 cnostraintLayout 和链实现的布局示例:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 
  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">

<TextView
    android:id="@+id/textView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/original_price"
    app:layout_constraintBottom_toTopOf="@+id/textView2"
    app:layout_constraintEnd_toStartOf="@+id/etNum1"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<TextView
    android:id="@+id/textView2"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="@string/rate"
    app:layout_constraintBottom_toTopOf="@+id/textView3"
    app:layout_constraintEnd_toEndOf="@+id/textView"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@+id/textView"
    app:layout_constraintTop_toBottomOf="@+id/textView" />

<TextView
    android:id="@+id/textView3"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="@string/discount"
    app:layout_constraintBottom_toTopOf="@+id/textView4"
    app:layout_constraintEnd_toEndOf="@+id/textView"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@+id/textView"
    app:layout_constraintTop_toBottomOf="@+id/textView2" />

<TextView
    android:id="@+id/textView4"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="@string/sales_price"
    app:layout_constraintBottom_toTopOf="@+id/calculate"
    app:layout_constraintEnd_toEndOf="@+id/textView"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@+id/textView"
    app:layout_constraintTop_toBottomOf="@+id/textView3" />

<EditText
    android:id="@+id/etNum1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:autofillHints=""
    android:ems="10"
    android:inputType="number"
    android:labelFor="@id/etNum1"
    app:layout_constraintBottom_toBottomOf="@+id/textView"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toEndOf="@+id/textView"
    app:layout_constraintTop_toTopOf="@+id/textView" />

<EditText
    android:id="@+id/etNum2"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:autofillHints=""
    android:ems="10"
    android:inputType="number"
    android:labelFor="@id/etNum2"
    app:layout_constraintBottom_toBottomOf="@+id/textView2"
    app:layout_constraintEnd_toEndOf="@+id/etNum1"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@+id/etNum1"
    app:layout_constraintTop_toTopOf="@+id/textView2" />

<EditText
    android:id="@+id/etNum3"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:autofillHints=""
    android:editable="false"
    android:ems="10"
    android:inputType="number"
    android:labelFor="@id/etNum3"
    app:layout_constraintBottom_toBottomOf="@+id/textView3"
    app:layout_constraintEnd_toEndOf="@+id/etNum1"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@+id/etNum1"
    app:layout_constraintTop_toTopOf="@+id/textView3" />

<EditText
    android:id="@+id/etNum4"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:autofillHints=""
    android:editable="false"
    android:ems="10"
    android:inputType="number"
    android:labelFor="@id/etNum4"
    app:layout_constraintBottom_toBottomOf="@+id/textView4"
    app:layout_constraintEnd_toEndOf="@+id/etNum1"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@+id/etNum1"
    app:layout_constraintTop_toTopOf="@+id/textView4" />

<Button
    android:id="@+id/calculate"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"

    android:text="compute"
    app:layout_constraintBottom_toTopOf="@+id/clear"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/textView4" />

<Button
    android:id="@+id/clear"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:text="erase"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="@+id/calculate"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintStart_toStartOf="@+id/calculate"
    app:layout_constraintTop_toBottomOf="@+id/calculate" />

</android.support.constraint.ConstraintLayout>

它看起来像这样:

enter image description here

关于Android 布局与设备不匹配 [Android Studio]，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/56111358/

上一篇：java - 如何创建一个带有默认注释的抽象类？

下一篇：android - 如何禁用奖励视频显示/播放的后退按钮？

相关文章：

java - keystore 未初始化异常

android - 为什么 wrap_content 是填充高度？

java - 在 Android 中通过 SSL 使用 WCF 服务

android - Google Cloud Messaging错误: Unable to instantiate receiver

android - 为动态内容保持 ScrollView 滚动位置

android - 淡入淡出动画闪烁 - Android

android - 使用合并标记时，复合 View 不可见

android - ConstraintLayout 通知徽章

android-constraintlayout - 约束布局 : Defining Seekbar height with respect to other fields

android - 在 View 检查器中更新边距值对布局没有影响

©2024 IT工具网  联系我们