在某些设备上使用应用程序时，应用程序的 UI 失真

Question

在生成签名的 apk 并在几部手机上测试该应用程序后，我注意到 UI 在某些手机上失真。我测试过的手机是

1) Xiaomi Note 5 Pro [ Android 9 ]  [ works fine ] [ my phone ]  
2) Xiaomi Note 5 Pro [ Android 9 ]  [ distorted ]  
3) Xiaomi Note 5 Pro [ Android 9 ]  [ works fine ]
3) Lenovo k8 plus    [ Android 8 ]  [ works fine ] 
4) Xiaomi Note 7 Pro [ Android 10 ] [ distorted ] 
5) Samsung Galaxy    [ Android 11 ] [ distorted ]
   Fold 
6) Xiaomi Note 9     [ Android 9 ]  [ works fine ]
7) Poco X2           [ Android 10 ] [ distorted ]
9) Nokia 3           [ Android 9 ]  [ works fine ]

我不知道为什么它会在某些 Android 9 上失真，但不是全部。在 Studio 中测试应用程序时，我使用 Android 9 和 11 作为虚拟设备。我在下面添加了图片，左边是扭曲的，右边是它应该是的。

[1]：失真：https://imgur.com/evctImq [2]：普通视图：https://imgur.com/76lMZDf

MainActivity 中的代码

package com.example.kaish;

import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
import androidx.constraintlayout.widget.ConstraintLayout;
import android.content.Intent;
import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.view.WindowManager;
import android.widget.Button;
import android.widget.ImageView;

public class MainActivity extends AppCompatActivity  {
    Button Sad;
    Button Happy;
    Button Angry;
    Button Tired;
    Button Irritated;
    Button Idk;
    Button FS;
    Button anime;
    Button other;
    ImageView path, rev, caustic, valk, bangalore, octane;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        //for gradient background animation
        ConstraintLayout constraintLayout = findViewById(R.id.M_layout);
        AnimationDrawable animationDrawable = (AnimationDrawable) constraintLayout.getBackground();
        animationDrawable.setEnterFadeDuration(2000);
        animationDrawable.setExitFadeDuration(4000);
        animationDrawable.start();

        anime = findViewById(R.id.anime_List);
        anime.setOnClickListener(v -> openAnime());

        valk = findViewById(R.id.sad_valk);
        valk.setOnClickListener(v -> openSad());

        bangalore = findViewById(R.id.bangalore_idk);
        bangalore.setOnClickListener(v -> openIdk());

        octane = findViewById(R.id.tired_octane);
        octane.setOnClickListener(v -> openTired());

        caustic = findViewById(R.id.caus_irri);
        caustic.setOnClickListener(v -> openIrritated());

        rev = findViewById(R.id.angry_rev);
        rev.setOnClickListener(v -> openAngry());

        path = findViewById(R.id.happy_lifeline);
        path.setOnClickListener(v -> openHappy());

        getWindow().setFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS,WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS);

        other = findViewById(R.id.other);
        other.setOnClickListener(v -> openOther());

        FS = findViewById(R.id.FS);
        FS.setOnClickListener(v -> openFS());

        Sad = findViewById(R.id.sad);
        Sad.setOnClickListener(v -> openSad());

        Happy = findViewById(R.id.happy);
        Happy.setOnClickListener(v -> openHappy());

        Angry = findViewById(R.id.angry);
        Angry.setOnClickListener(v -> openAngry());

        Tired = findViewById(R.id.tired);
        Tired.setOnClickListener(v -> openTired());

        Irritated = findViewById(R.id.irritated);
        Irritated.setOnClickListener(v -> openIrritated());

        Idk = findViewById(R.id.idk);
        Idk.setOnClickListener(v -> openIdk());


    }

    public void openAnime()
    {
        Intent intent = new Intent(this, anime.class);
        startActivity(intent);
    }

    public void openFS()
    {
        Intent intent = new Intent(this, FS.class);
        startActivity(intent);
    }
    public void openOther()
    {
     Intent intent = new Intent(this, other.class);
     startActivity(intent);
    }

    public void openSad()
    {
        Intent intent = new Intent(this, Sad.class);
        startActivity(intent);
    }
    public void openHappy()
    {
        Intent intent = new Intent(this, happy.class);
        startActivity(intent);
    }
    public void openAngry()
    {
        Intent intent = new Intent(this, angry.class);
        startActivity(intent);
    }
    public void openTired()
    {
        Intent intent = new Intent(this, tired.class);
        startActivity(intent);
    }
    public void openIrritated()
    {
        Intent intent = new Intent(this, irritated.class);
        startActivity(intent);
    }
    public void openIdk()
    {
        Intent intent = new Intent(this, idk.class);
        startActivity(intent);
    }
}

