web-dev-qa-db-ja.com

Android DocsのRecyclerViewとStaggeredGridLayoutManagerに関する良い例はありません

RecyclerViewをStaggeredGridLayoutManagerと一緒に使用するより良い例は見つかりませんでした。 Android Docs でもありません。

Q1。RecyclerViewをStaggeredGridLayoutManagerと一緒に使用する方法について適切な説明を与えることができるいくつかの例が必要です。

Q2。RecyclerViewとStaggeredGridLayoutManagerを使用して次のレイアウトを作成できるかどうかを教えてもらえますか

example

これまでのところ、私はこれを見つけました link これはまったく役に立ちません。

また、cardlibの場合は link を見つけましたが、実装が複雑すぎ、依存関係が多すぎるため、アプリのサイズが不必要に大きくなります。

androidandroid-recyclerviewstaggered-gridview
43
Amrut Bidri

まだこの質問に着手している人のために。

必要に応じて次のコードを変更できます。
最初にAndroid RecyclerViewおよびCardViewの依存ライブラリを追加します

compile 'com.Android.support:appcompat-v7:23.4.0'
compile 'com.Android.support:cardview-v7:23.4.0'
compile 'com.Android.support:recyclerview-v7:23.4.0'

メインアクティビティレイアウト activity_main.xml 単にのようになります

<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:padding="7dp"
    tools:context=".MainActivity">

    <Android.support.v7.widget.RecyclerView
        Android:id="@+id/recycler_view"
        Android:layout_width="match_parent"
        Android:layout_height="match_parent"
        Android:scrollbars="vertical" />

</RelativeLayout>


という名前のレイアウトファイルでカードのレイアウトを定義する book_list_item.xml

<?xml version="1.0" encoding="utf-8"?>
<Android.support.v7.widget.CardView xmlns:Android="http://schemas.Android.com/apk/res/Android"
xmlns:card_view="http://schemas.Android.com/apk/res-auto"
Android:id="@+id/card_view"
Android:layout_width="wrap_content"
Android:layout_height="wrap_content"
card_view:cardUseCompatPadding="true">

<LinearLayout
    Android:layout_width="match_parent"
    Android:layout_height="match_parent"
    Android:background="@Android:color/white"
    Android:orientation="vertical">

    <TextView
        Android:id="@+id/BookName"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:padding="5dp"
        Android:textColor="@Android:color/black"
        Android:textSize="16sp" />

    <TextView
        Android:id="@+id/AuthorName"
        Android:layout_width="match_parent"
        Android:layout_height="wrap_content"
        Android:layout_alignParentBottom="true"
        Android:layout_below="@+id/country_photo"
        Android:background="#1976D2"
        Android:gravity="center_horizontal"
        Android:paddingBottom="8dp"
        Android:paddingTop="8dp"
        Android:text="@string/hello_world"
        Android:textColor="#ffffff"
        Android:textSize="13sp" />
</LinearLayout>

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


このレイアウトをクラスとして定義する ItemObject.Java

public class ItemObject
{
    private String _name;
    private String _author;

    public ItemObject(String name, String auth)
    {
        this._name = name;
        this._author = auth;
    }

    public String getName()
    {
        return _name;
    }

    public void setName(String name)
    {
        this._name = name;
    }

    public String getAuthor()
    {
        return _author;
    }

    public void setAuthor(String auth)
    {
        this._author = auth;
    }
}


カスタムアダプターを定義する SampleRecyclerViewAdapter カードを投入する

public class SampleRecyclerViewAdapter extends RecyclerView.Adapter<SampleViewHolders>
{
    private List<ItemObject> itemList;
    private Context context;

    public SampleRecyclerViewAdapter(Context context,
        List<ItemObject> itemList)
    {
        this.itemList = itemList;
        this.context = context;
    }

    @Override
    public SampleViewHolders onCreateViewHolder(ViewGroup parent, int viewType)
    {
        View layoutView = LayoutInflater.from(parent.getContext()).inflate(
            R.layout.book_list_item, null);
        SampleViewHolders rcv = new SampleViewHolders(layoutView);
        return rcv;
    }

