In erlier chapter, we understood how to make a custom setter and bind ImageView with a image url directly. Now we will learn data binding with recycler view. We are going to make an adapter which will have a viewholder.
So lets start with make a layout having your recyclerview as i did, lets call it activity_main.xml .
|
1 2 3 4 5 6 7 8 9 10 11 |
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <android.support.v7.widget.RecyclerView android:id="@+id/list_grid_view" android:layout_width="match_parent" android:layout_height="match_parent"/> </LinearLayout> |
Now we will create a layout for list/ grid item. Here we will have a text and an image. But firstly we have to make a java entity/ class for the structure we want to bind.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
public class MyItem { String text; String imageUrl; public MyItem(String text, String imageUrl) { this.text = text; this.imageUrl = imageUrl; } public String getText() { return text; } public void setText(String text) { this.text = text; } public String getImageUrl() { return imageUrl; } public void setImageUrl(String imageUrl) { this.imageUrl = imageUrl; } } |
item.xml:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
<?xml version="1.0" encoding="utf-8"?> <layout xmlns:android="http://schemas.android.com/apk/res/android"> <data> <variable name="myitem" type="com.example.Item"/> </data> <LinearLayout xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal"> <ImageView android:layout_width="50dp" android:layout_height="50dp" app:imageUrl="@{myitem.imageUrl}"/> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center_vertical" android:text="@{myitem.text)}"/> </LinearLayout> </LinearLayout> </layout> |
As we are using app:imageUrl our custom setter so we have to define it. Here I am going to use picasso library if you want to use volley you can check it out from here.
|
1 2 3 4 5 6 7 8 |
public class BindingAdapter1 { @BindingAdapter("imageUrl") public static void loadImage(ImageView view, String url) { Picasso.with(view.getContext().getApplicationContext()).load(url) .into(view); } } |
Now we will create a recyclerview adapter. We will do it in MainActivity.java as
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
public class MainActivity extends AppCompatActivity { private MyAdapter mAdapter; private List<Item> mData = new ArrayList<>(); @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); RecyclerView recyclerView = (RecyclerView) findViewById(R.id.list_grid_view); recyclerView.setLayoutManager(new LinearLayoutManager(this)); addData(); //add your data to list mAdapter = new MyAdapter(mData); recyclerView.setAdapter(mAdapter); } public void addData(){ } } |
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 |
public class MyAdapter extends RecyclerView.Adapter<MyAdapter.BindingViewHolder> { private final List<Item> mData; public MyAdapter(List<tem> data) { mData = data; } @Override public MyAdapter.BindingViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { ItemBinding binding = ItemBinding.inflate(LayoutInflater.from(parent.getContext()), parent, false); return new BindingViewHolder(binding); } @Override public void onBindViewHolder(MyAdapter.BindingViewHolder holder, int position) { holder.mBinding.setMyitem(mData.get(position)); } @Override public int getItemCount() { return mData.size(); } @Override public int getItemViewType(int position) { return 0; } static class BindingViewHolder extends RecyclerView.ViewHolder { private final ItemBinding mBinding; public BindingViewHolder(ItemBinding binding) { super(pBinding.getRoot()); mBinding = binding; } } } |
And thats all for binding a recycler view data. You can also make a view swicher to switch between different layouts in the recyclerview as you have seen in many apps that switch between grid and list view. But we will coontinue that in the next part.