我希望得到一些建议，任何建议都将不胜感激，因为我不知道为什么会发生这种情况。

主要活动的xml

<?xml version="1.0" encoding="utf-8"?>
<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:id="@+id/M_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/gradient_background_list"
    tools:context=".MainActivity">


    <Button
        android:id="@+id/angry"
        android:layout_width="100dp"
        android:layout_height="30dp"
        android:background="@drawable/buttonsad_background"
        android:fontFamily="@font/cairo_semibold"
        android:text="Angry"
        android:textAllCaps="false"
        android:textSize="16sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.237"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.545" />

    <ImageView
        android:id="@+id/happy_lifeline"
        android:layout_width="102dp"
        android:layout_height="124dp"
        android:src="@drawable/lifeline_happy"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.239"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.186" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:fontFamily="@font/cairo_semibold"
        android:text="Hello kai !!"
        android:textColor="#ffffff"
        android:textSize="23sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="@+id/textView4"
        app:layout_constraintHorizontal_bias="0.496"
        app:layout_constraintStart_toStartOf="@+id/textView4"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.037" />

    <ImageView
        android:id="@+id/caus_irri"
        android:layout_width="105dp"
        android:layout_height="131dp"

        android:src="@drawable/caus_irri"
        app:layout_constraintBottom_toTopOf="@+id/irritated"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.232"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.996" />


    <Button
        android:id="@+id/anime_List"
        android:layout_width="100dp"
        android:layout_height="30dp"
        android:layout_weight="1"
        android:background="@drawable/buttonsad_background"
        android:fontFamily="@font/cairo_semibold"
        android:text="Anime List"
        android:textAllCaps="false"
        android:textSize="16sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.578"
        app:layout_constraintStart_toEndOf="@+id/FS"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.873" />

    <Button
        android:id="@+id/other"
        android:layout_width="100dp"
        android:layout_height="30dp"
        android:background="@drawable/buttonsad_background"
        android:fontFamily="@font/cairo_semibold"
        android:text="Other"
        android:textAllCaps="false"
        android:textSize="16sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toStartOf="@+id/FS"
        app:layout_constraintHorizontal_bias="0.421"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.876" />

    <Button
        android:id="@+id/FS"
        android:layout_width="135dp"
        android:layout_height="33dp"
        android:layout_weight="1"
        android:background="@drawable/buttonsad_background"
        android:fontFamily="@font/cairo_semibold"
        android:text="Favorite Song"
        android:textAllCaps="false"
        android:textSize="16sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.876" />

    <Button
        android:id="@+id/idk"
        android:layout_width="100dp"
        android:layout_height="30dp"
        android:background="@drawable/buttonsad_background"
        android:fontFamily="@font/cairo_semibold"
        android:text="Idk"
        android:textAllCaps="false"
        android:textSize="16sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.781"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.774" />

    <Button
        android:id="@+id/sad"
        android:layout_width="100dp"
        android:layout_height="30dp"
        android:background="@drawable/buttonsad_background"
        android:fontFamily="@font/cairo_semibold"
        android:text="Sad"
        android:textAllCaps="false"
        android:textSize="16sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.781"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.317" />

    <ImageView
        android:id="@+id/tired_octane"
        android:layout_width="94dp"
        android:layout_height="124dp"
        android:src="@drawable/octane_tired"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.766"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.444" />

    <Button
        android:id="@+id/happy"
        android:layout_width="100dp"
        android:layout_height="30dp"
        android:background="@drawable/buttonsad_background"
        android:fontFamily="@font/cairo_semibold"
        android:text="Happy"
        android:textAllCaps="false"
        android:textSize="16sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.237"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.317" />

    <TextView
        android:id="@+id/textView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:fontFamily="@font/cairo_semibold"
        android:text="How do you feel today?"
        android:textColor="#ffffff"
        android:textSize="23sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/textView3"
        app:layout_constraintVertical_bias="0.014" />

    <Button
        android:id="@+id/irritated"
        android:layout_width="100dp"
        android:layout_height="30dp"
        android:background="@drawable/buttonsad_background"
        android:fontFamily="@font/cairo_semibold"
        android:text="Irritated"
        android:textAllCaps="false"
        android:textSize="16sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.237"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.774" />

    <ImageView
        android:id="@+id/bangalore_idk"
        android:layout_width="102dp"
        android:layout_height="133dp"
        android:layout_marginTop="496dp"
        android:layout_marginBottom="2dp"
        android:src="@drawable/bangalore_idk"
        app:layout_constraintBottom_toTopOf="@+id/idk"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.786"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="1.0" />

    <ImageView
        android:id="@+id/angry_rev"
        android:layout_width="105dp"
        android:layout_height="131dp"
        android:src="@drawable/rev_angry"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.232"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.448" />

    <Button
        android:id="@+id/tired"
        android:layout_width="100dp"
        android:layout_height="30dp"
        android:background="@drawable/buttonsad_background"
        android:fontFamily="@font/cairo_semibold"
        android:text="Tired"
        android:textAllCaps="false"
        android:textSize="16sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.781"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.545" />

    <ImageView
        android:id="@+id/sad_valk"
        android:layout_width="114dp"
        android:layout_height="141dp"
        android:src="@drawable/valk_sad"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.81"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.179" />






