首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >对齐安卓GridLayout

对齐安卓GridLayout
EN

Stack Overflow用户
提问于 2017-08-28 06:32:19
回答 7查看 1.7K关注 0票数 2

我需要GridLayout像这样对齐视图(浅蓝图标和文本是GridLayout中的视图):

但我的GridLayout对齐方式如下:

如果我设置了app:layout_columnWeight="1" and app:layout_rowWeight="1",我的GridLayout就会像这样对齐:

我的GridLayout xml:

代码语言:javascript
运行
复制
<android.support.v7.widget.GridLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="18dp"
            app:columnCount="7">

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Trilha"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Mergulho"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword3"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Praia"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword4"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Festas"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword5"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Parque de Diversões"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword6"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Relaxar"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword7"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Esportes Radicais"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword8"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Acampamento"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword9"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Off Road"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword10"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Passeio de Barco"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword11"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Restaurantes"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword12"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Show / Festival"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword13"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Resort / SPA"/>

            <com.motivapp.motivapp.customview.KeywordView
                android:id="@+id/keyword14"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                keyword:text="Locas Históricos"/>


        </android.support.v7.widget.GridLayout>

以及GridView内部的视图:

代码语言:javascript
运行
复制
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content">

    <com.motivapp.motivapp.customview.DefaultTextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/keywordTextView"
        android:textSize="18sp"
        android:text="Keyword"
        android:textColor="#839EC5"
        android:layout_gravity="center_horizontal"/>

    <ImageView
        android:layout_width="130dp"
        android:layout_height="130dp"
        android:layout_gravity="center_horizontal"
        android:src="@drawable/keyword_button"
        android:id="@+id/keywordButton"/>

</LinearLayout>

它是一个自定义视图,但现在,它什么也不做,只显示一个自定义文本视图和一个图像视图.我对GridLayout做了什么,像第一个图像一样对齐?

更新:

快解决我的问题了..。我改变了一些东西,现在只有一个视图不对齐。

我将app:layout_columnWeight="1"放在网格布局的所有视图上,并更改了自定义视图布局的重力和文本宽度:

代码语言:javascript
运行
复制
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center_vertical|center_horizontal">

    <com.motivapp.motivapp.customview.DefaultTextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/keywordTextView"
        android:textSize="16sp"
        android:text="Keyword"
        android:textColor="#839EC5"
        android:gravity="center"/>

    <ImageView
        android:layout_width="120dp"
        android:layout_height="120dp"
        android:src="@drawable/keyword_button"
        android:id="@+id/keywordButton"/>

</LinearLayout>

如何将所有这些视图集中起来?如何防止文本视图有一个大宽度和线段时,他强迫图像视图向下而不是中心对齐?

EN

Stack Overflow用户

发布于 2017-12-28 03:43:49

这里有一种方法。这假定您希望以父级为中心的GridView。如果它相对于其他东西需要居中,则必须修改代码。

我所做的只是子类onLayout并将网格视图“转换”到一个居中位置。

代码语言:javascript
运行
复制
public class GridViewCentering extends GridView
{
  public GridViewCentering (Context context, AttributeSet attrs)
  {
    super (context, attrs);
  }

  @Override
  protected void onLayout (boolean changed, int l, int t, int r, int b)
  {
    super.onLayout (changed, l, t, r, b);
    int parentW = ((ViewGroup)getParent ()).getMeasuredWidth();
    int w = getWidth ();
    int offset = (parentW - w) / 2;
    setTranslationX (offset);
  }
}
票数 1
EN
查看全部 7 条回答
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/45912929

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档