如何自动调整不同屏幕尺寸的android studio的imageview的大小? [英] How to auto-resize imageview for different screen sizes android studio?

问题描述

我开始使用Android Studio开发适用于android设备的应用程序.在测试我的应用程序的屏幕尺寸兼容性时，我注意到图像视图不会自动调整大小.

在不同屏幕尺寸下，imageview位置看起来完全不同.如果屏幕足够小，则图像视图有时会放置在观察镜之外.

我在互联网上看了很多，但对如何使该应用程序兼容大多数屏幕尺寸(不包括平板电脑)感到有些困惑.我去了android网站，他们说要使用wrap_content.但是如果使用此功能，我将无法根据自己的需要调整imageview的高度和宽度.

有人知道如何根据屏幕尺寸自动调整imageview的大小吗?

以下是发生的情况的图像:

这是应用程序的布局:

这就是我想要的样子(像素3):

但这是在较小的屏幕(Nexus 5)上的外观:

在Xcode中，有一个称为自动调整大小的功能，可以自动为您调整内容的大小. android studio有类似的东西吗?

这是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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    
    <Button
        android:id="@+id/resetButton"
        style="@style/Widget.AppCompat.Button.Borderless.Colored"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_marginStart="32dp"
        android:layout_marginLeft="32dp"
        android:layout_marginBottom="56dp"
        android:background="#F70000"
        android:text="Undo"
        android:textColor="#000000"
        android:textSize="24sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

    <ImageView
        android:id="@+id/imageView3"
        android:layout_width="288dp"
        android:layout_height="248dp"

        android:background="#1750DF"
        android:scaleType="fitXY"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.495"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.685" />


</androidx.constraintlayout.widget.ConstraintLayout> 

提前谢谢！

解决方案

图像视图不会自动调整大小

由于您在imageView上使用了固定大小的值，因此出现了此问题:

不同的手机具有不同的屏幕尺寸，在您的布局中，您使用的是固定尺寸的视图(例如，固定尺寸为240dp)，结果是在一个屏幕上看起来不错(您的android studio预览屏幕)在另一个屏幕(您的实际手机)上看起来不会很好.

---

如何修复

您可以使用这些属性来使图像具有响应性:

app:layout_constraintHeight_percent="0.25"
app:layout_constraintWidth_percent="0.25"

您需要同时在android:layout_width和android:layout_height

中指定图像的大小0dp

我要做的是根据屏幕尺寸告诉视图在宽度和高度上均等于25%，这将使您对所有屏幕尺寸都具有响应能力，因此将自动调整大小"

I am starting to develop apps for android devices using Android Studio. While I was testing my app for screen size compatibilty I noticed that the imageviews do not auto-resize.

The imageview placement looks completely different in different screen sizes. If the screen is small enough, the imageview will sometimes be placed outside of the viewscope.

I have looked all over the internet but I am a little confused on how to make the app compatible with most screen sizes (not including tablets). I went to the android website and they said to use wrap_content. but if I use this, I wont be able to adjust the height and width of the imageview to how I want it.

Does anyone know how to make imageview auto-resize accordingly to the screen size?

Here are images of what is happening:

This is the layout of the app:

This is how I want it to look like (Pixel 3):

But this is how it looks like in a smaller screen(Nexus 5):

In Xcode there is a feature called auto-resize that automatically resizes the content for you. Does android studio have something similar to that?

This is the 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:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    
    <Button
        android:id="@+id/resetButton"
        style="@style/Widget.AppCompat.Button.Borderless.Colored"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        android:layout_marginStart="32dp"
        android:layout_marginLeft="32dp"
        android:layout_marginBottom="56dp"
        android:background="#F70000"
        android:text="Undo"
        android:textColor="#000000"
        android:textSize="24sp"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

    <ImageView
        android:id="@+id/imageView3"
        android:layout_width="288dp"
        android:layout_height="248dp"

        android:background="#1750DF"
        android:scaleType="fitXY"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHorizontal_bias="0.495"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.685" />


</androidx.constraintlayout.widget.ConstraintLayout>

Thank you in advance!

解决方案

the imageviews do not auto-resize

Because you are using a fixed size value on your imageView you are having this problem:

Different phones got different screen size, in your layout you are using fixed size on your view (fixed size is 240dp for example) and the result is that what may look good on one screen (your android studio preview screen) will not look good on another screen (your actual phone).

---

How to fix

You can use those attributes to make your image responsive in size:

app:layout_constraintHeight_percent="0.25"
app:layout_constraintWidth_percent="0.25"

You will need to give your image 0dp size both in android:layout_width and android:layout_height

What I did was to tell the view to be equal to 25% both in width and height according to the screen size, this will make you view responsive to all screen size and thus it will "auto-resize"

这篇关于如何自动调整不同屏幕尺寸的android studio的imageview的大小?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！