    @Override
    public void onBindViewHolder(SampleViewHolders holder, int position)
    {
        holder.bookName.setText(itemList.get(position).getName());
        holder.authorName.setText(itemList.get(position).getAuthor());
    }

    @Override
    public int getItemCount()
    {
        return this.itemList.size();
    }
}


また、それぞれにビューホルダーが必要です ItemObject。クラスを定義する SampleViewHolders

public class SampleViewHolders extends RecyclerView.ViewHolder implements
    View.OnClickListener
{
    public TextView bookName;
    public TextView authorName;

    public SampleViewHolders(View itemView)
    {
        super(itemView);
        itemView.setOnClickListener(this);
        bookName = (TextView) itemView.findViewById(R.id.BookName);
        authorName = (TextView) itemView.findViewById(R.id.AuthorName);
    }

    @Override
    public void onClick(View view)
    {
        Toast.makeText(view.getContext(),
            "Clicked Position = " + getPosition(), Toast.LENGTH_SHORT)
            .show();
    }
}

今 主な活動、StaggeredGridLayoutManagerのインスタンスを recycler_view コンポーネントの表示方法を定義します。
また、次のインスタンスを使用してカードにデータを入力します SampleRecyclerViewAdapter、 次のように

public class MainActivity extends AppCompatActivity
{
    private StaggeredGridLayoutManager _sGridLayoutManager;

    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recycler_view);
        recyclerView.setHasFixedSize(true);

        _sGridLayoutManager = new StaggeredGridLayoutManager(2,
            StaggeredGridLayoutManager.VERTICAL);
        recyclerView.setLayoutManager(_sGridLayoutManager);

        List<ItemObject> sList = getListItemData();

        SampleRecyclerViewAdapter rcAdapter = new SampleRecyclerViewAdapter(
            MainActivity.this, sList);
        recyclerView.setAdapter(rcAdapter);
    }

    private List<ItemObject> getListItemData()
    {
        List<ItemObject> listViewItems = new ArrayList<ItemObject>();
        listViewItems.add(new ItemObject("1984", "George Orwell"));
        listViewItems.add(new ItemObject("Pride and Prejudice", "Jane Austen"));
        listViewItems.add(new ItemObject("One Hundred Years of Solitude", "Gabriel Garcia Marquez"));
        listViewItems.add(new ItemObject("The Book Thief", "Markus Zusak"));
        listViewItems.add(new ItemObject("The Hunger Games", "Suzanne Collins"));
        listViewItems.add(new ItemObject("The Hitchhiker's Guide to the Galaxy", "Douglas Adams"));
        listViewItems.add(new ItemObject("The Theory Of Everything", "Dr Stephen Hawking"));

        return listViewItems;
    }
}

出力は次のようになります Two Colums Output

要件については、book_list_item.xmlにImageViewを組み込み、それに応じてImageViewを設定できます。 SampleViewHolders
また、列の数を2から3に変更することにも注意してください。

MainActivityの宣言を次のように変更できます。

_sGridLayoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL);
recyclerView.setLayoutManager(_sGridLayoutManager);

次のような出力が得られます Three Column Output

別の簡単なチュートリアル

53
g4th

既にアダプターを作成し、RecyclerViewを初期化したと仮定すると、次のコードは探していることを実行するはずです。

StaggeredGridLayoutManager staggeredGridLayoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL);
recyclerView.setLayoutManager(staggeredGridLayoutManager);

詳細なリファレンスとドキュメントについては、次のリンクを確認してください。 https://developer.Android.com/reference/Android/support/v7/widget/StaggeredGridLayoutManager.html

7
J-me

私たちの友人 "Henry"には、わかりやすく簡単な説明があります here 。

そして、私は以下のコンストラクタがほとんどの用途に適していると思います：

StaggeredGridLayoutManager(num , LinearLayoutManager.VERTICAL)
// where 'num' is your columns count
// LinearLayoutManager.VERTICAL = 1
0
ABS