[英]Why Android app looks different in some phones
我有一个 Android 应用程序,在大多数手机中它看起来都想要。 像这样:
但在某些手机中,文本看起来太大,一切都失去了比例。 像这样:
我的 xml 文件之一是这样的:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
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="independent.dev.ui.Activities.WheelActivity"
android:background="@drawable/wheel_background"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_horizontal">
<ImageView
android:layout_width="80dp"
android:layout_height="80dp"
android:background="@drawable/wheel_icon" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25sp"
android:text="Convertidor de graduación"
android:layout_gravity="center"
android:textColor="@color/white"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:gravity="center_horizontal"
android:layout_marginHorizontal="30dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="vertical"
android:gravity="center"
android:layout_weight="1">
<ImageView
android:layout_width="100dp"
android:layout_height="65dp"
android:background="@drawable/isotype_green"
android:layout_marginTop="50dp"
android:layout_centerHorizontal="true"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:gravity="center_horizontal"
android:layout_marginTop="50dp"
android:layout_alignParentBottom="true">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="@string/wheelOriginalScale"
android:fontFamily="@font/helvetica"
android:textSize="24sp"
android:textColor="@color/white"
android:layout_weight="1"
android:textAlignment="center"/>
<View
android:layout_width="2dp"
android:layout_height="match_parent"
android:background="@color/white"/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="@string/wheelGrades"
android:textAlignment="center"
android:fontFamily="@font/helveticabold"
android:textSize="28sp"
android:textColor="@color/white"
android:layout_weight="1"
android:layout_gravity="center"/>
<View
android:layout_width="2dp"
android:layout_height="match_parent"
android:background="@color/white"/>
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:text="@string/wheelObjectiveScale"
android:textAlignment="center"
android:fontFamily="@font/helvetica"
android:textSize="24sp"
android:textColor="@color/white"
android:layout_weight="1"/>
</LinearLayout>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:orientation="horizontal"
android:gravity="center_vertical"
android:layout_weight="0.8">
<com.aigestudio.wheelpicker.WheelPicker
android:id="@+id/wOriginalScale"
android:layout_width="0dp"
android:layout_height="180dp"
android:layout_weight="1"
android:fontFamily="@font/helveticabold"/>
<com.aigestudio.wheelpicker.WheelPicker
android:id="@+id/wGrades"
android:layout_width="0dp"
android:layout_height="180dp"
android:layout_weight="1"
android:fontFamily="@font/helveticabold"/>
<com.aigestudio.wheelpicker.WheelPicker
android:id="@+id/wObjectiveScale"
android:layout_width="0dp"
android:layout_height="180dp"
android:layout_weight="1"
android:fontFamily="@font/helveticabold"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="0dp"
android:orientation="horizontal"
android:layout_weight="0.7">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="@drawable/view_border"
android:paddingHorizontal="20dp"
android:layout_gravity="center">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="@font/helveticabold"
android:text="Resultado: "
android:textColor="@color/appGreen"
android:textSize="30sp" />
<TextView
android:id="@+id/tvResult"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="30sp"
android:text="5.4"
android:textColor="@color/white"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
我不知道为什么会发生这种情况。 在应用程序开始时,在那些现在看起来很奇怪的手机中,该应用程序崩溃了,因为我使用的图像太大,所以我创建了“drawable-xxhdpi”文件夹,将图片移到那里,现在应用程序没有崩溃,但它看起来像这样。 关于可能发生什么的任何想法??? 非常感谢!
为了解决这个问题,你应该使用 ConstraintLayout 而不是 LinearLayout
请尝试了解约束布局并阅读以下链接
https://developer.android.com/training/multiscreen/screensizes
Android App UI 在不同设备上的外观可能会有所不同,因为所有 Android 设备的屏幕高度和宽度都不相同。 该应用程序可能在大屏幕设备上看起来很完美,而在小屏幕设备上看起来更大。 为了纠正这个错误,我使用 layoutweight 和 weightsum 以固定比例来设置我的屏幕,以便它在所有设备中保持相同的比例。 我还使用 sdp 和 ssp 库使我的文本和可绘制对象在不同设备中具有相似的大小。
这是使用 sdp 构建的单个布局: sdp 布局示例
这是使用 dp 构建的布局示例; 通常的 dp 布局示例查看这个 android 库,它有助于在不同设备中提供足够的布局比例。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.