安卓：水平居中网格视图

Question

安卓：水平居中网格视图

androidgridviewandroid-layout

9

我需要在我的android layout.xml中水平居中网格视图。我已经在谷歌上搜索了相当长的时间，但没有找到答案。

我只能通过更改strechMode来改变gridview的水平位置，但这样我的项目就不能靠近彼此。

我需要的是项目彼此靠近（没有空隙）并水平居中。我选择strechmode = none，所以现在我的项目彼此靠近，但它们位于屏幕左侧，我只想让它们水平居中。

这是我的布局xml：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="fill_parent" 
          android:layout_height="fill_parent"
          android:background="@drawable/background" 
          android:gravity="center">

<GridView android:id="@+id/lw_gridview" 
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:numColumns="3" 
          android:columnWidth="48dp"
          android:horizontalSpacing="0dp"
          android:verticalSpacing="0dp"
          android:stretchMode="none"
          />


</LinearLayout>

这是一个由图像适配器设置在网格视图上的图像片段：

imageView = new ImageView(context);
imageView.setLayoutParams(new GridView.LayoutParams(48,48)); //on medium density
imageView.setScaleType(ImageView.ScaleType.CENTER);
imageView.setPadding(0, 0, 0, 0);

如何成功？

- Judrius

4个回答

12

将GridView布局或样式的拉伸模式设置为columnWidth：

android:stretchMode="columnWidth"

列宽将会被拉伸以填充可用空间。您可以在一个透明容器中包装你的网格项，这个容器可以均匀地拉伸，同时保持可见内容的宽度。android:columnWidth属性将作为“最小列宽”来使用。这也适用于android:numColumns=auto_fit、android:horizontalSpacing和android:verticalSpacing。

根据您的网格项内容，您可能不想在内容周围添加透明容器。如果没有添加，内容宽度将均匀拉伸，在更多的设备上看起来可能更好。

- James Wald

1

透明容器的提示对我非常有帮助，使我的自适应列跨越了网格视图的宽度，但不会拉伸内容，因此列现在完美地适合屏幕，并且不再左对齐。感谢James Wald提供这个提示。 - homer_simpson

1

也许我来得有些晚，但如果你看到了这个问题（就像我一样），这是我解决问题所做的：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/emotions_header"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"/>

    <GridView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerVertical="true"/>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_alignParentEnd="true"/>
</RelativeLayout>

我的GridView在垂直方向上居中，另外两个TextView位于顶部和右下角。

更多信息：RelativeLayout,定位视图

- Manuel

1

你有检查过你的GridView在LinearLayout中的位置是否正确吗？尝试使用android:layout_gravity="center"来改变GridView的位置。此外，通过实验不同的android:gravity=和位置来更清楚地了解重力如何对布局产生影响。

- acm0x

gravity="center" 在父组件中可以使GridView垂直居中，但是水平方向上不会居中。在GridView中使用gravity="center"和gravity_layout="center"并没有效果。在其他组件中（非GridView），gravity可以正常工作 :) - Judrius

我告诉你我是怎么做的 - 我只是添加了一些边距（相同大小以在屏幕中心对齐）。 - acm0x

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Pēteris Caune · Accepted Answer

我手动居中了我的网格视图，通过计算并设置其填充来实现。以下是我的onCreate函数的内容：

获取屏幕宽度和屏幕像素密度
将单元格宽度和间距的常量值从 DIP 转换为像素
计算可以容纳的列数。

等式看起来像这样，numColumns是唯一未知变量：

numColumns * itemWidth + (numColumns - 1) * spacingBetweenItems + selectorPadding <= sreenWidth

已知numColumns，计算我网格视图实际需要的水平空间
已知网格视图的实际宽度，设置填充，使其居中于屏幕中央

以下是一些代码：

// Convert DIPs to pixels
DisplayMetrics metrics = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(metrics);
mSizePx = (int) Math.floor(SIZE_DIP * metrics.scaledDensity);
mSpacingPx = (int) Math.floor(SPACING_DIP * metrics.scaledDensity);

GridView gridview = (GridView) findViewById(R.id.gridview);
// Find out the extra space gridview uses for selector on its sides.
Rect p = new Rect();
gridview.getSelector().getPadding(p);
int selectorPadding = p.left + p.right;

// Determine the number of columns we can fit, given screen width,
// thumbnail width, and spacing between thumbnails.
int numColumns = (int) Math.floor(1f * (metrics.widthPixels - selectorPadding + mSpacingPx)
        / (mSizePx + mSpacingPx));

int contentWidth = numColumns * mSizePx; // Width of items
contentWidth += (numColumns - 1) * mSpacingPx; // Plus spaces between items
contentWidth += selectorPadding; // Plus extra space for selector on sides

// Now calculate amount of left and right margin so the grid gets
// centered. This is what we
// unfortunately cannot do with layout_width="wrap_content"
// and layout_gravity="center_horizontal"
int slack = metrics.widthPixels - contentWidth;

gridview.setNumColumns(numColumns);
gridview.setPadding(slack / 2, slack / 2, slack / 2, slack / 2);