如何使Android UI在每个屏幕上看起来完全一样?

时间:2019-03-27 14:27:49

标签: android android-layout user-interface

我目前正在从事Android应用程序开发。我编写了一个在Android Simulator中看起来很完美的UI代码,但是当同一应用在我的Android智能手机上运行时,UI会失真。

我尝试了包括LinearLayout,Relative Layout和Constraint Layout在内的布局,但结果差别不大。

<?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"
    android:background="@drawable/gradient"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <TextView
        android:id="@+id/Heading"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fontFamily="sans-serif-smallcaps"
        android:gravity="center_horizontal"
        android:includeFontPadding="true"
        android:paddingTop="10sp"
        android:paddingBottom="10sp"
        android:text="PHYSICS"
        android:textColor="#FFFFFF"
        android:textSize="30dp"
        android:textStyle="bold"
        android:verticalScrollbarPosition="defaultPosition" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="460sp"
        android:background="#FFFFFF"
        android:orientation="vertical">

        <Button
            android:id="@+id/button4"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Mechanics" />

        <Button
            android:id="@+id/button5"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Oscillations and Waves" />

        <Button
            android:id="@+id/button6"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Thermodynamics" />

        <Button
            android:id="@+id/button3"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Solid States" />
    </LinearLayout>

</LinearLayout>

当屏幕尺寸为4英寸或5英寸时,要使每个Android屏幕上的UI看起来都相同,我需要做什么?

模拟器上的原始用户界面 Original UI on Emulator

这就是我的智能手机上显示的内容 This is what it appears on my Smartphone

2 个答案:

答案 0 :(得分:1)

在布局中,您使用 sp 填充和高度,使用 dp 设置textSize。您应该将 dp 用于填充和高度(视图尺寸),将 sp 用于textSize。

答案 1 :(得分:0)

尝试使用DP而不是SP。 SP受Android用户的字体首选项影响,这可能使其看起来有所不同。