如何解决Android Studio 等效于 CSS 显示网格
在 CSS 中,我可以轻松创建如下图所示的网格:
.grid {
display: grid;
grid-template: repeat(2,1fr) / repeat(2,1fr);
width: 200px;
height: 200px;
margin: auto;
}
.grid > div {
border: 1px solid black;
text-align: center;
line-height: 100px;
}
<div class="grid">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</div>
我今天开始使用Android Studio,想达到类似的效果?我尝试过线性布局,但无法让它们换行或指定列数和行数。这是我到目前为止所拥有的:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/drawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:id="@+id/textView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="1" />
<TextView
android:id="@+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="2" />
<TextView
android:id="@+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="3" />
<TextView
android:id="@+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="4" />
</LinearLayout>
但它们都在一条线上,更像是一个 flexBox。似乎有一个网格布局,但它是遗留下来的,所以我假设它已经贬值了。如何制作像上面那样的网格布局,指定列数和行数?
解决方法
这是如何使用上述网格布局
安卓工作室:
MainActivity.xml
<?xml version="1.0 encoding="utf-8"?
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="2"
android:rowCount="2">
<TextView
android:id="@+id/textView"
android:layout_width="40dp"
android:layout_height="40dp"
android:text="1"
android:TextSize="25"
android:background="@drawable/border"
android:textAlignment="center"/>
<TextView
android:id="@+id/textView2"
android:layout_width="40dp"
android:layout_height="40dp"
android:text="2"
android:TextSize="25"
android:background="@drawable/border"
android:textAlignment="center"/>
<TextView
android:id="@+id/textView3"
android:layout_width="40dp"
android:layout_height="40dp"
android:text="3"
android:TextSize="25"
android:background="@drawable/border"
android:textAlignment="center"/>
<TextView
android:id="@+id/textView4"
android:layout_width="40dp"
android:layout_height="40dp"
android:text="4"
android:TextSize="25"
android:background="@drawable/border"
android:textAlignment="center"/>
</GridLayout>
</LinearLayout>
转到res文件并展开它,右键单击
drawable 并单击 Drawable 资源文件。在
可绘制资源文件写边框作为文件名
好吧。
边框.xml
<?XML version="1.0" encoding="utf-8"?
<shape
xmlns:android="http://schemas.android.com/apk/re
s/android"
android:shape="rectangle">
<solid
android: color="@android:color/white"/>
<stroke
android: width="2dp"/>
</shape>
,
根本不推荐使用 GridLayout
。
dependencies {
implementation "androidx.gridlayout:gridlayout:1.0.0"
}
这就是 XML:
<?xml version="1.0" encoding="utf-8"?>
<layout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<androidx.gridlayout.widget.GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:useDefaultMargins="true"
app:columnCount="2"
app:rowCount="2">
<TextView
app:layout_columnWeight="1.00"
app:layout_rowWeight="1.00"
android:gravity="center"
android:fontFamily="sans-serif-medium"
android:textColor="#000000"
android:textSize="32sp"
android:text="1"/>
<TextView
app:layout_columnWeight="1.00"
app:layout_rowWeight="1.00"
android:gravity="center"
android:fontFamily="sans-serif-medium"
android:textColor="#000000"
android:textSize="32sp"
android:text="2"/>
<TextView
app:layout_columnWeight="1.00"
app:layout_rowWeight="1.00"
android:gravity="center"
android:fontFamily="sans-serif-medium"
android:textColor="#000000"
android:textSize="32sp"
android:text="3"/>
<TextView
app:layout_columnWeight="1.00"
app:layout_rowWeight="1.00"
android:gravity="center"
android:fontFamily="sans-serif-medium"
android:textColor="#000000"
android:textSize="32sp"
android:text="4"/>
</androidx.gridlayout.widget.GridLayout>
</layout>
还有它的文档:androidx.gridlayout.widget
。
但是,对于动态项目,您可能希望将 RecyclerView
与 GridLayoutManager
一起使用。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。