如何使GridLayout适合屏幕大小 [英] How to make a GridLayout fit screen size

问题描述

GridLayout API文档非常难以学习...... ...
有没有人可以教我如何设置子View的值，使其具有类似于LinearLayout的重量"的值?

The GridLayout API docs is very difficult to learn ......
is there any one who can teach me how to set child Views to have something like "weight" of LinearLayout ?

现在看来所有内容都放在了左侧，
我已经尝试了很多次，但仍然无法像每个屏幕一样将其设置为屏幕宽度的一半.

Right now it looks like all are placed on the left hand side,
I have tried many times and still can not make it like each one the half width of the screen.

我不知道当孩子全都是wrap_content时我该怎么办…… 即使我想以特定尺寸设置图像，该类也可以帮助我使ImageView wrap_content .....它无法正常工作，我错过了某些设置吗?！?

Edited : I don't know what can I do for when the childen are all wrap_content ...... even if I want to set some image in specific size , this class helps me to make ImageView wrap_content .........it cannot operate normal , did I miss some setting ?!?

推荐答案

注意:水平线下方的信息随着引入Android'Lollipop'5而不再准确，如GridLayout自API级别21开始，确实采用权重原则.

Note: The information below the horizontal line is no longer accurate with the introduction of Android 'Lollipop' 5, as GridLayout does accommodate the principle of weights since API level 21.

引自 Javadoc :

过多的空间分布

从API 21开始，GridLayout分配了多余的空间 重量原则.如果未指定权重， 遵守先前的约定，并采用行和列 如果他们的视图在其内部指定了某种形式的对齐方式，则将具有灵活性 组.因此，视图的灵活性受其灵活性的影响 对齐方式，通常通过设置重力来定义 孩子的布局参数的属性.如果是重量或 沿给定的轴定义了路线，然后采用了该分量 在该方向上具有灵活性.如果未设置重量或对齐方式，则 相反，该组件被认为是不灵活的.

As of API 21, GridLayout's distribution of excess space accomodates the principle of weight. In the event that no weights are specified, the previous conventions are respected and columns and rows are taken as flexible if their views specify some form of alignment within their groups. The flexibility of a view is therefore influenced by its alignment which is, in turn, typically defined by setting the gravity property of the child's layout parameters. If either a weight or alignment were defined along a given axis then the component is taken as flexible in that direction. If no weight or alignment was set, the component is instead assumed to be inflexible.

同一行或同一列组中的多个组件被认为 并行行动.只有当所有 其中的组件是灵活的.坐的行和列组 取而代之的是，将公共边界的任意一侧视为 系列.如果这两个元素组成的复合组是灵活的， 其要素之一就是灵活性.

Multiple components in the same row or column group are considered to act in parallel. Such a group is flexible only if all of the components within it are flexible. Row and column groups that sit either side of a common boundary are instead considered to act in series. The composite group made of these two elements is flexible if one of its elements is flexible.

要拉伸列，请确保其中的所有组件 定义重量或重力.为了防止柱子拉伸， 确保该列中的某个组件未定义 重量或重力.

To make a column stretch, make sure all of the components inside it define a weight or a gravity. To prevent a column from stretching, ensure that one of the components in the column does not define a weight or a gravity.

当灵活性原则不完整时 消歧，GridLayout的算法偏向于行和列 更靠近其右边缘和下边缘.更准确地说， GridLayout将其每个布局参数都视为约束， 一组定义沿给定轴的网格线的变量. 在布局期间，GridLayout解决约束，以便返回 对于所有变量均受约束的约束的唯一解决方案 小于或等于任何其他有效值中的对应值 解决方案.

When the principle of flexibility does not provide complete disambiguation, GridLayout's algorithms favour rows and columns that are closer to its right and bottom edges. To be more precise, GridLayout treats each of its layout parameters as a constraint in the a set of variables that define the grid-lines along a given axis. During layout, GridLayout solves the constraints so as to return the unique solution to those constraints for which all variables are less-than-or-equal-to the corresponding value in any other valid solution.

还值得注意的是 android.support.v7.widget.GridLayout 包含相同的信息.不幸的是，它没有提到引入的支持库版本，而是添加了功能可追溯到2014年7月.2014年11月，重量计算和改进错误已修复.

It's also worth noting that android.support.v7.widget.GridLayout contains the same information. Unfortunately it doesn't mention which version of the support library it was introduced with, but the commit that adds the functionality can be tracked back to July 2014. In November 2014, improvements in weight calculation and a bug was fixed.

为了安全起见，请确保导入最新版本的gridlayout-v7库.

To be safe, make sure to import the latest version of the gridlayout-v7 library.

正如您所描述的，权重"原理在GridLayout中不存在. 文档中明确提到了此限制；摘录如下.话虽这么说，但仍有一些可能性将重力"用于多余的空间分配.建议您通读链接文档.

The principle of 'weights', as you're describing it, does not exist with GridLayout. This limitation is clearly mentioned in the documentation; excerpt below. That being said, there are some possibilities to use 'gravity' for excess space distribution. I suggest you have read through the linked documentation.

限制

GridLayout不支持 weight 的原理，因为 定义重量.通常，因此不可能 配置一个GridLayout来分配多余的空间 多行或多列之间的比例.一些常见的用例 仍然可以容纳如下.放置等量的 单元格中组件周围的空间；使用CENTER对齐(或 重力).用于连续控制多余空间的连续分布 或专栏;使用LinearLayout子视图将组件保存在 相关的细胞群.使用上述任何一种技术时，请注意 请注意，单元格组可以定义为重叠.

