Блог

Я столкнулся с проблемой совместимости экрана, когда попытался добавить изображение в формате svg в качестве вектора в свой файл макета. Мой код ниже

 <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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".ui.auth.AuthActivity">

    <RelativeLayout
        android:id="@ id/otNum"
        android:background="@color/white"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        android:orientation="vertical">

        <LinearLayout
            android:paddingTop="50dp"
            android:id="@ id/otpIcon"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="0.3"
            android:gravity="center"
            >
            <androidx.appcompat.widget.AppCompatImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:background="@drawable/ic_otp_image"/> <--  ic_otp_image.xml  in drawable -->

        </LinearLayout>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_weight="0.7"
            android:layout_below="@id/otpIcon"
            android:gravity="center_horizontal"
            android:orientation="vertical"
            android:paddingTop="50dp">

            <!-- Some form content goes here-->

        </LinearLayout>

    </RelativeLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
  

Я занимаюсь разработкой на устройстве с разрешением xxhdpi, то есть на прямом устройстве. Вышеуказанный параметр макета отлично работает на этом устройстве, но когда я провел тест совместимости устройств на эмуляторе (hdpi 480 x 800). Изображение занимает более половины размера экрана устройства, и все содержимое моей формы исчезает с экрана. Я проверил другое сообщение, но не смог найти правильное решение для этой проблемы.

Скриншот симулятора hdpi (слева) и (xhdpi):

Вы можете решить эту проблему, установив высоту и ширину чертежа с помощью dimens.xml файлы. Это позволит вам определять разные размеры для рисования в зависимости от размера экрана.

Вы также можете решить ее с помощью ConstraintLayout . Ниже приведено одно из таких решений. Этот код заставит ImageView занимать 40% ширины экрана, а его соотношение ширины и высоты будет 2: 1.

 <?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto">

<androidx.appcompat.widget.AppCompatImageView
    android:layout_width="0dp"
    android:layout_height="0dp"
    app:layout_constraintWidth_percent="0.4"
    app:layout_constraintDimensionRatio="H,2:1"
    android:background="@drawable/myDrawable"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>