</androidx.constraintlayout.widget.ConstraintLayout>

和清单，不确定这是否相关，但也可能。

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.kaish">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/newnewicon"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/newnewicon_round"
        android:supportsRtl="true"
        android:theme="@style/Theme.Kaish">
        <activity android:name=".anime_4"></activity>
        <activity
            android:name=".anime_3"
            android:launchMode="singleTask"
            android:screenOrientation="portrait" />
        <activity
            android:name=".anime_2"
            android:launchMode="singleTask"
            android:screenOrientation="portrait" />
        <activity
            android:name=".anime"
            android:launchMode="singleTask"
            android:screenOrientation="portrait" />
        <activity
            android:name=".nsfw"
            android:screenOrientation="portrait" />
        <activity
            android:name=".other"
            android:screenOrientation="portrait" />
        <activity
            android:name=".Secret_activity"
            android:screenOrientation="portrait" />
        <activity
            android:name=".FS"
            android:screenOrientation="portrait" />
        <activity
            android:name=".idk"
            android:screenOrientation="portrait" />
        <activity
            android:name=".irritated"
            android:screenOrientation="portrait" />
        <activity
            android:name=".tired"
            android:screenOrientation="portrait" />
        <activity
            android:name=".angry"
            android:screenOrientation="portrait" />
        <activity
            android:name=".happy"
            android:screenOrientation="portrait" />
        <activity
            android:name=".Sad"
            android:screenOrientation="portrait" />
        <activity
            android:name=".MainActivity"
            android:screenOrientation="portrait">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>

编辑：我还决定包含主题的 xml，因为我觉得这会导致错误。

<resources xmlns:tools="http://schemas.android.com/tools">
    <!-- Base application theme. -->
    <style name="Theme.Kaish" parent="Theme.AppCompat.DayNight.NoActionBar">
        <!-- Primary brand color. -->
        <item name="colorPrimary">#04F2FE</item>
        <item name="colorPrimaryVariant">#04F2FE</item>
        <item name="colorOnPrimary">#4481EB</item>
        <!-- Secondary brand color. -->
        <item name="colorSecondary">@color/teal_200</item>
        <item name="colorSecondaryVariant">@color/teal_700</item>
        <item name="colorOnSecondary">@color/black</item>
        <item name="android:navigationBarColor">#427EE8</item>
        <!-- Status bar color. -->
        <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
        <!-- Customize your theme here. -->
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="android:windowTranslucentStatus">true</item>
        <item name="android:windowTranslucentNavigation">true</item>
    </style>

</resources>

Answer 1

我建议阅读更多关于Constraint Layout 和dimensions 的信息，您并没有正确使用它们，特别是约束。还要记住，dp 不像 px。

在每个 Button 和 ImageView 中，您指定宽度和高度的固定值，例如

android:layout_width="100dp"
android:layout_height="30dp"

这并非完全错误，但请记住，这些值并不意味着文本可见，wrap_content 是这种情况下的解决方案

这是那个xml蓝图：

查看图像如何与按钮重叠并且按钮文本并不总是可见

在按钮上使用 wrap_content：

android:layout_width="wrap_content"
android:layout_height="wrap_content"

正如我一开始所说，约束也是错误的。

Answer 2

问题与主题（夜间）以及每部手机上的暗模式设置（如果启用）有关，因此，如果其他人遇到过这种情况，请确保为暗模式添加例外。 dark mode disable