41

我正在使用 android material design api & 想要以网格格式显示一些数据。我都试过了GridLayout，StaggeredGridlayout而且看起来都一样。对于一般信息，我想问和有什么区别？GridlayoutStaggeredGridlayout

谢谢你。

4

5 回答 5

73

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

网格视图

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

交错网格视图

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

  1. 交错网格视图
  2. Pinterest 砌体布局交错网格视图
于 2015-12-11T06:08:25.270 回答
8

我在 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。

一旦我们的视图准备就绪，让我们使用 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>

在我们设置完所有基本步骤之后，就该完成我们的主要活动了。下面是 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;
    }
}
于 2016-11-02T12:03:42.117 回答
3

交错网格布局

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

网格布局

  1. 这将其子项布置在矩形网格中。
  2. 网格由一组无限细的线组成，它们将查看区域分成多个单元。
  3. 孩子占据一个或多个连续的单元格，由他们的rowSpec和columnSpec布局参数定义。

网格布局示例

于 2015-12-11T06:14:35.883 回答
2

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

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

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

Staggered GridView ： StaggeredGridView 允许用户创建具有不均匀行的 GridView，类似于 Pinterest 的外观。包括自己的 OnItemClickListener 和 OnItemLongClickListener，选择器，和固定位置恢复。请看这个例子。

于 2015-12-11T06:26:17.037 回答
0

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

它允许带有页眉和页脚的灵活的列/行视图，并且看起来相当容易实现，尽管 Gradle 用户将比使用 Eclipse 和 Ant 的用户更轻松。这就是该视图在为其开发的Etsy Github 应用程序中的样子。

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

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

于 2015-12-11T06:05:23.717 回答