如何在XML中为视图指定宽度和高度的百分比?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何在XML中为视图指定宽度和高度的百分比?相关的知识,希望对你有一定的参考价值。

可以在XML LinearLayout中添加一个ImageView,其宽度为屏幕宽度的15%,并且高度完全相同?

我尝试使用此对话框代码,当用户单击地图上的标记时,该对话框代码将显示:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/custom_info_bubble"
    android:orientation="vertical">
.
. [some more content here]
.
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:weightSum="100">
        <ImageView
            android:id="@+id/favorite"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_marginRight="5dp"
            android:adjustViewBounds="true"
            android:layout_gravity="center_horizontal"
            android:layout_weight="15"
            android:layout_marginEnd="5dp" />
    </LinearLayout>
</LinearLayout>

但是有两个问题:

问题1:android:layout_weight =“15”占据了对话框的15%,而不是屏幕的宽度,这是一个很大的问题,因为对话框的宽度或多或少取决于它的内容。

问题2:宽度为15%,但高度是图像的实际高度。我不知道如何使它具有与其宽度完全相同的高度。它是一个方形图像,所以我试着让它尊重它的比例,把wrap_content放在高度上,并调整ViewBounds = true,但它不起作用。

问题3:ImageView没有居中,与左边对齐......我需要它居中。

如何使用XML而不是Java代码实现这一目标?

谢谢

答案

这就是我在XML中的做法,通过这种方式我的图像高度等于屏幕宽度的15%:

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

    <ImageView
        android:id="@+id/favorite"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:adjustViewBounds="true"
        android:src="@drawable/ic_launcher_background"
        app:layout_constraintDimensionRatio="H, 100:15"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent" />

</android.support.constraint.ConstraintLayout>

看看结果:

Result

另一答案

不,AFAIK通过XML无法实现。但是您可以通过编程方式轻松实现它:如果您需要,可以使用所需参数创建自定义视图,并将其放入XML中。查看https://stackoverflow.com/a/20427215/1159507以供参考。

另一答案

如何使它占据屏幕宽度的15%:

//Get 15% of screen width:
myWidth = getWindow().getDecorView().getWidth() * .15;

myImageView = findViewById(R.id.favorite);

myView.setWidth(myWidth);

//Height should be the same as the width
myView.setHeight(myWidth);
另一答案

以下两行表示图像视图的宽度将以百分比确定,并且它将相对于父级。

app:layout_constraintWidth_default="percent"
app:layout_constraintWidth_percent="0.15"

以下行表示imageview的宽度和高度将相同。比例是宽度:高度。

app:layout_constraintDimensionRatio="1:1"

使用Guidelines,您可以在约束布局下设置视图中的%宽度/高度。以下说该指南是其父母的20%。然后,您可以将具有约束集的视图放置到本指南中。

app:layout_constraintGuide_percent="0.2"

以下是您可以尝试的完整示例xml。

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

    <android.support.constraint.Guideline
        android:id="@+id/guideline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintGuide_percent="0.2" />

    <ImageView
        android:id="@+id/imageView5"
        android:layout_width="0dp"
        android:layout_height="0dp"
        android:background="#423dfe"

        app:layout_constraintWidth_default="percent"
        app:layout_constraintWidth_percent="0.15"
        app:layout_constraintDimensionRatio="1:1"

        android:layout_marginBottom="8dp"
        android:layout_marginEnd="8dp"
        android:layout_marginStart="8dp"
        android:layout_marginTop="8dp"

        app:layout_constraintBottom_toTopOf="@+id/guideline" />

</android.support.constraint.ConstraintLayout>

您只能使用ConstraintLayout的beta版本执行此操作:

compile 'com.android.support.constraint:constraint-layout:1.1.0-beta1'

相关SO帖子:1 2 3

进一步阅读:Constraint Layout

以上是关于如何在XML中为视图指定宽度和高度的百分比?的主要内容,如果未能解决你的问题,请参考以下文章

Android Drawable:在 XML 文件中以百分比指定形状宽度?

将宽度和高度指定为百分比而不在 HTML 中倾斜照片比例

如何在xml中设置复合可绘制文本视图的高度和宽度? [关闭]

删除图像视图周围的空白

如何在绘制之前获取调整大小的自定义视图的宽度和高度

用伪类实现一个div的宽度和高度是固定百分比