GridLayout(不是GridView)如何均匀拉伸所有孩子
Posted
技术标签:
【中文标题】GridLayout(不是GridView)如何均匀拉伸所有孩子【英文标题】:GridLayout (not GridView) how to stretch all children evenly 【发布时间】:2012-04-18 11:15:57 【问题描述】:我想要一个 2x2 网格,里面有一个按钮。这只是 ICS,所以我尝试使用给定的新 GridLayout。
这是我的布局的 XML:
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/favorites_grid"
android:layout_
android:layout_
android:background="#00ff00"
android:rowCount="2"
android:columnCount="2">
<Button
android:text="Cell 0"
android:layout_row="0"
android:layout_column="0"
android:textSize="14dip" />
<Button
android:text="Cell 1"
android:layout_row="0"
android:layout_column="1"
android:textSize="14dip" />
<Button
android:text="Cell 2"
android:layout_row="1"
android:layout_column="0"
android:textSize="14dip" />
<Button
android:text="Cell 3"
android:layout_row="1"
android:layout_column="1"
android:textSize="14dip" />
</GridLayout>
问题是我的观点并没有均匀地延伸到每一行。这会导致我的 GridLayout 右侧出现大量额外空间。
我尝试设置 layout_gravity="fill_horizontal"
但这仅适用于行上的 last 视图。这意味着单元格 1 一直延伸以为单元格 0 提供足够的空间。
关于如何解决这个问题的想法?
【问题讨论】:
为什么不在这些 Button 元素上设置特定的 layout_width 和 layout_height 尺寸? 为什么不在你的情况下使用 TableLayout? 在 Lollipop 中我们现在可以使用 android.support.v7.widget.GridLayout,列数为 3,然后有一个从 API 21 开始,GridLayout 中添加了权重的概念。要支持较旧的 android 设备,您可以使用 v7 支持库中的 GridLayout。
以下 XML 提供了一个示例,说明如何使用权重来填充屏幕宽度。
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:grid="http://schemas.android.com/apk/res-auto"
android:id="@+id/choice_grid"
android:layout_
android:layout_
android:layout_centerHorizontal="true"
android:padding="4dp"
grid:alignmentMode="alignBounds"
grid:columnCount="2"
grid:rowOrderPreserved="false"
grid:useDefaultMargins="true">
<TextView
android:layout_
android:layout_
grid:layout_columnWeight="1"
grid:layout_gravity="fill_horizontal"
android:gravity="center"
android:background="#FF33B5E5"
android:text="Tile1" />
<TextView
android:layout_
android:layout_
grid:layout_columnWeight="1"
grid:layout_gravity="fill_horizontal"
android:gravity="center"
android:background="#FF33B5E5"
android:text="Tile2" />
<TextView
android:layout_
android:layout_
grid:layout_columnWeight="1"
grid:layout_gravity="fill_horizontal"
android:gravity="center"
android:background="#FF33B5E5"
android:text="Tile3" />
<TextView
android:layout_
android:layout_
grid:layout_columnWeight="1"
grid:layout_gravity="fill_horizontal"
android:gravity="center"
android:background="#FF33B5E5"
android:text="Tile4" />
</android.support.v7.widget.GridLayout>
【讨论】:
这个答案应该更高。 这个可以同时填充垂直和水平吗?我想要一个均匀拉伸的 3x3 布局,但尝试同时拥有两个权重是行不通的。 我的一个特殊情况是我必须使用包含Button and an
ImageView`的FrameLayout
(以便在按钮上覆盖一个图标,在触摸时显示视觉反馈.. . 长篇大论)作为键盘的一部分。在其他Button
上设置columnWeight
和gravity
工作正常,但在FrameLayout
上中断了。只为FrameLayout
保留它使所有内容都按预期均匀布局。
请考虑including dependencies
您好,有趣的答案,但是如何以编程方式为充气儿童添加 grid:layout_columnWeight="1"?【参考方案2】:
更新:从 API 21 开始支持权重。有关详细信息,请参阅 PaulT's answer。
使用 GridLayout 有限制,以下引用来自documentation。
"GridLayout 不提供对权重原则的支持,如 以重量定义。一般来说,因此不可能 配置一个 GridLayout 以分配多余的空间 多行或多列之间的比例...用于完全控制 在行或列中过度的空间分布;使用线性布局 子视图来保存相关单元组中的组件。"
这是一个使用 LinearLayout 子视图的小例子。 (我使用了占用未使用区域并将按钮推到所需位置的空间视图。)
<GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:columnCount="1"
>
<TextView
android:text="2x2 button grid"
android:textSize="32dip"
android:layout_gravity="center_horizontal" />
<LinearLayout
android:layout_
android:layout_ android:orientation="horizontal">
<Space
android:layout_
android:layout_
android:layout_weight="1" />
<Button
android:layout_
android:layout_
android:text="Button 1" />
<Space
android:layout_
android:layout_
android:layout_weight="1" />
<Button
android:layout_
android:layout_
android:layout_gravity="start"
android:text="Button 2" />
<Space
android:layout_
android:layout_
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_
android:layout_
android:orientation="horizontal"
>
<Space
android:layout_
android:layout_
android:layout_weight="1" />
<Button
android:layout_
android:layout_
android:text="Button 3" />
<Space
android:layout_
android:layout_
android:layout_weight="1" />
<Button
android:layout_
android:layout_
android:layout_gravity="start"
android:text="Button 4" />
<Space
android:layout_
android:layout_
android:layout_weight="1" />
</LinearLayout>
</GridLayout>
【讨论】:
这个列 1 的 GridLayout 在垂直方向上几乎是 LinearLayout。它使布局更加复杂。 GridLayout 应该简化和取消嵌套布局。 刚刚找到方法!机器人:layout_gravity="fill_horizontal"。如果您使用的是支持库,请将其更改为 grid:layout_gravity="fill_horizontal" 我同意 Win Myo Htet。这似乎是 Android 建议的答案,但我看不出它是如何对 LinearLayout 进行改进的。我认为 GridLayout 的原因是避免嵌套 LinearLayouts?现在我看不到有意义的 GridLayout 用例。 从 API 21 开始,支持重量 支持库中的 GridLayout 版本支持权重并且向后兼容 API 7。developer.android.com/reference/android/support/v7/widget/…【参考方案3】:Appcompat21 GridLayout
具有列和行的权重,可以像下面这样使用,像上图一样在网格布局中均匀地创建每个网格项。
<android.support.v7.widget.GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:grid="http://schemas.android.com/apk/res-auto"
android:layout_
android:layout_
android:layout_centerHorizontal="true"
grid:alignmentMode="alignBounds"
grid:columnCount="4" >
<Button android:layout_
style="?buttonStyle"
android:layout_
android:text="-1"
grid:layout_columnWeight="1"
grid:layout_rowWeight="1"
grid:layout_gravity="fill" />
...
</<android.support.v7.widget.GridLayout>
【讨论】:
如果我只有两列,你如何将子视图居中!compile "com.android.support:gridlayout-v7:$supportVersion"
在我的例子中,在添加编译指令之后 - 另外必须在 xml 中提供这个“包含”调用才能访问网格属性(如app:columnCount="2"
):xmlns:app="http://schemas.android.com/apk/lib/android.support.v7.widget.GridLayout"
【参考方案4】:
从 API 21 开始,不带 ScrollView 的 v7 支持库:
XML:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_
android:layout_
>
<GridLayout
android:layout_
android:layout_
android:columnCount="2"
>
<TextView
android:layout_
android:layout_
android:layout_columnWeight="1"
android:gravity="center"
android:layout_gravity="fill_horizontal"
android:background="@color/colorAccent"
android:text="Tile1" />
<TextView
android:layout_
android:layout_
android:layout_columnWeight="1"
android:gravity="center"
android:layout_gravity="fill_horizontal"
android:background="@color/colorPrimaryDark"
android:text="Tile2" />
<TextView
android:layout_
android:layout_
android:layout_columnWeight="1"
android:gravity="center"
android:layout_gravity="fill_horizontal"
android:background="@color/colorPrimary"
android:text="Tile3" />
<TextView
android:layout_
android:layout_
android:layout_columnWeight="1"
android:gravity="center"
android:layout_gravity="fill_horizontal"
android:background="@color/colorAccent"
android:text="Tile4" />
</GridLayout>
</ScrollView>
【讨论】:
【参考方案5】:您可以动态设置每个孩子的宽度:
GridLayout.LayoutParams params = (GridLayout.LayoutParams) child.getLayoutParams();
params.width = (parent.getWidth()/parent.getColumnCount()) -params.rightMargin - params.leftMargin;
child.setLayoutParams(params);
【讨论】:
似乎在useDefaultMargins="true"
时中断 - 与设置为 false
的它们完美配合【参考方案6】:
这是正确的答案
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/favorites_grid"
android:layout_
android:layout_
android:background="#00ff00"
android:rowCount="2"
android:columnCount="2">
<Button
android:text="Cell 0"
android:layout_row="0"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:textSize="14dip"
/>
<Button
android:text="Cell 1"
android:layout_row="0"
android:layout_column="1"
android:textSize="14dip"
android:layout_columnWeight="1"
android:layout_rowWeight="1"/>
<Button
android:text="Cell 2"
android:layout_row="1"
android:layout_column="0"
android:textSize="14dip"
android:layout_columnWeight="1"
android:layout_rowWeight="1"/>
<Button
android:text="Cell 3"
android:layout_row="1"
android:layout_column="1"
android:textSize="14dip"
android:layout_columnWeight="1"
android:layout_rowWeight="1"/>
</GridLayout>
【讨论】:
抱歉这么晚才发表评论,但请为您的回答添加一点解释 属性 layout_columnWeight 仅用于 API 级别 21 及更高级别【参考方案7】:尝试将以下内容添加到您的 GridLayout 规范中。应该可以的。
android:useDefaultMargins="true"
【讨论】:
这样,我又可以称它为GridLayout了! 应该但实际上没有。【参考方案8】:我终于找到了解决办法。正如Rotemmiz所说,你必须在之后动态地进行。此代码拉伸按钮以水平填充视图,但垂直方向也可以这样做。
public void fillview(android.support.v7.widget.GridLayout gl)
Button buttontemp;
//Stretch buttons
int idealChildWidth = (int) ((gl.getWidth()-20*gl.getColumnCount())/gl.getColumnCount());
for( int i=0; i< gl.getChildCount();i++)
buttontemp = (Button) gl.getChildAt(i);
buttontemp.setWidth(idealChildWidth);
(20 用于内部和外部填充和边距。这可以更普遍地完成,但这样更干净)
那么可以这样调用:
android.support.v7.widget.GridLayout gl = (android.support.v7.widget.GridLayout)findViewById(R.id.buttongrid);
ViewTreeObserver vto = gl.getViewTreeObserver();
vto.addOnGlobalLayoutListener(new OnGlobalLayoutListener() @Override public void onGlobalLayout()
android.support.v7.widget.GridLayout gl = (android.support.v7.widget.GridLayout) findViewById(R.id.buttongrid);
fillview(gl);
ViewTreeObserver obs = gl.getViewTreeObserver();
obs.removeGlobalOnLayoutListener(this);
);
这必须通过观察者来完成,因为我们需要等待视图被绘制,然后才能调用视图。
【讨论】:
【参考方案9】:在我的例子中,我是动态添加按钮的,所以我的解决方案需要一些 XML 部分和一些 Java 部分。我不得不从几个不同的地方找到并混合解决方案,并认为我会在这里分享它,以便寻找类似解决方案的其他人会发现它很有帮助。
我的布局文件 XML 的第一部分...
<android.support.v7.widget.GridLayout
xmlns:grid="http://schemas.android.com/apk/res-auto"
android:id="@+id/gl_Options"
android:layout_
android:layout_
grid:useDefaultMargins="true">
</android.support.v7.widget.GridLayout>
grid:useDefaultMargins="true"
不是必需的,但我添加了因为这对我来说看起来更好,您可以应用这里的一些答案中提到的其他视觉效果(例如填充)。现在是按钮,因为我必须动态添加它们。这是制作这些按钮的代码的 Java 部分,我只包括与此上下文相关的那些行。假设我必须从尽可能多的 myOptions
中制作按钮,以便我的代码可用,并且我也没有复制 OnClickListener 代码。
import android.support.v7.widget.GridLayout; //Reference to Library
public class myFragment extends Fragment
GridLayout gl_Options;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
gl_AmountOptions = (GridLayout)view.findViewById( R.id.gl_AmountOptions );
...
gl_Options.removeAllViews(); // Remove all existing views
gl_AmountOptions.setColumnCount( myOptions.length <= 9 ? 3: 4 ); // Set appropriate number of columns
for( String opt : myOptions )
GridLayout.LayoutParams lParams = new GridLayout.LayoutParams( GridLayout.spec( GridLayout.UNDEFINED, 1f), GridLayout.spec( GridLayout.UNDEFINED, 1f));
// The above defines LayoutParameters as not specified Column and Row with grid:layout_columnWeight="1" and grid:layout_rowWeight="1"
lParams.width = 0; // Setting width to "0dp" so weight is applied instead
Button b = new Button(this.getContext());
b.setText( opt );
b.setLayoutParams(lParams);
b.setOnClickListener( myClickListener );
gl_Options.addView( b );
由于我们使用的是支持库中的 GridLayout 而不是标准的 GridLayout,因此我们必须在 YourProject.grade
文件中告知等级。
dependencies
compile 'com.android.support:appcompat-v7:23.4.0'
...
compile 'com.android.support:gridlayout-v7:23.4.0'
【讨论】:
只有当 grid:useDefaultMargins 为 false 时,带有 GridLayout.spec( GridLayout.UNDEFINED, 1f) 的 GridLayout.LayoutParams 才有效。此外,lParams.width = 0 似乎没有用,因为宽度和高度由 LayoutParams 设置。【参考方案10】:您可以通过覆盖 ViewGroup onLayout 方法来加快速度。 这是我的通用解决方案:
package your.app.package;
import android.content.Context;
import android.view.ViewGroup;
public class GridLayout extends ViewGroup
public GridLayout(Context context)
super(context);
@Override
protected void onLayout(boolean changed, int l, int t, int r, int b)
final int columns = 2;//edit this if you need different grid
final int rows = 2;
int children = getChildCount();
if (children != columns * rows)
throw new IllegalStateException("GridLayout must have " + columns * rows + " children");
int width = getWidth();
int height = getHeight();
int viewWidth = width / columns;
int viewHeight = height / rows;
int rowIndex = 0;
int columnIndex = 0;
for (int i = 0; i < children; i++)
getChildAt(i).layout(viewWidth * columnIndex, viewHeight * rowIndex, viewWidth * columnIndex + viewWidth, viewHeight * rowIndex + viewHeight);
columnIndex++;
if (columnIndex == columns)
columnIndex = 0;
rowIndex++;
编辑: 不要忘记孩子的 match_parent!
android:layout_
android:layout_
【讨论】:
可能不错,但需要支持儿童填充和边距 支持子级填充,因为它是在子级上设置的属性。要添加边距支持,只需修改具有“布局”功能的行如下(其中边距变量是以像素为单位的边距):getChildAt(i).layout(viewWidth * columnIndex + margin, viewHeight * rowIndex + margin, viewWidth * columnIndex + viewWidth - margin, viewHeight * rowIndex + viewHeight - margin);
【参考方案11】:
我能找到的最佳解决方案是为您想要的每一行使用线性布局(水平),并在其中将按钮(单元格)宽度分配给 0dp,将权重分配给 1。对于每个线性布局(行)将高度指定为 0dp,将权重指定为 1。 找到下面的代码 - 也 android:layout_gravity="center_vertical" 用于将按钮排成一行,以防它们包含可变长度的文本。 使用 0dp 并对其进行加权是一个非常简洁但不太为人所知的技巧。
<LinearLayout
android:id="@+id/parent_layout"
android:layout_
android:layout_
android:background="@drawable/button_bue_3d"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/layout_row1"
android:layout_
android:layout_
android:layout_weight="1"
android:orientation="horizontal" >
<Button
android:id="@+id/button1"
style="?android:attr/buttonStyleSmall"
android:layout_
android:layout_
android:layout_weight="1"
android:clickable="false"
android:layout_gravity="center_vertical"
android:text="ssssssssssssssssssssssssss" />
<Button
android:id="@+id/button2"
style="?android:attr/buttonStyleSmall"
android:clickable="false"
android:layout_
android:layout_
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:text="sggggggg" />
</LinearLayout>
<LinearLayout
android:id="@+id/layout_row2"
android:layout_weight="1"
android:layout_
android:layout_
android:orientation="horizontal" >
<Button
android:id="@+id/button3"
style="?android:attr/buttonStyleSmall"
android:layout_
android:layout_
android:layout_weight="1"
android:layout_gravity="center_vertical"
android:text="s" />
<Button
android:id="@+id/button4"
style="?android:attr/buttonStyleSmall"
android:layout_
android:layout_
android:layout_weight="1"
android:clickable="false"
android:layout_gravity="center_vertical"
android:text="s" />
</LinearLayout>
</LinearLayout>
【讨论】:
【参考方案12】:你来了:
Button button = new Button(this);
// weight = 1f , gravity = GridLayout.FILL
GridLayout.LayoutParams param= new GridLayout.LayoutParams(GridLayout.spec(
GridLayout.UNDEFINED,GridLayout.FILL,1f),
GridLayout.spec(GridLayout.UNDEFINED,GridLayout.FILL,1f));
// Layout_height = 0 ,Layout_weight = 0
params.height =0;
params.width = 0;
button.setLayoutParams(param);
【讨论】:
【参考方案13】:结果:
试试这样的:
final int MAX_COLUMN = gridView.getColumnCount(); //5
final int MAX_ROW = gridView.getRowCount(); //7
final int itemsCount = MAX_ROW * MAX_COLUMN; //35
int row = 0, column = 0;
for (int i = 0; i < itemsCount; i++)
ImageView view = new ImageView(this);
//Just to provide alternate colors
if (i % 2 == 0)
view.setBackgroundColor(Color.RED);
else
view.setBackgroundColor(Color.GREEN);
GridLayout.LayoutParams params = new GridLayout.LayoutParams(GridLayout.spec(row, 1F), GridLayout.spec(column, 1F));
view.setLayoutParams(params);
gridView.addView(view);
column++;
if (column >= MAX_COLUMN)
column = 0;
row++;
如果您想要单元格的特定宽度和高度,请使用:
params.width = 100; // Your width
params.height = 100; //your height
【讨论】:
【参考方案14】:我有同样的问题,我认为只是以编程方式设置宽度和高度:
使用metrics.widthPixels / 2 metrics设置按钮的宽度是DisplayMetrics的对象。
GridLayout gridLayout=findViewById(R.id.grid);
for (int i = 0; i <gridLayout.getChildCount() ; i++)
View view= gridLayout.getChildAt(i);
if(view instanceof Button)
Button btn = (Button) view;
btn.setWidth(200);//metrics.widthPixels / 2
btn.setHeight(200);//metrics.heightPixels / 7
【讨论】:
【参考方案15】:我想要一个居中的表格,其中标签右对齐,值左对齐。额外的空间应该在桌子周围。经过大量试验并且没有遵循文档所说的我应该做的事情,我想出了一些可行的方法。这是我所做的:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_
android:layout_
android:layout_gravity="center_horizontal"
android:orientation="vertical" >
<GridLayout
android:layout_
android:layout_
android:columnCount="2"
android:orientation="horizontal"
android:useDefaultMargins="true" >
<TextView
android:layout_gravity="right"
android:text="Short label:" />
<TextView
android:id="@+id/start_time"
android:layout_gravity="left"
android:text="Long extended value" />
<TextView
android:layout_gravity="right"
android:text="A very long extended label:" />
<TextView
android:id="@+id/elapsed_time"
android:layout_gravity="left"
android:text="Short value" />
</GridLayout>
这似乎可行,但 GridLayout 显示消息:
“此 GridLayout 布局或其 LinearLayout 父级无用”
不知道为什么它对我有用时“无用”。
我不确定这为什么有效,或者这是否是一个好主意,但如果您尝试它并且可以提供更好的主意、小的改进或解释它为什么有效(或不会有效),我将不胜感激回馈。
谢谢。
【讨论】:
这在布局编辑器中看起来不错,但运行时失败。 :-( “父级无用”消息是因为您在 wrap_content 中有一个 wrap_content ,据我所知,它是其中唯一的元素。【参考方案16】:这是一个相当古老的问题,但显然很多人都感兴趣。对于像这样的 4 个按钮的简单布局,似乎 TableLayout 是实现所需结果的最简单方法。
下面是一些示例代码,显示了一个表的前 2 行,其中 6 列跨越其父级的宽度。每个单元格中的 LinearLayout 和 ImageView 用于允许在单元格内“打开和关闭”图像,同时保持单元格的颜色。
<TableLayout
android:layout_
android:layout_
android:stretchColumns="1,2,3,4,5,6"
android:background="@drawable/vertical_radio_button_background"
android:padding="2dp">
<TableRow
android:layout_
android:layout_>
<LinearLayout
android:id="@+id/brown"
android:tag="13"
android:layout_
android:layout_
android:gravity="center_horizontal"
android:layout_margin="1dp"
android:layout_column="1"
android:background="@color/brown">
<ImageView
android:layout_
android:layout_
android:padding="5dp"
android:src="@drawable/selected_check"
android:visibility="invisible"/>
</LinearLayout>
<LinearLayout
android:id="@+id/maraschino"
android:tag="9"
android:layout_
android:layout_
android:gravity="center_horizontal"
android:layout_margin="1dp"
android:layout_column="2"
android:background="@color/maraschino">
<ImageView
android:layout_
android:layout_
android:padding="5dp"
android:src="@drawable/selected_check"
android:visibility="invisible"/>
</LinearLayout>
<LinearLayout
android:id="@+id/cayenne"
android:tag="22"
android:layout_
android:layout_
android:gravity="center_horizontal"
android:layout_margin="1dp"
android:layout_column="3"
android:background="@color/cayenne">
<ImageView
android:layout_
android:layout_
android:padding="5dp"
android:src="@drawable/selected_check"
android:visibility="invisible"/>
</LinearLayout>
<LinearLayout
android:id="@+id/maroon"
android:tag="18"
android:layout_
android:layout_
android:gravity="center_horizontal"
android:layout_margin="1dp"
android:layout_column="4"
android:background="@color/maroon">
<ImageView
android:layout_
android:layout_
android:padding="5dp"
android:src="@drawable/selected_check"
android:visibility="invisible"/>
</LinearLayout>
<LinearLayout
android:id="@+id/plum"
android:tag="3"
android:layout_
android:layout_
android:gravity="center_horizontal"
android:layout_margin="1dp"
android:layout_column="5"
android:background="@color/plum">
<ImageView
android:layout_
android:layout_
android:padding="5dp"
android:src="@drawable/selected_check"
android:visibility="invisible"/>
</LinearLayout>
<LinearLayout
android:id="@+id/eggplant"
android:tag="15"
android:layout_
android:layout_
android:gravity="center_horizontal"
android:layout_margin="1dp"
android:layout_column="6"
android:background="@color/eggplant">
<ImageView
android:layout_
android:layout_
android:padding="5dp"
android:src="@drawable/selected_check"
android:visibility="invisible"/>
</LinearLayout>
</TableRow>
<TableRow
android:layout_
android:layout_>
<LinearLayout
android:id="@+id/plum2"
android:layout_
android:layout_
android:gravity="center_horizontal"
android:layout_margin="1dp"
android:layout_column="1"
android:background="@color/plum">
<ImageView
android:layout_
android:layout_
android:padding="5dp"
android:src="@drawable/selected_check"
android:visibility="invisible"/>
</LinearLayout>
<LinearLayout
android:id="@+id/lavender"
android:tag="14"
android:layout_
android:layout_
android:gravity="center_horizontal"
android:layout_margin="1dp"
android:layout_column="2"
android:background="@color/lavender">
<ImageView
android:layout_
android:layout_
android:padding="5dp"
android:src="@drawable/selected_check"
android:visibility="invisible"/>
</LinearLayout>
<LinearLayout
android:id="@+id/carnation"
android:tag="16"
android:layout_
android:layout_
android:gravity="center_horizontal"
android:layout_margin="1dp"
android:layout_column="3"
android:background="@color/carnation">
<ImageView
android:layout_
android:layout_
android:padding="5dp"
android:src="@drawable/selected_check"
android:visibility="invisible"/>
</LinearLayout>
<LinearLayout
android:id="@+id/light_pink"
android:tag="23"
android:layout_
android:layout_
android:gravity="center_horizontal"
android:layout_margin="1dp"
android:layout_column="4"
android:background="@color/light_pink">
<ImageView
android:layout_
android:layout_
android:padding="5dp"
android:src="@drawable/selected_check"
android:visibility="invisible"/>
</LinearLayout>
<LinearLayout
android:id="@+id/strawberry"
android:tag="10"
android:layout_
android:layout_
android:gravity="center_horizontal"
android:layout_margin="1dp"
android:layout_column="5"
android:background="@color/strawberry">
<ImageView
android:layout_
android:layout_
android:padding="5dp"
android:src="@drawable/selected_check"
android:visibility="invisible"/>
</LinearLayout>
<LinearLayout
android:id="@+id/magenta"
android:tag="20"
android:layout_
android:layout_
android:gravity="center_horizontal"
android:layout_margin="1dp"
android:layout_column="6"
android:background="@color/magenta">
<ImageView
android:layout_
android:layout_
android:padding="5dp"
android:src="@drawable/selected_check"
android:visibility="invisible"/>
</LinearLayout>
</TableRow>
</TableLayout>
【讨论】:
【参考方案17】:这是没有按钮的更多默认应用程序的代码,这对我来说非常方便
<GridLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_
android:layout_
android:columnCount="1"
>
<TextView
android:text="2x2 button grid"
android:textSize="32dip"
android:layout_gravity="center_horizontal" />
<LinearLayout
android:layout_
android:layout_
android:orientation="horizontal">
<Space
android:layout_
android:layout_
android:layout_weight="1" />
<TextView
android:layout_
android:layout_
android:text="Naam" />
<Space
android:layout_
android:layout_
android:layout_weight="1" />
<TextView
android:layout_
android:layout_
android:layout_gravity="start"
android:text="@viewModel.selectedItem.test2" />
<Space
android:layout_
android:layout_
android:layout_weight="1" />
</LinearLayout>
<LinearLayout
android:layout_
android:layout_
android:orientation="horizontal"
>
<Space
android:layout_
android:layout_
android:layout_weight="1" />
<TextView
android:layout_
android:layout_
android:text="Nummer" />
<Space
android:layout_
android:layout_
android:layout_weight="1" />
<TextView
android:layout_
android:layout_
android:layout_gravity="start"
android:text="@viewModel.selectedItem.test" />
<Space
android:layout_
android:layout_
android:layout_weight="1" />
</LinearLayout>
</GridLayout>
【讨论】:
【参考方案18】:这是一个例子
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_
android:layout_
tools:context=".GridMenuActivity">
<ScrollView
android:layout_
android:layout_
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:layout_
android:layout_
android:background="#FFFFFF"
android:orientation="vertical"
android:weightSum="10">
<RelativeLayout
android:layout_
android:layout_
android:layout_weight="2"
android:background="@drawable/oval_background">
<ImageView
android:id="@+id/imageView6"
android:layout_
android:layout_
android:layout_centerInParent="true"
android:layout_margin="5dp"
app:srcCompat="@mipmap/dmm_logo" />
</RelativeLayout>
<GridLayout
android:id="@+id/mainGrid"
android:layout_
android:layout_
android:layout_weight="8"
android:alignmentMode="alignBounds"
android:columnCount="2"
android:columnOrderPreserved="true"
android:padding="5dp"
android:rowCount="5">
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_row="0"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="16dp"
android:clickable="true"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardCornerRadius="8dp"
app:cardElevation="3dp">
<LinearLayout
android:layout_
android:layout_
android:layout_gravity="center"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_
android:layout_
android:layout_gravity="center_horizontal"
android:src="@drawable/ic_dashboard" />
<TextView
android:layout_
android:layout_
android:text="Dashboard"
android:textAlignment="center"
android:textColor="@color/colorPrimary"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:gravity="center"
android:text="Add Entry"
android:textSize="10sp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_row="0"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="16dp"
android:clickable="true"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardCornerRadius="8dp"
app:cardElevation="3dp">
<LinearLayout
android:layout_
android:layout_
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_
android:layout_
android:layout_gravity="center_horizontal"
android:src="@drawable/ic_sell" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:text="Sale Forecast"
android:textAlignment="center"
android:textColor="@color/colorPrimary"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:gravity="center"
android:text="Upcoming Milk Requirement"
android:textSize="10sp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_row="1"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="16dp"
android:clickable="true"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardCornerRadius="8dp"
app:cardElevation="3dp">
<LinearLayout
android:layout_
android:layout_
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_
android:layout_
android:layout_gravity="center_horizontal"
android:src="@drawable/ic_seller" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:text="Sellers"
android:textAlignment="center"
android:textColor="@color/colorPrimary"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:gravity="center"
android:text="Milk Providers"
android:textSize="10sp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_row="1"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="16dp"
android:clickable="true"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardCornerRadius="8dp"
app:cardElevation="3dp">
<LinearLayout
android:layout_
android:layout_
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_
android:layout_
android:layout_gravity="center_horizontal"
android:src="@drawable/ic_shopping" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:text="Purchasers"
android:textColor="@color/colorPrimary"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:text="Milk Consumers"
android:textSize="10sp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<!-- Row 2 -->
<!-- Column 1 -->
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_row="2"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="16dp"
android:clickable="true"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardCornerRadius="8dp"
app:cardElevation="3dp">
<LinearLayout
android:layout_
android:layout_
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_
android:layout_
android:layout_gravity="center_horizontal"
android:src="@drawable/ic_advance" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:text="Advance"
android:textColor="@color/colorPrimary"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:text="Advance Payments"
android:textSize="10sp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<!-- Column 2 -->
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_row="2"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="16dp"
android:clickable="true"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardCornerRadius="8dp"
app:cardElevation="3dp">
<LinearLayout
android:layout_
android:layout_
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_
android:layout_
android:layout_gravity="center_horizontal"
android:src="@drawable/ic_reciever" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:text="Due"
android:textColor="@color/colorPrimary"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:text="Pending Payments"
android:textSize="10sp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_row="3"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="16dp"
android:clickable="true"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardCornerRadius="8dp"
app:cardElevation="3dp">
<LinearLayout
android:layout_
android:layout_
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_
android:layout_
android:layout_gravity="center_horizontal"
android:src="@drawable/ic_transaction" />
<TextView
android:layout_
android:layout_
android:text="Transactions"
android:layout_gravity="center"
android:textColor="@color/colorPrimary"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:text="Payments Detalis"
android:textSize="10sp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_row="3"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="16dp"
android:clickable="true"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardCornerRadius="8dp"
app:cardElevation="3dp">
<LinearLayout
android:layout_
android:layout_
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_
android:layout_
android:layout_gravity="center_horizontal"
android:src="@drawable/ic_sell" />
<TextView
android:layout_
android:layout_
android:text="Sell Product"
android:layout_gravity="center"
android:textColor="@color/colorPrimary"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:text="Ghee, Curd etc."
android:textSize="10sp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_row="4"
android:layout_rowWeight="1"
android:layout_column="0"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="16dp"
android:clickable="true"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardCornerRadius="8dp"
app:cardElevation="3dp">
<LinearLayout
android:layout_
android:layout_
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_
android:layout_
android:layout_gravity="center_horizontal"
android:src="@drawable/ic_purchase_report" />
<TextView
android:layout_
android:layout_
android:text="Purchases"
android:layout_gravity="center"
android:textColor="@color/colorPrimary"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:text="Milk Purchase Entries"
android:textSize="10sp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_row="4"
android:layout_rowWeight="1"
android:layout_column="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="16dp"
android:clickable="true"
android:focusable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardCornerRadius="8dp"
app:cardElevation="3dp">
<LinearLayout
android:layout_
android:layout_
android:layout_gravity="center_horizontal|center_vertical"
android:layout_margin="16dp"
android:orientation="vertical">
<ImageView
android:layout_
android:layout_
android:layout_gravity="center_horizontal"
android:src="@drawable/ic_sale_report" />
<TextView
android:layout_
android:layout_
android:text="Sales"
android:layout_gravity="center"
android:textColor="@color/colorPrimary"
android:textSize="16sp"
android:textStyle="bold" />
<TextView
android:layout_
android:layout_
android:layout_gravity="center"
android:text="Milk Sale Entries"
android:textSize="10sp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</GridLayout>
</LinearLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
非常适合我。 希望对你也有帮助
【讨论】:
【参考方案19】:Trial and error 中关于网格布局的一些提示。
-
默认网格布局在最小 SDK 21+ 上效果最佳。
GridLayout 的高度/宽度应该是固定的或
match_parent
。这是因为 Grid 布局会计算其子项的高度/宽度,并且其自身的可变高度可能会导致计算精确高度时出现问题。李>
默认情况下,网格布局会忽略孩子的边距,因此如果我们希望孩子控制他们的边距,我们应该使用 android:useDefaultMargins="true"
。
要使用网格布局创建动态、自动拉伸的视图组,请执行以下任一操作:
-
父级将同时控制:总组的最大高度和每行中的元素数或
父级将控制每行的列数,子级将控制总高度。
第一个场景的优点是我们可以在组中添加任意数量的孩子,他们都会很好地均匀地伸展。缺点是我们得到了一个固定大小的组。内容大的孩子也占据固定的空间。
第二种情况的好处是我们可以添加更多的孩子,他们将决定组的高度。在父级顶部附加嵌套滚动视图将使整个元素列表可滚动。 缺点是孩子控制组的高度和可变高度,可能会导致整个视图看起来凌乱。
如果我们稍微调整一下,这两种情况都可以发挥它们的优势,并且可以最大限度地减少它们的劣势。
第一个场景的例子:
<GridLayout
android:layout_
android:layout_
android:columnCount="2"
android:useDefaultMargins="true">
<View
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginHorizontal="8dp"
android:layout_marginVertical="8dp"
android:background="@color/black" />
<View
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginHorizontal="8dp"
android:layout_marginVertical="8dp"
android:background="@color/black" />
<View
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnSpan="2"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginHorizontal="8dp"
android:layout_marginVertical="8dp"
android:background="@color/black" />
<View
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginHorizontal="8dp"
android:layout_marginVertical="8dp"
android:background="@color/black" />
<View
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnSpan="1"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginHorizontal="8dp"
android:layout_marginVertical="8dp"
android:background="@color/black" />
<View
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnSpan="2"
android:layout_columnWeight="1"
android:layout_gravity="fill"
android:layout_marginHorizontal="8dp"
android:layout_marginVertical="8dp"
android:background="@color/black" />
<!--
add more elements here with same attributes and they will fit on their own!
-->
</GridLayout>
输出:
第二种情况:
<?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_
android:layout_
tools:ignore="HardcodedText"
>
<GridLayout
android:layout_
android:layout_
android:columnCount="2"
android:orientation="horizontal"
android:useDefaultMargins="true"
>
<TextView
android:layout_
android:layout_
android:layout_columnSpan="1"
android:text="this is a text"
android:textColor="@color/white"
android:layout_gravity="center"
android:layout_margin="8dp"
android:background="@color/black"
/>
<TextView
android:layout_
android:layout_
android:layout_columnSpan="1"
android:layout_gravity="fill_horizontal"
android:text="this is something cool. this should be taking more space but it is also controlling the total height of row"
android:textColor="@color/white"
android:gravity="center"
android:layout_margin="8dp"
android:background="@color/black"
/>
<TextView
android:layout_
android:layout_
android:layout_columnSpan="1"
android:layout_gravity="fill_horizontal"
android:text="once the width is determined by any child, the whole column shall take the same height"
android:textColor="@color/white"
android:gravity="center"
android:layout_margin="8dp"
android:background="@color/black"
/>
<TextView
android:layout_
android:layout_
android:layout_columnSpan="1"
android:layout_gravity="fill"
android:text="this column can only control how they shall look by layout gravity. this should look like column 0,0 but its taking full row height/width"
android:textColor="@color/white"
android:gravity="center"
android:layout_margin="8dp"
android:background="@color/black"
/>
<!--
-->
</GridLayout>
</FrameLayout>
输出:
【讨论】:
【参考方案20】:main.xml
<GridLayout
android:id="@+id/grid_related_news"
android:layout_
android:layout_
android:layout_marginTop="8dp"
android:padding="3dp"
android:columnCount="2">
</GridLayout>
item.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:layout_
android:layout_
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_columnWeight="1"
android:gravity="center"
android:padding="3dp"
android:layout_gravity="fill_horizontal"
xmlns:android="http://schemas.android.com/apk/res/android">
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:background="@color/white"
app:cardBackgroundColor="@color/white"
app:cardCornerRadius="5dp"
app:cardElevation="2dp"
android:layout_margin="4dp">
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_
android:layout_>
<ImageView
android:id="@+id/img_related_news"
android:layout_
android:layout_
android:layoutDirection="rtl"
android:scaleType="centerCrop"
app:layout_constraintDimensionRatio="H,1:1"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@drawable/light_gray" />
<LinearLayout
android:layout_
android:layout_
android:background="#59000000"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/txt_related_news_title"
android:layout_
android:layout_
android:layout_marginStart="12dp"
android:layout_marginTop="6dp"
android:layout_marginEnd="12dp"
android:layout_marginBottom="12dp"
android:elevation="2dp"
android:fontFamily="@font/yekan_bold"
android:letterSpacing="-0.1"
android:lineSpacingExtra="4dp"
android:maxLines="4"
android:textColor="@color/white"
android:textSize="13sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
tools:text="@string/lorem_ipsum_sentence" />
</androidx.constraintlayout.widget.ConstraintLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
java
GridLayout grid_related_news = findViewById(R.id.grid_related_news);
View view = LayoutInflater.from(this).inflate(R.layout.related_item, (ViewGroup) grid_related_news, false);
ImageView img_related_news = view.findViewById(R.id.img_related_news);
...
grid_related_news.addView(view);
你可以使用这个例子
【讨论】:
【参考方案21】: <GridLayout
android:layout_
android:layout_weight="3"
android:columnCount="2"
android:padding="10dp"
android:rowCount="3"
android:background="@drawable/background_down"
android:layout_>
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_margin="10dp"
android:elevation="10dp"
app:cardCornerRadius="15dp"
>
<LinearLayout
android:weightSum="3"
android:layout_
android:layout_
android:orientation="vertical"
>
<ImageView
android:layout_weight="2"
android:layout_
android:layout_
android:layout_margin="15dp"
android:src="@drawable/user" />
<TextView
android:layout_
android:layout_
android:text="Users"
android:textSize="16sp"
android:layout_marginStart="15dp"
android:layout_marginLeft="15dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_margin="10dp"
android:elevation="10dp"
app:cardCornerRadius="15dp"
>
<LinearLayout
android:weightSum="3"
android:layout_
android:layout_
android:orientation="vertical"
>
<ImageView
android:layout_weight="2"
android:layout_
android:layout_
android:layout_margin="15dp"
android:src="@drawable/addusers" />
<TextView
android:layout_
android:layout_
android:text="Add Users"
android:textSize="16sp"
android:layout_marginStart="15dp"
android:layout_marginLeft="15dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_margin="10dp"
android:elevation="10dp"
app:cardCornerRadius="15dp"
>
<LinearLayout
android:weightSum="3"
android:layout_
android:layout_
android:orientation="vertical"
>
<ImageView
android:layout_weight="2"
android:layout_
android:layout_
android:layout_margin="15dp"
android:src="@drawable/newspaper" />
<TextView
android:layout_
android:layout_
android:text="Report"
android:textSize="16sp"
android:layout_marginStart="15dp"
android:layout_marginLeft="15dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
<androidx.cardview.widget.CardView
android:layout_
android:layout_
android:layout_columnWeight="1"
android:layout_rowWeight="1"
android:layout_margin="10dp"
android:elevation="10dp"
app:cardCornerRadius="5dp"
>
<LinearLayout
android:weightSum="3"
android:layout_
android:layout_
android:orientation="vertical"
>
<ImageView
android:layout_weight="2"
android:layout_
android:layout_
android:layout_margin="15dp"
android:src="@drawable/settings" />
<TextView
android:layout_
android:layout_
android:text="Settings"
android:textSize="16sp"
android:layout_marginStart="15dp"
android:layout_marginLeft="15dp" />
</LinearLayout>
</androidx.cardview.widget.CardView>
</GridLayout>
你可以在这里找到完整的教程, Android Grid Layout With CardView and OnItemClickListener
【讨论】:
【参考方案22】:对我来说,我只是将layout_width
和layout_height
更改为wrap_content
并将layout_gravity
设置为center_horizontal
:
<GridLayout
android:id="@+id/gridLayout"
android:layout_
android:layout_
android:layout_gravity="center_horizontal"
android:columnCount="2"
android:rowCount="4">
【讨论】:
【参考方案23】:这可以通过相等的layout_columnWeight
& layout_rowWeight
来完成
布局:
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:grid="http://schemas.android.com/apk/tools"
android:layout_
android:layout_
android:columnCount="3">
<Button
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:gravity="center"
android:text="item 0x0"
grid:layout_column="0"
grid:layout_gravity="center"
grid:layout_row="0" />
<Button
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:gravity="center"
android:text="item 0x1"
grid:layout_column="1"
grid:layout_gravity="center"
grid:layout_row="0" />
<Button
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:gravity="center"
android:text="item 0x2"
grid:layout_column="2"
grid:layout_gravity="center"
grid:layout_row="0" />
<Button
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:gravity="center"
android:text="item 1x0"
grid:layout_column="0"
grid:layout_gravity="center"
grid:layout_row="1" />
<Button
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:gravity="center"
android:text="item 1x1"
grid:layout_column="1"
grid:layout_gravity="center"
grid:layout_row="1" />
<Button
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:gravity="center"
android:text="item 1x2"
grid:layout_column="2"
grid:layout_gravity="center"
grid:layout_row="1" />
<Button
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:gravity="center"
android:text="item 2x0"
grid:layout_column="0"
grid:layout_gravity="center"
grid:layout_row="2" />
<Button
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:gravity="center"
android:text="item 2x1"
grid:layout_column="1"
grid:layout_gravity="center"
grid:layout_row="2" />
<Button
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:gravity="center"
android:text="item 2x2"
grid:layout_column="2"
grid:layout_gravity="center"
grid:layout_row="2" />
<Button
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:gravity="center"
android:text="item 3x0"
grid:layout_column="0"
grid:layout_gravity="center"
grid:layout_row="3" />
<Button
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:gravity="center"
android:text="item 3x1"
grid:layout_column="1"
grid:layout_gravity="center"
grid:layout_row="3" />
<Button
android:layout_
android:layout_
android:layout_rowWeight="1"
android:layout_columnWeight="1"
android:gravity="center"
android:text="item 3x2"
grid:layout_column="2"
grid:layout_gravity="center"
grid:layout_row="3" />
</GridLayout>
结果
【讨论】:
【参考方案24】:我刚刚从网格视图中制作了简单的网格布局,并在想为什么我以前没有这样做。这很容易实现。 (我在示例中使用自定义包装器 CSView,但只是将其更改为 View)。 Ops 要求仅适用于 GridView,因此我将其发布在这里作为答案。因此,以numColumns:auto_fit android:numColumns=2
为例,使拉伸均匀。
用法:
CSGridLayout(this, R.id.sound_store_grid, SubscriptionUpgradeStoreDialogItem(this),
PresetUpgradeStoreDialogItem(this), MidiUpgradeStoreDialogItem(this))
实施:
class CSGridLayout(parent: CSActivityView<*>,
viewId: Int,
vararg items: CSView<*>) : CSView<GridView>(parent, viewId)
private val items = list(items)
private var adapter = Adapter()
init
view.adapter = adapter
adapter.notifyDataSetChanged()
inner class Adapter : BaseAdapter()
override fun getCount() = items.size
override fun getViewTypeCount() = 1
override fun isEnabled(position: Int) = true
override fun getItem(position: Int) = items[position]
override fun getItemViewType(position: Int) = 0
override fun getItemId(position: Int) = position.toLong()
override fun getView(position: Int, toReuseView: View?, parent: ViewGroup) =
items[position].view
【讨论】:
【参考方案25】:这就是我所做的,我很高兴地说这对我有用。我也想要一个 2x2、3x3 等网格的项目来覆盖整个屏幕。网格布局不遵守屏幕的宽度。 LinearLayouts 有点工作,但你不能使用嵌套的权重。
对我来说最好的选择是使用 Fragments 我使用了this 教程来开始我想做的事情。
这是一些代码:
主要活动:
public class GridHolderActivity extends Activity
@Override
protected void onCreate(Bundle savedInstanceState)
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main_6);
activity_main_6 XML(膨胀 3 个片段)
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_
android:layout_
android:orientation="vertical">
<fragment
android:id="@+id/frag1"
android:layout_
android:layout_
android:layout_weight="1"
android:name=".TwoHorizontalGridFragment"
tools:layout="@layout/two_horiz" />
<fragment
android:id="@+id/frag2"
android:layout_
android:layout_
android:layout_weight="1"
android:name=".TwoHorizontalGridFragment"
tools:layout="@layout/two_horiz" />
<fragment
android:id="@+id/frag3"
android:layout_
android:layout_
android:layout_weight="1"
android:name=".Grid.TwoHorizontalGridFragment"
tools:layout="@layout/two_horiz" />
基本片段布局
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_
android:layout_gravity="center"
android:layout_>
<ImageQueue
android:layout_
android:layout_
android:id="@+id/img1"
android:layout_weight="1"/>
<ImageQueue
android:layout_
android:layout_
android:id="@+id/img2"
android:layout_weight="1"/>
</LinearLayout>
片段类(仅处理自定义视图的初始化)每个片段膨胀 2 个图块
public class TwoHorizontalGridFragment extends Fragment
private View rootView;
private ImageQueue imageQueue1;
private ImageQueue imageQueue2;
@Override
public View onCreateView(LayoutInflater inflater,
ViewGroup container, Bundle savedInstanceState)
/**
* Inflate the layout for this fragment
*/
rootView = inflater.inflate(
R.layout.two_horiz, container, false);
return rootView;
@Override
public void onActivityCreated(Bundle savedInstanceState)
super.onActivityCreated(savedInstanceState);
imageQueue1 = (ImageQueue)rootView.findViewById(R.id.img1);
imageQueue2 = (ImageQueue)rootView.findViewById(R.id.img2);
imageQueue1.updateFiles();
imageQueue2.updateFiles();
就是这样!
本质上,这是一个使用嵌套权重的奇怪工作。它给了我一个完美的 2x3 网格,填满了我的 10 英寸平板电脑和我的 HTC 机器人 DNA 的整个屏幕。让我知道你的情况!
【讨论】:
这是一个糟糕的方法,因为您有多个片段,这些片段具有很多复杂的结构来执行可以通过使用 gridview/gridlayout 来实现的简单任务。 OP 说他们需要一个 2x2 网格来放置几个按钮。你说得对,这太复杂了。对于具有更多文本、视图和其他内容的布局,片段是要走的路。此外,这仅在布局完全静态而不是动态构建时才有用。 现在 API 21 中对 GridLayouts 的支持更多了,这种方法有点矫枉过正以上是关于GridLayout(不是GridView)如何均匀拉伸所有孩子的主要内容,如果未能解决你的问题,请参考以下文章
如何从GridView或GridLayout中获取每个EditText中的每个值?
Gridview v7 对旧 api android.support.v7.widget.Gridlayout 的支持未能实例化