如何使一个动态的布局比屏幕大？ [英] How to make a dynamic layout that is larger than screen?

问题描述

我想创建一个动态扩展的布局，可能会增加反映到用户的输入。首先，我创建了一个活动的布局，允许在两个方向滚动（这不是我的发明，我用在的想法解释评论另一个问题与一些改进的）：

I want to create a dynamically extending layout that may grow reflecting to user's input. First, I've created an activity layout that allows scrolling in both directions (this is not my invention, I've used the idea explained in a comment to another question with some improvements):

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:clipChildren="false"
    android:clipToPadding="false"
    tools:ignore="UselessParent" >

    <FrameLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:clipChildren="false"
        android:clipToPadding="false" >

        <RelativeLayout
            android:id="@+id/content"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:clipChildren="false"
            android:clipToPadding="false" >

        </RelativeLayout>
    </FrameLayout>
</FrameLayout>

然后，我创建了一个简单的用户界面的布局，一个文本视图和一个垂直线性布局，下文。这是我的message_with_replies.xml：

Then, I created a simple UI layout, a text view and a vertical linear layout, below. Here is my message_with_replies.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:clipChildren="false"
    android:clipToPadding="false"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/header"
        android:layout_width="300dp"
        android:layout_height="wrap_content" >

<!-- some text views and buttons here, 
    I've removed them to keep things simple,
    see the screenshot below -->

    </LinearLayout>

    <LinearLayout
        android:id="@+id/replies"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:orientation="vertical" >
    </LinearLayout>

</LinearLayout>

请注意在10dp保证金在回复的布局和相关的裁剪属性。

Note the 10dp margin in the replies layout and the attributes related to clipping.

所以，我现在就可以充气的项目与message_with_replies布局，并把它添加到的内容的活动的布局，然后吹大另一个项目，并把它添加到的回复的线性布局withing第一项等，从而创造一个树形层次结构。而整个树显示，并滚动横向和纵向。

So I can now inflate an item with the message_with_replies layout and add it to the content layout of the activity, and then inflate another item and add it to the replies linear layout withing the first item and so on, thus creating a tree-like hierarchy. And the whole tree is displayed and scrolled both horizontally and vertically.

不过，它看起来像布局仍然是有限的某种方式与屏幕尺寸。我有两个问题：

However, it looks like the layout is still limited somehow with the screen size. I have two problems:

1），超越了右边的项目看起来不错，但没有收到用户输入。 2）超出底边的布局搞砸了。

1) The items beyond the right edge look fine but don't receive user input. 2) The layout beyond the bottom edge is messed up.

下面是截图。从左至右依次为：1）一切都看起来不错，2）哎呀，按钮上的优势，3）哎呀，底部搞砸

Here is the screenshot. From left to right: 1) Everything looks fine, 2) Oops, the button is on the edge, 3) Oops, the bottom is messed up.

看起来像我错过了一些简单而隐蔽。如何让我的布置工作超出了屏幕边缘？

Looks like I missed something simple but hidden. How do I make the layout work beyond the screen edges?

推荐答案

解决方案是出奇的简单。

The solution is surprisingly simple.

在活动布局，RelativeLayout的节点（具有的内容的ID），应使用覆盖onMeasure方法的自定义布局类。

In the activity layout, a RelativeLayout node (the one with content ID) should use the custom layout class that overrides the onMeasure method.

因此​​，这里是该活动布局修正：

So here is the fix for the activity layout:

<com.sample.MyRelativeLayout
    android:id="@+id/content"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:clipChildren="false"
    android:clipToPadding="false" >
</com.sample.MyRelativeLayout>

和这里是类实现：

public class MyRelativeLayout extends RelativeLayout {
    public MyRelativeLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(0, 0);
    }
}

请注意，我没有计算任何东西，路过（0，0）的作品就好了。

Note that I don't have to calculate anything, passing (0, 0) works just fine.

坦白说，我还不知道这个解决方案的所有优点和缺点，但它工作正常。我已经注意到到目前为止，唯一的问题是，更多的项目我扩大，速度较慢的用户界面响应。

Frankly speaking, I don't yet understand all pros and cons of this solution, but it works properly. The only issue that I have noticed so far is that the more items I expand, the slower the UI responds.

我会AP preciate任何意见或建议。

I'll appreciate any comments or suggestions.

这篇关于如何使一个动态的布局比屏幕大？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！