GridLayout does not provide support for the principle of weight, as defined in weight. In general, it is not therefore possible to configure a GridLayout to distribute excess space in non-trivial proportions between multiple rows or columns. Some common use-cases may nevertheless be accommodated as follows. To place equal amounts of space around a component in a cell group; use CENTER alignment (or gravity). For complete control over excess space distribution in a row or column; use a LinearLayout subview to hold the components in the associated cell group. When using either of these techniques, bear in mind that cell groups may be defined to overlap.

有关示例和一些实用的指针，请查看

For an example and some practical pointers, take a look at last year's blog post introducing the GridLayout widget.

编辑:我认为没有一种基于xml的方法将Google Play应用中的图块缩放为正方形"或矩形"，其长度是这些正方形长度的两倍.但是，如果以编程方式构建布局，则肯定是可能的.要真正做到这两项，您真正需要知道的就是设备的屏幕尺寸.

I don't think there's an xml-based approach to scaling the tiles like in the Google Play app to 'squares' or 'rectangles' twice the length of those squares. However, it is certainly possible if you build your layout programmatically. All you really need to know in order two accomplish that is the device's screen dimensions.

在Google Play应用中快速(非常！)平铺布局的下方.

Below a (very!) quick 'n dirty approximation of the tiled layout in the Google Play app.

Point size = new Point();
getWindowManager().getDefaultDisplay().getSize(size);
int screenWidth = size.x;
int screenHeight = size.y;
int halfScreenWidth = (int)(screenWidth *0.5);
int quarterScreenWidth = (int)(halfScreenWidth * 0.5);

Spec row1 = GridLayout.spec(0, 2);
Spec row2 = GridLayout.spec(2);
Spec row3 = GridLayout.spec(3);
Spec row4 = GridLayout.spec(4, 2);

Spec col0 = GridLayout.spec(0);
Spec col1 = GridLayout.spec(1); 
Spec colspan2 = GridLayout.spec(0, 2);

GridLayout gridLayout = new GridLayout(this);
gridLayout.setColumnCount(2);
gridLayout.setRowCount(15);

TextView twoByTwo1 = new TextView(this);
GridLayout.LayoutParams first = new GridLayout.LayoutParams(row1, colspan2);
first.width = screenWidth;
first.height = quarterScreenWidth * 2;
twoByTwo1.setLayoutParams(first);
twoByTwo1.setGravity(Gravity.CENTER);
twoByTwo1.setBackgroundColor(Color.RED);
twoByTwo1.setText("TOP");
twoByTwo1.setTextAppearance(this, android.R.style.TextAppearance_Large);
gridLayout.addView(twoByTwo1, first);

TextView twoByOne1 = new TextView(this);
GridLayout.LayoutParams second = new GridLayout.LayoutParams(row2, col0);
second.width = halfScreenWidth;
second.height = quarterScreenWidth;
twoByOne1.setLayoutParams(second);
twoByOne1.setBackgroundColor(Color.BLUE);
twoByOne1.setText("Staff Choices");
twoByOne1.setTextAppearance(this, android.R.style.TextAppearance_Large);
gridLayout.addView(twoByOne1, second);

TextView twoByOne2 = new TextView(this);
GridLayout.LayoutParams third = new GridLayout.LayoutParams(row2, col1);
third.width = halfScreenWidth;
third.height = quarterScreenWidth;
twoByOne2.setLayoutParams(third);
twoByOne2.setBackgroundColor(Color.GREEN);
twoByOne2.setText("Games");
twoByOne2.setTextAppearance(this, android.R.style.TextAppearance_Large);
gridLayout.addView(twoByOne2, third);

TextView twoByOne3 = new TextView(this);
GridLayout.LayoutParams fourth = new GridLayout.LayoutParams(row3, col0);
fourth.width = halfScreenWidth;
fourth.height = quarterScreenWidth;
twoByOne3.setLayoutParams(fourth);
twoByOne3.setBackgroundColor(Color.YELLOW);
twoByOne3.setText("Editor's Choices");
twoByOne3.setTextAppearance(this, android.R.style.TextAppearance_Large_Inverse);
gridLayout.addView(twoByOne3, fourth);

TextView twoByOne4 = new TextView(this);
GridLayout.LayoutParams fifth = new GridLayout.LayoutParams(row3, col1);
fifth.width = halfScreenWidth;
fifth.height = quarterScreenWidth;
twoByOne4.setLayoutParams(fifth);
twoByOne4.setBackgroundColor(Color.MAGENTA);
twoByOne4.setText("Something Else");
twoByOne4.setTextAppearance(this, android.R.style.TextAppearance_Large);
gridLayout.addView(twoByOne4, fifth);

TextView twoByTwo2 = new TextView(this);
GridLayout.LayoutParams sixth = new GridLayout.LayoutParams(row4, colspan2);
sixth.width = screenWidth;
sixth.height = quarterScreenWidth * 2;
twoByTwo2.setLayoutParams(sixth);
twoByTwo2.setGravity(Gravity.CENTER);
twoByTwo2.setBackgroundColor(Color.WHITE);
twoByTwo2.setText("BOTOM");
twoByTwo2.setTextAppearance(this, android.R.style.TextAppearance_Large_Inverse);
gridLayout.addView(twoByTwo2, sixth);

结果看起来有点像这样(在我的Galaxy Nexus上):

The result will look somewhat like this (on my Galaxy Nexus):

这篇关于如何使GridLayout适合屏幕大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！