异构网格布局 [英] Heterogeneous GridLayout

问题描述

更新 - 我工作的解决方案： http://stackoverflow.com/a/21233824/902172

我想实现以下布局：

我想网格布局是适合我的需求，除了2小时的奋斗我找不到牛逼创造出一个类似的布局。该布局是调整本身错误的，它的超过屏幕的手机，同时也不跨越的指定的行和列。

I guess GridLayout is suitable for my needs but after 2 hours of struggle I couldn't create even a similar layout.. The layout is resizing itself wrongly, it exceeds the screen of the phone and it also does not span the specified rows and columns.

在这里，我选择了一个按钮，这样你就可以看到它是如何超过了界限：

Here I selected a button so you can see how it exceeds the boundaries:

和这里是关联的XML code： https://gist.github.com/2834492

and here is the associated xml code: https://gist.github.com/2834492

我已经与嵌套linearlayouts相似的布局，但它不可能为适当调整是不同的屏幕大小。

I have reached a similar layout with nested linearlayouts but it's not possible to properly resize it for different screen sizes.

更新 - 近似的LinearLayout实现：

中的XML code： https://gist.github.com/cdoger/2835887 但是，问题是它不能调整自身正确这里的截图不同的屏幕配置：

The XML code: https://gist.github.com/cdoger/2835887 However, the problem is it does not resize itself properly here some screenshots with different screen configurations:

<一个href="http://i18.photobucket.com/albums/b122/floatercrop/581a0b67.jpg">http://i18.photobucket.com/albums/b122/floatercrop/581a0b67.jpg

<一个href="http://i18.photobucket.com/albums/b122/floatercrop/65fc491a.jpg">http://i18.photobucket.com/albums/b122/floatercrop/65fc491a.jpg

<一个href="http://i18.photobucket.com/albums/b122/floatercrop/5b119fc4.jpg">http://i18.photobucket.com/albums/b122/floatercrop/5b119fc4.jpg

TLDR： 有人能告诉我一个异类布局实现与网格布局像第一张图片的

推荐答案

因此​​，这里是我一年后所承诺的解决方案=） 它基本上使用 ViewTreeObserver 获取父布局的尺寸和创建自定义视图相应。由于这code是一岁ViewTreeObserver未必是动态获取尺寸的最佳方式。

So here is the solution I promised after one year =) It basically uses the ViewTreeObserver to get the dimensions of the parent layout and create custom views accordingly. Since this code is one year old ViewTreeObserver might not be the best way to get the dimensions dynamically.

您可以在这里找到完整的源$ C ​​$ C： https://github.com/cdoger/Android_layout

You can find the full source code here: https://github.com/cdoger/Android_layout

我分了屏幕分成8个相等的宽度和6相同的高度。下面是我的布局方式的意见快照：

I divided the screen into 8 equal widths and 6 equal heights. Here is a snapshot of how I laid out the views:

final RelativeLayout mainLayout = (RelativeLayout) findViewById(R.id.main_layout);
ViewTreeObserver vto = mainLayout.getViewTreeObserver();
vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() {
    @Override
    public void onGlobalLayout() {
        final int oneUnitWidth = mainLayout.getMeasuredWidth() / 8;
        final int oneUnitHeight = mainLayout.getMeasuredHeight() / 6;
        /**
         * 1
         ***************************************************************/
        final RelativeLayout.LayoutParams otelParams = new RelativeLayout.LayoutParams(
                oneUnitWidth * 4, oneUnitHeight);
        otelParams.addRule(RelativeLayout.ALIGN_PARENT_TOP);
        otelParams.addRule(RelativeLayout.ALIGN_PARENT_LEFT);
        // otelParams.setMargins(0, 0, 2, 0);
        View1.setLayoutParams(otelParams);
        /***************************************************************/

        /**
         * 2
         ***************************************************************/
        final RelativeLayout.LayoutParams otherParams = new RelativeLayout.LayoutParams(
                oneUnitWidth * 4, oneUnitHeight);
        otherParams.addRule(RelativeLayout.ALIGN_PARENT_TOP);
        otherParams.addRule(RelativeLayout.RIGHT_OF, View1.getId());
        otherParams.setMargins(2, 0, 0, 0);
        View2.setLayoutParams(otherParams);
        /***************************************************************/
//... goes on like this

下面是最后的截图：

这篇关于异构网格布局的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！