Android

Question

我在将 android.support.percent.PercentRelativeLayout 与 ScrollView 结合使用时遇到问题。以下xml个文件

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/ScrollView01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:scrollbars="none">

<android.support.percent.PercentRelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:background="@color/white"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    >
    <ImageView
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        app:layout_widthPercent="50%"
        app:layout_heightPercent="50%"
        app:layout_marginTopPercent="5%"
        app:layout_marginLeftPercent="5%"
        android:src="@drawable/o"
        android:id="@+id/imageView3" />
    <ImageView
        android:layout_height="match_parent"
        android:layout_width="match_parent"
        app:layout_widthPercent="50%"
        app:layout_heightPercent="50%"
        app:layout_marginTopPercent="30%"
        app:layout_marginLeftPercent="5%"
        android:src="@drawable/o"
        android:layout_below="@+id/imageView3"
        android:layout_alignStart="@+id/imageView3"
        android:layout_marginTop="151dp" />
</android.support.percent.PercentRelativeLayout>

打印这个

使用 RelativeLayout 效果很好。有谁知道问题出在哪里？谢谢！

编辑：如果我将 ScrollView 高度设置为 1000dp，它也可以正常工作，但我希望高度与元素一样多

Answer 1

I want to learn how to use the percentage options for width height and margin so i can use them like in html, css. I want to set margin in % and not in dp same for width and height.

相信您可以以这种方式完成 Android 中的所有布局会给您带来麻烦。如果你正在学习 Android 中的 UI 布局，第一步是忘掉你所知道的关于 HTML 布局的一切。 HTML主要是关于文档的。好的移动设备 UI 不应该看起来像文档。

让我们举一个非常简单的例子：一个按钮。假设您想在布局中放置一个按钮。它应该有多大？好吧，它应该足够大以显示按钮的整个文本。它也不应该占用过多的 space.

在设计布局时，必须牢记您不知道用户的屏幕有多大。因此，如果您说 "I want to make my button width 20% of the screen"，在某些设备上您可能没有足够的空间来显示按钮的整个文本。在其他屏幕上，您可能有一个令人尴尬的 space 数量的按钮，其中文本只占实际按钮的很少部分。

至于边距，Google UI 准则建议以 16dp 为单位的网格间距。所以在 phone 上，典型的边距将为 16dp。在有更多空间的平板电脑上，48dp 的边距会更合适。用百分比指定边距将在小型设备上创建打包布局，并在大型布局上浪费 space。

您必须了解三个主要的尺码概念：

密度无关像素 (dp) 的绝对测量值。这通常用于边距和填充。
match_parent。我想让我的组件占据父组件的整个width/height。
wrap_content。我希望我的组件只占用它需要适当显示的 width/height，而不是更多。通常这只会用于宽度或高度，但不能同时用于两者。大多数小部件大小调整算法要求至少一侧为 "known" 大小，以确定它在另一个维度上需要多少 space。

仅使用这三种尺寸，您就可以做出数量惊人的 UI 布局。按钮的最佳尺寸是多少？在 phone 上，在纵向模式下，android:width="match_parent" & android:height="wrap_content"。取 phone 的整个宽度，但将高度限制为刚好足以显示所有按钮文本。完美。

当然，最终您会想要一个包含两个并排组件的布局。现在你怎么办？这是使用 LinearLayout 和 android:layout_weight 属性的好地方：我希望这两个组件具有相同的宽度（即屏幕宽度的 50%）。

然后您可能最终会尝试为平板电脑等更大的设备进行更复杂的布局。这是 PercentRelativeLayout 可能最合适的地方。 PercentageRelativeLayout 是一个专门用于处理一些棘手布局的容器。

如果您想要一个具有两个垂直图像并为较小屏幕滚动的布局，这就是我要使用的布局：

<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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="wrap_content"
        android:layout_marginLeft="16dp"
        android:layout_marginRight="16dp"
        android:orientation="vertical">

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="16dp"
            android:src="@drawable/image1"
            android:adjustViewBounds="true" />

        <ImageView
            android:id="@+id/imageView2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:src="@drawable/image2"
            android:adjustViewBounds="true" />
    </LinearLayout>
</ScrollView>

与设备一样宽的滚动容器中的两张图片。

说到 ImageView，有一个关于尺码的技巧。 android:adjustViewBounds="true" 的意思是：因为我的身高是 "wrap_content"（即灵活），让我的高度保持与宽度的纵横比。

我建议您阅读有关 UI 布局的 Android 教程，并查看示例项目以了解如何在 Android 中完成布局。

伙计，我明白了。当我第一次学习 Android 布局时，我很困惑地看到没有标准的百分比类型大小调整。但是随着我在 Android 中做越来越多的布局，我开始理解组件大小调整的工作原理并变得更好。然后我开始使用 Android.

中内置的功能编写自定义组件，这些组件实现了自己的大小调整算法

坚持下去，在你使用布局一段时间后，一切都会变得有意义。

Android - ScrollView 和 PercentRelativeLayout

Android - ScrollView and PercentRelativeLayout

android-scrollview

android-relativelayout

android-percentrelativelayout