Question

我有一个应用，该应用的活动下面带有3个imagebutton和一个横幅广告。像这样...

ImageButton布局的大小是可包装的内容，每个来源都是我制作的png。现在，当我在小屏幕上进行测试时，最下面的是横幅广告的后面。我想按屏幕的尺寸（主要是高度）缩放ImageButtons。

有人可以告诉我正确的方法吗？

我必须制作适合小屏幕的小png源，然后使用最小的屏幕宽度限定符制作更多的可绘制对象？ 320dpi和480dpi确实有很大的利润空间，我将不得不在两者之间增加一些文件夹。

提前谢谢大家！

Answer 1

如果您不对“约束布局”进行域划分，也许您可以尝试在主布局内使用LinearLayout并用权重来划分屏幕...如下所示，它可能会起作用：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" 
android:layout_height="match_parent">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:weightSum="4"
    android:padding="10dp">

    <ImageButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:src="@drawable/..."/>

    <ImageButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:src="@drawable/..."/>

    <ImageButton
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:src="@drawable/..."/>

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:src="@drawable/..."/>


</LinearLayout>
</RelativeLayout>

只需根据需要对其进行调整...希望这项工作：）

Answer 2

您无需创建单独的图像，可以使用ConstraintLayout，它将自动为您管理尺寸。我已经测试了下面的代码，它似乎工作正常。试试吧：

your_activity.xml

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

    <ImageButton
        android:id="@+id/imageButton1"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="@id/imageButton2"
        android:background="@color/white"
        android:src="@drawable/image_1"/>

    <ImageButton
        android:id="@+id/imageButton2"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toBottomOf="@id/imageButton1"
        app:layout_constraintBottom_toTopOf="@id/imageButton3"
        android:background="@color/white"
        android:src="@drawable/image_2"/>

    <ImageButton
        android:id="@+id/imageButton3"
        android:layout_width="wrap_content"
        android:layout_height="0dp"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintTop_toBottomOf="@id/imageButton2"
        app:layout_constraintBottom_toTopOf="@id/bannerContainer"
        android:background="@color/white"
        android:src="@drawable/image_3"/>

    <!-- Whatever container your banner is in -->
    <RelativeLayout
        android:id="@+id/bannerContainer"
        android:layout_width="match_parent"
        android:layout_height="80dp"
        android:background="#000"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

注意： 我添加了背景色只是为了进行测试。您需要重点注意的一点是，ImageButton的高度对于所有对象都是0dp，并且约束条件会自动管理高度。

ConstraintLayout的优点在于您不需要像LinearLayout中那样指定不同的权重，因此您可以具有不同高度的图像，并且效果很好。

Answer 3

如果使用的是CSS，则可以使用属性单位vh（视口高度）。测量值是视口/屏幕高度的百分比。例如，height: 10vh; width: auto;会将元素高度渲染为屏幕高度的10％，而不会扭曲png。如果对显示的四个元素使用此度量，则它们的值加起来等于100时，它们都会同时出现在屏幕上。

https://www.sitepoint.com/css-viewport-units-quick-start/

缩放图像按钮

3 个答案: