【问题标题】:Scale image both vertically and horizontally within a gridlayout在网格布局中垂直和水平缩放图像
【发布时间】:2017-08-09 08:29:30
【问题描述】:

我是 Android 开发新手,我正在尝试使用 GridLayout 创建包含 3 列的行,每列都有一个 imageview。在这种情况下,我使用的是在 Photoshop 中创建的方形图像,全为红色,仅用于测试。

这是我目前使用的xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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/activity_menu"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="me.andrewlarsen.testapp.MenuActivity">

    <GridLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:rowCount="2"
        android:columnCount="3"
        android:gravity="center"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true">


        <ImageView
            android:layout_gravity="fill"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:srcCompat="@mipmap/redblock"
            android:layout_row="0"
            android:layout_column="0"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:scaleType="fitXY"
            android:id="@+id/imageView1" />

        <ImageView
            android:layout_gravity="fill"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:srcCompat="@mipmap/redblock"
            android:layout_row="0"
            android:layout_column="1"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:scaleType="fitXY"
            android:id="@+id/imageView2" />

        <ImageView
            android:layout_gravity="fill"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:srcCompat="@mipmap/redblock"
            android:layout_row="0"
            android:layout_column="2"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:scaleType="fitXY"
            android:id="@+id/imageView3" />

        <ImageView
            android:layout_gravity="fill"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:srcCompat="@mipmap/redblock"
            android:layout_row="1"
            android:layout_column="0"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:id="@+id/imageView4" />

        <ImageView
            android:layout_gravity="fill"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:srcCompat="@mipmap/redblock"
            android:layout_row="1"
            android:layout_column="1"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:id="@+id/imageView5" />

        <ImageView
            android:layout_gravity="fill"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:srcCompat="@mipmap/redblock"
            android:layout_row="1"
            android:layout_column="2"
            android:layout_columnWeight="1"
            android:layout_rowWeight="1"
            android:id="@+id/imageView6" />

    </GridLayout>
</RelativeLayout>

上面的 xml 给出的结果如下所示:

所以你可以看到我有 2 行,这是彼此不同的。在第一行的所有 3 列中,我添加了 android:scaleType="fitXY" 但是它只能水平缩放,而不是垂直缩放。

我希望它在两个方向上都按比例放大,所以结果会是一个更大的正方形。

我试图让它看起来像这样:

当我使用 android:scaleType="fitXY" 时,我希望图像在 X 方向(水平)和 Y 方向(垂直)上都按比例放大,但事实并非如此。

感谢我能得到的所有帮助。

【问题讨论】:

  • 这是因为您的子视图将继承父视图的填充。即:RelativeLayout 的那些。
  • 没错,但即使我从 relativelayout 中删除填充,图像也不会垂直放大,只会水平放大。所以我得到了相同的结果,但填充更少。
  • 一个粗略的技巧是将图像用作背景,而不是src。背景图像总是以两种尺寸缩放。而且您不必指定scaleType
  • 谢谢,我试试看。
  • 不,单元格是矩形的 - 因此它会拉伸以适应(并在任何地方留下 10 px 的边距 - 如果有的话)。或者,另一种选择是使用颜色作为背景,而不是图像(这将填充所有可用的单元格空间)。但我想这里的重点是拉伸图像。

标签: java android layout grid


【解决方案1】:

问题解决了,不得不使用:

android:adjustViewBounds="true"

在每个图像视图元素中

【讨论】:

    【解决方案2】:

    尝试删除权重(android:layout_columnWeight="1" 和 android:layout_rowWeight="1"),以及你的 redblock 大小?如果可能,请发送您的图片。

    【讨论】:

    • 删除了所有的 columnWeight 和 rowWeight,结果如下:i.gyazo.com/78f071157774cc9dc6ba68283e968a9f.png 我使用的图片是 100x100 的红色背景,在油漆中创建。我知道扩大规模时会降低质量,但应该仍然可以双向扩大规模?
    猜你喜欢
    • 1970-01-01
    • 2017-11-05
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-03-04
    • 2013-05-18
    • 2013-05-13
    相关资源
    最近更新 更多