android.support.v7.widget.StaggeredGridLayoutManager is a LayoutManager that lays out children in a staggered grid formation. It supports horizontal & vertical layout as well as an ability to layout children in reverse.
Example to create StaggeredGridLayoutManager:
staggeredGridLayoutManagerVertical =
new StaggeredGridLayoutManager(
2, //The number of Columns in the grid
LinearLayoutManager.VERTICAL);
staggeredGridLayoutManagerHorizontal =
new StaggeredGridLayoutManager(
3, //The number of rows in the grid
LinearLayoutManager.HORIZONTAL);
Modify last example "Android example using RecyclerView with CardView":
layout/activity_main.xml
<LinearLayout 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:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MainActivity"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:autoLink="web"
android:text="http://android-er.blogspot.com/"
android:textStyle="bold" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<EditText
android:id="@+id/namefield"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<Button
android:id="@+id/addbutton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Add"/>
<RadioGroup
android:id="@+id/optGroupLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<RadioButton
android:id="@+id/optLinearLayoutVertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="LinearLayout Vertical"
android:checked="true" />
<RadioButton
android:id="@+id/optLinearLayoutHorizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="LinearLayout Horizontal" />
<RadioButton
android:id="@+id/optGridLayoutVertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="GridLayout Vertical" />
<RadioButton
android:id="@+id/optGridLayoutHorizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="GridLayout Horizontal" />
<RadioButton
android:id="@+id/optStaggeredGridLayoutVertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="StaggeredGridLayout Vertical" />
<RadioButton
android:id="@+id/optStaggeredGridLayoutHorizontal"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="StaggeredGridLayout Horizontal" />
</RadioGroup>
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="@+id/myrecyclerview"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</LinearLayout>
com.example.androidrecyclerview.MainActivity.java
package com.example.androidrecyclerview;
import android.os.Bundle;
import android.support.v7.app.ActionBarActivity;
import android.support.v7.widget.GridLayoutManager;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.StaggeredGridLayoutManager;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.Toast;
public class MainActivity extends ActionBarActivity implements RecyclerViewAdapter.OnItemClickListener{
private RecyclerView myRecyclerView;
private RecyclerViewAdapter myRecyclerViewAdapter;
EditText nameField;
Button btnAdd;
RadioGroup optGroupLayout;
RadioButton optLinearLayoutHorizontal;
RadioButton optLinearLayoutVertical;
RadioButton optGridLayoutHorizontal;
RadioButton optGridLayoutVertical;
RadioButton optStaggeredGridLayoutHorizontal;
RadioButton optStaggeredGridLayoutVertical;
private LinearLayoutManager linearLayoutManagerVertical;
private LinearLayoutManager linearLayoutManagerHorizontal;
private GridLayoutManager gridLayoutManagerVertical;
private GridLayoutManager gridLayoutManagerHorizontal;
private StaggeredGridLayoutManager staggeredGridLayoutManagerVertical;
private StaggeredGridLayoutManager staggeredGridLayoutManagerHorizontal;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
myRecyclerView = (RecyclerView)findViewById(R.id.myrecyclerview);
linearLayoutManagerVertical =
new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false);
linearLayoutManagerHorizontal =
new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL, false);
gridLayoutManagerVertical =
new GridLayoutManager(this,
2, //The number of Columns in the grid
LinearLayoutManager.VERTICAL,
false);
gridLayoutManagerHorizontal =
new GridLayoutManager(this,
3, //The number of rows in the grid
LinearLayoutManager.HORIZONTAL,
false);
staggeredGridLayoutManagerVertical =
new StaggeredGridLayoutManager(
2, //The number of Columns in the grid
LinearLayoutManager.VERTICAL);
staggeredGridLayoutManagerHorizontal =
new StaggeredGridLayoutManager(
3, //The number of rows in the grid
LinearLayoutManager.HORIZONTAL);
//set SpanSizeLookup()
gridLayoutManagerVertical.setSpanSizeLookup(new MySpanSizeLookup(5, 1, 2));
gridLayoutManagerHorizontal.setSpanSizeLookup(new MySpanSizeLookup(4, 1, 3));
myRecyclerViewAdapter = new RecyclerViewAdapter(this);
myRecyclerViewAdapter.setOnItemClickListener(this);
myRecyclerView.setAdapter(myRecyclerViewAdapter);
myRecyclerView.setLayoutManager(linearLayoutManagerVertical);
//Add MyItemDecoration
myRecyclerView.addItemDecoration(new MyItemDecoration(this));
nameField = (EditText)findViewById(R.id.namefield);
btnAdd = (Button)findViewById(R.id.addbutton);
btnAdd.setOnClickListener(new View.OnClickListener(){
@Override
public void onClick(View v) {
String newName = nameField.getText().toString();
if(!newName.equals("")){
if(myRecyclerViewAdapter.getItemCount()>1){
myRecyclerViewAdapter.add(1, newName);
}else{
myRecyclerViewAdapter.add(0, newName);
}
}
}
});
optGroupLayout = (RadioGroup)findViewById(R.id.optGroupLayout);
optLinearLayoutHorizontal = (RadioButton)findViewById(R.id.optLinearLayoutHorizontal);
optLinearLayoutVertical = (RadioButton)findViewById(R.id.optLinearLayoutVertical);
optGridLayoutHorizontal = (RadioButton)findViewById(R.id.optGridLayoutHorizontal);
optGridLayoutVertical = (RadioButton)findViewById(R.id.optGridLayoutVertical);
optStaggeredGridLayoutHorizontal = (RadioButton)findViewById(R.id.optStaggeredGridLayoutHorizontal);
optStaggeredGridLayoutVertical = (RadioButton)findViewById(R.id.optStaggeredGridLayoutVertical);
optGroupLayout.setOnCheckedChangeListener(optLayoutCheckedChangeListener);
//pre-load dummy items
myRecyclerViewAdapter.add(0, "SpanSizeLookup");
myRecyclerViewAdapter.add(0, "ItemDecoration");
myRecyclerViewAdapter.add(0, "GridLayoutManager");
myRecyclerViewAdapter.add(0, "LinearLayoutManager");
myRecyclerViewAdapter.add(0, "RecyclerViewAdapter");
myRecyclerViewAdapter.add(0, "RecyclerView example");
myRecyclerViewAdapter.add(0, "RecyclerView");
myRecyclerViewAdapter.add(0, "android-er.blogspot.com");
myRecyclerViewAdapter.add(0, "android-er");
myRecyclerViewAdapter.add(0, "android");
}
private RadioGroup.OnCheckedChangeListener optLayoutCheckedChangeListener =
new RadioGroup.OnCheckedChangeListener(){
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
if(optLinearLayoutVertical.isChecked()){
myRecyclerView.setLayoutManager(linearLayoutManagerVertical);
}else if(optLinearLayoutHorizontal.isChecked()){
myRecyclerView.setLayoutManager(linearLayoutManagerHorizontal);
}else if(optGridLayoutHorizontal.isChecked()){
myRecyclerView.setLayoutManager(gridLayoutManagerHorizontal);
}else if(optGridLayoutVertical.isChecked()){
myRecyclerView.setLayoutManager(gridLayoutManagerVertical);
}else if(optStaggeredGridLayoutHorizontal.isChecked()){
myRecyclerView.setLayoutManager(staggeredGridLayoutManagerHorizontal);
}else if(optStaggeredGridLayoutVertical.isChecked()){
myRecyclerView.setLayoutManager(staggeredGridLayoutManagerVertical);
}
}
};
@Override
public void onItemClick(RecyclerViewAdapter.ItemHolder item, int position) {
Toast.makeText(this,
"Remove " + position + " : " + item.getItemName(),
Toast.LENGTH_SHORT).show();
myRecyclerViewAdapter.remove(position);
}
}
Download the files (Android Studio Format).
- More step-by-step examples of RecyclerView.
No comments:
Post a Comment