Android

Question

我在 android material 设计 api 工作并且想以网格格式显示一些数据。我尝试了 GridLayout 和 StaggeredGridlayout，两者看起来都一样。对于一般信息，我想问一下Gridlayout和StaggeredGridlayout有什么区别？

谢谢。

Answer 1

交错网格布局包括多列和多行不同大小。

它允许灵活的 column/row 带有页眉和页脚的视图并且看起来很容易实现，尽管 Gradle 用户会比使用 Eclipse 和 Ant 的用户更轻松。这是视图在 Etsy Github app 中的样子，它是为它开发的。

而 GridLayout 是一种将其子元素放置在矩形网格中的布局。

它是在 API 级别 14 中引入的，最近在支持库中向后移植。它的主要目的是解决其他布局中的对齐和性能问题。如果您想了解有关 GridLayout 的更多信息，请查看 this tutorial。

Answer 2

网格视图 : 它是一个 ViewGroup，在二维、可滚动的网格中显示项目。在此每个 网格具有相同的大小（高度和宽度）。 网格视图在视图中显示对称项。

交错网格视图：它基本上是 Grid View 的扩展，但在这个 网格中，每个网格都有不同的大小（高宽）。交错网格视图在视图中显示不对称项。

实现交错网格视图的教程：

Answer 3

交错网格布局

这 children 以交错的网格形式布置。
它支持水平和垂直布局以及反向布局的能力children。
交错的网格很可能在布局的边缘有间隙。
为避免间隙，StaggeredGridLayoutManager 可以独立偏移跨度或在跨度之间移动项目。您可以通过 setGapStrategy(int).

网格布局

这将其 children 布置在一个矩形网格中。
网格由一组无限细的线组成，这些线将查看区域分隔成单元格。
Children 占据一个或多个连续的单元格，由它们的 rowSpec 和 columnSpec 布局参数定义。

Answer 4

网格布局（API 级别 14）： 将其子项放置在矩形网格中的布局。可以使用 android:rowCount 和 android:columnCount 属性声明网格中的行数和列数。但是，通常情况下，如果声明了列数，GridLayout 将根据占用的单元格数推断行数，从而无需使用 rowCount 属性。同样，可以选择通过 android:orientation 属性.

定义 GridLayout 的方向

我认为没有单独的 StaggeredGridLayout。这是我们拥有的东西

StaggeredGridLayoutManager : 它是 Recyclerview.A LayoutManager 中使用的布局管理器之一，它以交错方式布置子级网格形成。它支持水平和垂直布局以及反向布局子项的能力。

Staggered GridView : StaggeredGridView 允许用户创建具有不均匀行的 GridView，类似于 Pinterest 的外观。包括自己的 OnItemClickListener 和 OnItemLongClickListener、选择器和固定位置 restore.Please 查看 this 示例。

Answer 5

我在 Oodles Technologies 的时间教会了我交错。我会分享的。

StaggeredGridLayout 是一个 LayoutManager，它就像一个 GridView，但在这个网格中每个视图都有自己的大小（高度和宽度）。它支持垂直和水平布局。

以下是创建交错网格的一些基本步骤：

1) 创建视图。

正如我们所知，StaggeredGrid 不是一个直接视图，它是一个 LayoutManager，它以交错的网格形式布置子项。我们使用 RecyclerView 作为交错网格的视图。这是我们的 RecyclerView 布局：

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

    <android.support.v7.widget.RecyclerView
        android:id="@+id/favPlaces"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
    
</RelativeLayout>

2) 设置 StaggeredGridLayout 布局管理器。

一旦我们的视图准备就绪，让我们使用 LayoutManager 在视图上创建网格：

RecyclerView favPlaces = (RecyclerView) findViewById(R.id.favPlaces);
StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL);
layoutManager.setGapStrategy(StaggeredGridLayoutManager.GAP_HANDLING_NONE);
favPlaces.setLayoutManager(layoutManager);
favPlaces.setHasFixedSize(true);

3) 用于扩充 StaggeredGrid 视图的适配器。

要以网格形式填充数据，我们首先需要一个布局来表示该数据。我们为此使用 CardView，布局为：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:cardcornerradius="4dp"
        app:cardusecompatpadding="true">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@color/colorPrimary"
            android:orientation="vertical">

            <ImageView
                android:id="@+id/placePic"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:adjustviewbounds="true"
                android:scaletype="fitXY" />

            <TextView
                android:id="@+id/placeName"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:textsize="16sp" />

        </LinearLayout>

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

</LinearLayout>

设置完所有基本步骤后，就该完成主要的 activity 了。以下是 MainActivity 的完整代码：

public class MainActivity extends AppCompatActivity {
 
    int placeImage[]= {R.drawable.agattia_airport_lakshadweep,R.drawable.nainital,R.drawable.goa,
            R.drawable.lotus_temple,R.drawable.valley_of_flowers,R.drawable.ranikhet,R.drawable.dehradun,R.drawable.nainital1};
 
    String placeName[]= {"Lakshadweep, India","Nainital, India","Goa, India","Lotus-Temple, India","Valley-Of-Flowers, India","Ranikhet, India",
    "Dehradun, India","Nainital, India"};
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        RecyclerView favPlaces = (RecyclerView) findViewById(R.id.favPlaces);
        StaggeredGridLayoutManager layoutManager = new StaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL);
        layoutManager.setGapStrategy(StaggeredGridLayoutManager.GAP_HANDLING_NONE);
        favPlaces.setLayoutManager(layoutManager);
        favPlaces.setHasFixedSize(true);
        ArrayList<PlaceDetails> placeList = getPlaces();
 
        StaggeredAdapter staggeredAdapter = new StaggeredAdapter(placeList);
        favPlaces.setAdapter(staggeredAdapter);
    }
 
    private ArrayList<PlaceDetails> getPlaces() {
        ArrayList<PlaceDetails> details = new ArrayList<>();
        for (int index=0; index<placeImage.length;index++){
            details.add(new PlaceDetails(placeImage[index],placeName[index]));
        }
        return details;
    }
}

Android - Gridlayout 和 Staggered Gridlayout 的区别

Android - Difference between Gridlayout and Staggered Gridlayout

android-layout

android-gridlayout

staggeredgridlayout