how to create image gallery with horizontal scroll

how to create image gallery with horizontal scroll - android

How can I make an image gallery with horizontal scroll in android studio in which images can be displayed one image at the screen and with buttons on the right and the left for moving to other images

You can use ViewPager instead of HorizontalScrollView,
Please follow this tutorial

You may also use horizontal recycleview. Here's the code:
fragment/activity layout:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
...
<android.support.v7.widget.RecyclerView
android:id="#+id/horizontal_recycler_view"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="15dp"
android:layout_marginBottom="15dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:horizontalSpacing="10dp"
android:isScrollContainer="false"
android:stretchMode="columnWidth"
android:verticalSpacing="10dp"
/>
...
</LinearLayout>
item:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/horizontal_item_view_image"
android:layout_marginRight="10dp"
android:layout_width="109dp"
android:layout_height="109dp" />
</LinearLayout>
adapter:
public class HorizontalPhotosAdapter extends RecyclerView.Adapter<HorizontalPhotosAdapter.MyViewHolder> {
private Context context;
private LayoutInflater inflater;
private ArrayList<Bitmap> bitmapList;
public class MyViewHolder extends RecyclerView.ViewHolder {
private ImageView riv;
public MyViewHolder(View view) {
super(view);
riv = (ImageView) view.findViewById(R.id.horizontal_item_view_image);
}
}
public HorizontalPhotosAdapter(Context context, ArrayList<Bitmap> bitmapList, String[] imageUrls) {
this.context = context;
this.bitmapList = bitmapList;
}
#Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View itemView = LayoutInflater.from(parent.getContext()).inflate(R.layout.horizontal_item_view, parent, false);
if (itemView.getLayoutParams ().width == RecyclerView.LayoutParams.MATCH_PARENT)
itemView.getLayoutParams ().width = RecyclerView.LayoutParams.WRAP_CONTENT;
return new MyViewHolder(itemView);
}
#Override
public void onBindViewHolder(final MyViewHolder holder, final int position) {
holder.riv.setImageBitmap(bitmapList.get(position));
}
#Override
public int getItemCount() {
return bitmapList.size();
}
}
implementation in fragment/activity:
horizontalAdapter=new HorizontalPhotosAdapter(getContext(), bitmapList);
horizontal_recycler_view.setAdapter(horizontalAdapter);
horizontalAdapter.notifyDataSetChanged();
LinearLayoutManager horizontalLayoutManagaer = new LinearLayoutManager(getContext(), LinearLayoutManager.HORIZONTAL, false);
horizontal_recycler_view.setLayoutManager(horizontalLayoutManagaer);
horizontal_recycler_view.setAdapter(horizontalAdapter);

Related

Unable to Align 2 Cardviews Vertically Inside RecyclerView

I have 2 CardViews and a RecyclerView but i am
unable to align them vertically
unable to slide them independently (both slide if I slide any one in a bugged workaround)
I tried a few workarounds as well as different tutorials like edmt Dev and CodingWithMitch as well as searched for similar problems on stackoverflow but the problem seems to persist. So how do I align both of the cardviews vertically while still being able to slide each of them independently and horizontally.
(Code works fine for single card view)
Main Activity:
public class MainActivity extends AppCompatActivity {
List<Articles> articlesData;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
articlesData = new ArrayList<>();
//Repeats
articlesData.add(new Articles("10 Necessary Gadgets","Gadgets","Gadgets You Must Carry",R.drawable.bagchaincustom));
articlesData.add(new Articles("10 Benefits of Pre-Planning the Day","Self Improvement","Benefits of Planning in Advance",R.drawable.planner1custom));
LinearLayoutManager layoutManager = new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL,false);
RecyclerView recyclerView = findViewById(R.id.recyclerview);
recyclerView.setLayoutManager(layoutManager);
RecyclerViewAdapter adapter = new RecyclerViewAdapter(this, articlesData);
recyclerView.setAdapter(adapter);
}
Here is activity_main.xml:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/recyclerview"
android:orientation="horizontal">
</androidx.recyclerview.widget.RecyclerView>
</androidx.constraintlayout.widget.ConstraintLayout>
Here is the RecyclerViewAdapter Class:
public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
private static final int LAYOUT_ONE= 0;
private static final int LAYOUT_TWO= 1;
#Override
public int getItemViewType(int position)
{
if(position == LAYOUT_ONE){
return LAYOUT_TWO;
}
else {
return LAYOUT_ONE;
}
}
private static final String Tag = "RecyclerViewAdapter";
private Context mContext;
private List<Articles> mData;
public RecyclerViewAdapter(Context mContext, List<Articles> mData) {
this.mContext = mContext;
this.mData = mData;
}
#NonNull
#Override
public RecyclerView.ViewHolder onCreateViewHolder(#NonNull ViewGroup parent, int viewType) {
LayoutInflater mInflater = LayoutInflater.from(mContext);
View view;
switch (viewType) {
case 0:
ViewHolder1 viewHolder1;
view = mInflater.inflate(R.layout.layout_listitem, parent, false);
return new ViewHolder1(view);
case 1:
ViewHolder2 viewHolder2;
view = mInflater.inflate(R.layout.layout_listitem2, parent, false);
return new ViewHolder2(view);
default:
return null;
}
}
#Override
public void onBindViewHolder(#NonNull RecyclerView.ViewHolder holder, final int position) {
switch (holder.getItemViewType()){
case 0:
ViewHolder1 viewHolder1 = (ViewHolder1)holder;
viewHolder1.tv_article_title.setText(mData.get(position).getTitle());
viewHolder1.img_article_thumbnail.setImageResource(mData.get(position).getThumbnail());
viewHolder1.cardView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Intent intent = new Intent(mContext, ArticlesActivity.class);
intent.putExtra("Title", mData.get(position).getTitle());
intent.putExtra("Description", mData.get(position).getDescription());
intent.putExtra("Thumbnail", mData.get(position).getThumbnail());
intent.putExtra("Category", mData.get(position).getCategory());
mContext.startActivity(intent);
}
});
break;
case 1:
ViewHolder2 viewHolder2 = (ViewHolder2)holder;
viewHolder2.tv_article_title2.setText(mData.get(position).getTitle());
viewHolder2.img_article_thumbnail2.setImageResource(mData.get(position).getThumbnail());
viewHolder2.cardView2.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Intent intent = new Intent(mContext, ArticlesActivity.class);
intent.putExtra("Title", mData.get(position).getTitle());
intent.putExtra("Description", mData.get(position).getDescription());
intent.putExtra("Thumbnail", mData.get(position).getThumbnail());
intent.putExtra("Category", mData.get(position).getCategory());
mContext.startActivity(intent);
}
});
break;
}
}
#Override
public int getItemCount() {
return mData.size();
}
public class ViewHolder1 extends RecyclerView.ViewHolder{
TextView tv_article_title;
ImageView img_article_thumbnail;
CardView cardView;
public ViewHolder1(#NonNull View itemView) {
super(itemView);
tv_article_title = (TextView) itemView.findViewById(R.id.article_title_id);
img_article_thumbnail = (ImageView) itemView.findViewById((R.id.article_image_id));
cardView = (CardView) itemView.findViewById(R.id.cardview_id);
}
}
public class ViewHolder2 extends RecyclerView.ViewHolder{
TextView tv_article_title2;
ImageView img_article_thumbnail2;
CardView cardView2;
public ViewHolder2(#NonNull View itemView) {
super(itemView);
tv_article_title2 = (TextView) itemView.findViewById(R.id.article_title_id2);
img_article_thumbnail2 = (ImageView) itemView.findViewById((R.id.article_image_id2));
cardView2 = (CardView) itemView.findViewById(R.id.cardview_id2);
}
}
}
Here is the Articles Class:
public class Articles {
private String Title;
private String Category;
private String Description;
private int Thumbnail;
public Articles(String title, String category, String description, int thumbnail) {
Title = title;
Category = category;
Description = description;
Thumbnail = thumbnail;
}
public String getTitle() {
return Title;
}
public String getCategory() {
return Category;
}
public String getDescription() {
return Description;
}
public int getThumbnail() {
return Thumbnail;
}
And here is the CardView -> layout_listitem Layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:card_view="http://schemas.android.com/tools"
android:layout_alignParentStart="true"
android:id="#+id/rview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:card_view="http://schemas.android.com/tools"
android:id="#+id/cardview_id"
android:layout_width="120dp"
android:layout_height="220dp"
android:clickable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardCornerRadius="0dp"
app:cardElevation="0dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:orientation="vertical">
<ImageView
android:id="#+id/article_image_id"
android:layout_width="match_parent"
android:layout_height="160dp"
android:background="#2d2d2d"
android:scaleType="centerCrop"></ImageView>
<TextView
android:id="#+id/article_title_id"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:gravity="center"
android:text="Article Name"
android:textSize="14sp">
</TextView>
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>
And here is the CardView -> layout_listitem2 Layout:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:card_view="http://schemas.android.com/tools"
android:layout_alignParentStart="true"
android:id="#+id/rview2"
android:layout_below="#+id/rview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="300dp">
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:card_view="http://schemas.android.com/tools"
android:id="#+id/cardview_id2"
android:layout_below="#id/cardview_id"
android:layout_width="120dp"
android:layout_height="220dp"
android:clickable="true"
android:foreground="?android:attr/selectableItemBackground"
app:cardCornerRadius="0dp"
app:cardElevation="0dp">
<LinearLayout
android:layout_marginTop="250dp"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp"
android:orientation="vertical">
<ImageView
android:id="#+id/article_image_id2"
android:layout_width="match_parent"
android:layout_height="160dp"
android:background="#2d2d2d"
android:scaleType="centerCrop"></ImageView>
<TextView
android:id="#+id/article_title_id2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:gravity="center"
android:text="Article Name Sec"
android:textSize="14sp">
</TextView>
</LinearLayout>
</androidx.cardview.widget.CardView>
</LinearLayout>

ConstraintLayout is not a scrolling parent, so it will create problem if you add a long RecyclerView inside it.

So I made a few modifications to the above code and it has solved the both problems (Independent sliding and vertical alignment)
I have added another recyclerview in main_activity.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:orientation="vertical">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerview_id"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
</androidx.recyclerview.widget.RecyclerView>
<androidx.recyclerview.widget.RecyclerView
android:layout_below="#+id/recyclerview_id2"
android:layout_marginTop="10dp"
android:id="#+id/recyclerview_id2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:ignore="NotSibling">
</androidx.recyclerview.widget.RecyclerView>
</LinearLayout>
I have also created another Adapter for the new recyclerview, seperated classes for both viewholders as well as removed the switch statements and itemViewType from RecyclerViewAdapter and RecyclerViewAdapter2 class :
public ViewHolder onCreateViewHolder(#NonNull ViewGroup parent, int viewType) {
View view;
LayoutInflater mInflater = LayoutInflater.from(mContext);
view = mInflater.inflate(R.layout.layout_listitem2,parent,false);
return new ViewHolder(view);
}
#Override
public void onBindViewHolder(#NonNull ViewHolder holder, final int position) {
holder.tv_article_title2.setText(mData.get(position).getTitle());
holder.img_article_thumbnail2.setImageResource(mData.get(position).getThumbnail());
holder.cardView2.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Intent intent = new Intent(mContext,ArticlesActivity.class);
intent.putExtra("Title",mData.get(position).getTitle());
intent.putExtra("Description",mData.get(position).getDescription());
intent.putExtra("Thumbnail",mData.get(position).getThumbnail());
intent.putExtra("Category",mData.get(position).getCategory());
mContext.startActivity(intent);
}
});
}
#Override
public int getItemCount() {
return mData.size();
}
public static class ViewHolder extends RecyclerView.ViewHolder{
TextView tv_article_title2;
ImageView img_article_thumbnail2;
CardView cardView2;
public ViewHolder(#NonNull View itemView) {
super(itemView);
tv_article_title2 = (TextView) itemView.findViewById(R.id.article_title_id2);
img_article_thumbnail2 = (ImageView) itemView.findViewById((R.id.article_image_id2));
cardView2 = (CardView) itemView.findViewById(R.id.cardview_id2);
}
}
I also edited the main_acitivty class by adding the new recyclerview and layout manager at the end:
LinearLayoutManager layoutManager2 = new LinearLayoutManager(this, LinearLayoutManager.HORIZONTAL,false);
RecyclerView recyclerView2 = findViewById(R.id.recyclerview_id2);
recyclerView2.setLayoutManager(layoutManager2);
RecyclerViewAdapter2 adapter2 = new RecyclerViewAdapter2(this, articlesData);
recyclerView2.setAdapter(adapter2);
Even though this workaround fixes both problems i was facing is there any other better/more refined way of doing this (eg by using single recyclerview) and where did i made the mistake in previous approach?

Recycler view cardview showing wrap parent instead of match parent

I have passed the parent to onCreateViewHolder instead of null but it is not showing match parent.
Please tell me if there is any error in the code?
Here is my Main_Adapter.class:
public class Main_Adapter extends RecyclerView.Adapter<Main_Adapter.ViewHolder> {
private List<MainModel> mainModels;
private Context context;
private OnClicklisteners listener;
public Main_Adapter(List<MainModel> mainModels, Context context, OnClicklisteners onClicklisteners) {
this.mainModels = mainModels;
this.context = context;
this.listener=onClicklisteners;
}
public interface OnClicklisteners{
public void onPosClicked(View view, int pos, ImageView mainimage, ArrayList<Integer> colorlist);
}
#Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.main_card, parent, false);
return new ViewHolder(view);
}
#Override
public void onBindViewHolder(final ViewHolder holder, int position) {
holder.main_text.setText(mainModels.get(position).getName());
Picasso.with(context).load(mainModels.get(position).getImageName()).fit().centerInside().into(holder.mainimage);
}
#Override
public int getItemCount() {
return mainModels.size();
}
public class ViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
#BindView(R.id.main_image)
ImageView mainimage;
#BindView(R.id.main_text)
TextView main_text;
Typeface ubuntu;
int colors;
ArrayList<Integer> colorlist =new ArrayList<>();
public ViewHolder(View itemView) {
super(itemView);
ButterKnife.bind(this, itemView);
itemView.setOnClickListener(this);
}
#Override
public void onClick(View view) {
int pos = getAdapterPosition();
listener.onPosClicked(view,pos,mainimage,colorlist);
}
}
Here is main_card.xml:
<android.support.v7.widget.CardView android:id="#+id/movie_container"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="150dp"
android:layout_gravity="center"
android:clickable="true"
android:layout_margin="2dp"
android:foreground="?attr/selectableItemBackground"
card_view:cardCornerRadius="2dp"
card_view:cardElevation="2dp"
xmlns:card_view="http://schemas.android.com/apk/res-auto">
<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent">
<ImageView
android:layout_marginTop="50dp"
android:id="#+id/main_image"
android:layout_width="35dp"
android:layout_height="35dp"
android:layout_gravity="center"
android:background="#color/white"
android:scaleType="centerCrop"
/>
<TextView
android:layout_marginTop="10dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/main_text"
android:textSize="16sp"
android:text="hello"
android:textAlignment="center"
/>
</LinearLayout>
</android.support.v7.widget.CardView>
Here is a screenshot:
It should show full width but it's showing only a wrap content. I have found a similar post but they are telling to pass parent in onCreateViewHolder. I have done that but it didn't help me.

Horizontal recyclerview into vertical recyclerview at specific position

I want to insert/show horizontal recyclerview into specific position (at this example position:1)
Vertical recyclerview - displays TextView + shape (rectange)
Horizontal recyclerview - displays ImageViews (next to each other)
.XML's
horizontal_layout.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:id="#+id/horizontal_recyclerview"
android:layout_width="368dp"
android:layout_height="wrap_content"
android:layout_marginBottom="60dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="2dp"
android:padding="0dp"/>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.mkalejs.training.MainActivity">
vertical_layout.xml
<android.support.v7.widget.RecyclerView
android:id="#+id/vertical_recyclerview"
android:layout_width="368dp"
android:layout_height="wrap_content"
android:layout_marginBottom="60dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="2dp"
android:padding="0dp"/>
</android.support.constraint.ConstraintLayout>
vertical_layout_item.xml
<EditText
android:id="#+id/lbl_url_text"
android:layout_width="100dp"
android:layout_height="50dp"
android:background="#android:color/transparent"
android:inputType="textPersonName"
android:padding="5dp"
android:layout_gravity="center"
android:text="Name" />
<View
android:id="#+id/rectangle"
android:layout_width="195dp"
android:layout_height="100dp"
android:background="#drawable/rectangle" />
horizontal_layout_item.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp"
android:visibility="visible"
android:weightSum="1">
<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/img_horizontal_slider"
android:layout_width="33dp"
android:layout_height="33dp"
android:adjustViewBounds="true"
android:visibility="visible" />
</LinearLayout>
There might be a small misunderstanding in recyclerview concept. I'm not sure where I can call horizontal_recyclerview" to not return it as a null (as I am now) and populate it with data. Is the XML structure wrong? Feel free to update code parts.
THIS SHOULD BE OKAY
MainActivity.class
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.vertical_layout);
ArrayList<PictureData> bundleOfData = prepareData();
RecyclerView rv = (RecyclerView) findViewById(R.id.vertical_recyclerview);
VerticalAdapter adapter = new VerticalAdapter(bundleOfData, this);
rv.setAdapter(adapter);
//rv.setNestedScrollingEnabled(true);
LinearLayoutManager layoutManager = new LinearLayoutManager(this, LinearLayoutManager.VERTICAL, false);
rv.setLayoutManager(layoutManager);
}
VerticalAdapter.class
public class VerticalAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder>{
private ArrayList<PictureData> pictures;
Context context;
public VerticalAdapter(ArrayList<PictureData> pictures, Context context)
{
this.pictures = pictures;
this.context = context;
}
#Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View itemView;
switch (viewType) {
case 1:
itemView = LayoutInflater.from(parent.getContext()).inflate(R.layout.horizontal_layout_item, parent, false);
return new HorizontalViewHolder(itemView);
default:
itemView = LayoutInflater.from(parent.getContext()).inflate(R.layout.vertical_layout_item, parent, false);
return new VerticalViewHolder(itemView);
}
}
#Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
switch (holder.getItemViewType()){
case 1:
HorizontalViewHolder hVh = (HorizontalViewHolder) holder;
HorizontalAdapter horizontal_adapter = new HorizontalAdapter(pictures, context);
hVh.horizontal_rec.setAdapter(horizontal_adapter);
break;
default:
VerticalViewHolder vVh = (VerticalViewHolder) holder;
vVh.textView.setText(pictures.get(position).getPictureUrl());
break;
}
}
#Override
public int getItemCount() {return pictures.size();}
#Override
public int getItemViewType(int position) {
if(position == 1){
return 1;
}else{
return 0;
}
}
}
HorizontalViewHolder.class
I GET A ERROR HERE. OBVIOUSLY, I DON'T HAVE (img_horizontal_slider) IN HORIZONTAL_LAYOUT, but putting ImageView + RecyclerView in one layout file and call here would feel wrong (?)
public class HorizontalViewHolder extends RecyclerView.ViewHolder{
public ImageView imagePositionInLayout;
public RecyclerView horizontal_rec;
public HorizontalViewHolder(View itemView) {
super(itemView);
LinearLayoutManager layoutManager = new LinearLayoutManager(itemView.getContext(), LinearLayoutManager.HORIZONTAL, false);
horizontal_rec = itemView.findViewById(R.id.vertical_recyclerview);
imagePositionInLayout = itemView.findViewById(R.id.img_horizontal_slider);
horizontal_rec.setLayoutManager(layoutManager);
}
public ImageView getView() {
return imagePositionInLayout;
}
}
HorizontalAdapter.class
ublic class HorizontalAdapter extends RecyclerView.Adapter<HorizontalViewHolder> {
private ArrayList<PictureData> pictures;
Context context;
public HorizontalAdapter(ArrayList<PictureData> pictures, Context context) {
this.pictures = pictures;
this.context = context;
}
#Override
public HorizontalViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.horizontal_layout_item, parent, false);
return new HorizontalViewHolder(view);
}
#Override
public void onBindViewHolder(HorizontalViewHolder holder, int position)
{
Picasso.Builder builder = new Picasso.Builder(context);
Picasso picasso = builder.build();
picasso
.load("http://nuclearpixel.com/content/icons/2010-02-09_stellar_icons_from_space_from_2005/earth_128.png")
.placeholder(R.mipmap.ic_launcher_round)
.into(holder.imagePositionInLayout);
}
#Override
public int getItemCount() {
return pictures.size();
}
}
I'm new to Android so I hope people will give some good explanation on what is wrong and how to fix it. Every suggestion will be gladly accepted. I will highly appreciate if someone will actually look into this and explain, because I feel pretty lost right now.

Horizontal RecyclerView Like Paytm

I have to implement a custom horizontal RecyclerView having a header (title) at top and a section (See All) right side at the end of the RecyclerView.
I created a RecyclerView with a header and footer but I want to have a right sided section (See All) of which onclick event I wish to fire some event.
In Paytm App, it is implemented
I wish to get results as follows

This will Gives You Idea
activity_main.xml
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="5dp"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingTop="5dp">
<android.support.v7.widget.RecyclerView
android:id="#+id/verticalScrollRecyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</android.support.v7.widget.RecyclerView></RelativeLayout>
vertical_scroll_single_entry.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
android:weightSum="1"
android:gravity="center_vertical">
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1">
</android.support.v7.widget.RecyclerView>
<Button
android:id="#+id/selectAllButton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="See All >>"
android:textAllCaps="false"/></LinearLayout>
Custom Adapter class For Vertical Scroller
public class CustomAdapter extends RecyclerView.Adapter<CustomAdapter.CustomViewHolder> {
private Context context;
private ArrayList arrayList;
private LayoutInflater layoutInflater;
public CustomAdapter(Context context, ArrayList arrayList) {
this.context = context;
this.layoutInflater = LayoutInflater.from(context);
this.arrayList = arrayList;
}
#Override
public CustomViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = layoutInflater.inflate(R.layout.vertical_scroll_single_entry, parent, false);
return new CustomViewHolder(view);
}
#Override
public void onBindViewHolder(CustomViewHolder holder, int position) {
//initialise values to views inside holder at runtime
holder.recyclerView.setAdapter(new CustomAdapterTwo(context, arrayList));
holder.recyclerView.setLayoutManager(new LinearLayoutManager(context, LinearLayoutManager.HORIZONTAL, false));
holder.recyclerView.setHasFixedSize(true);
}
#Override
public int getItemCount() {
return arrayList.size();
}
class CustomViewHolder extends RecyclerView.ViewHolder implements View.OnClickListener {
RecyclerView recyclerView;
Button selectAllButton;
public CustomViewHolder(View itemView) {
super(itemView);
recyclerView = (RecyclerView) itemView.findViewById(R.id.recyclerView);
selectAllButton = (Button) itemView.findViewById(R.id.selectAllButton);
selectAllButton.setOnClickListener(this);
}
#Override
public void onClick(View v) {
Toast.makeText(context, "Select All At : " + String.valueOf(getLayoutPosition()), Toast.LENGTH_SHORT).show();
}
}}
horizontal adapter single entry file recycler_view_single_item.xml
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="wrap_content"
android:layout_height="match_parent" android:gravity="center_horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Price"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Remove this button \n and put image view"
android:textAllCaps="false"/></LinearLayout>
Horizontal recycler view adapter class
public class CustomAdapterTwo extends RecyclerView.Adapter<CustomAdapterTwo.CustomViewHolder> {
private Context context;
private ArrayList arrayList;
private LayoutInflater layoutInflater;
public CustomAdapterTwo(Context context, ArrayList arrayList) {
this.context = context;
this.arrayList = arrayList;
this.layoutInflater = LayoutInflater.from(context);
}
#Override
public CustomViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view = layoutInflater.inflate(R.layout.recycler_view_single_item, parent, false);
return new CustomViewHolder(view);
}
#Override
public void onBindViewHolder(CustomViewHolder holder, int position) {
}
#Override
public int getItemCount() {
return arrayList.size();
}
class CustomViewHolder extends RecyclerView.ViewHolder {
public CustomViewHolder(View itemView) {
super(itemView);
}
}}
Your main activity class
public class MainActivity extends AppCompatActivity {
private RecyclerView verticalScrollRecyclerView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initialiseView();
}
private void initialiseView() {
verticalScrollRecyclerView = (RecyclerView) findViewById(R.id.verticalScrollRecyclerView);
ArrayList<String> stringArrayList = new ArrayList<>();
stringArrayList.add("One");
stringArrayList.add("Two");
stringArrayList.add("Three");
stringArrayList.add("Four");
stringArrayList.add("Five");
stringArrayList.add("Six");
stringArrayList.add("Seven");
stringArrayList.add("Eight");
stringArrayList.add("Nine");
stringArrayList.add("Ten");
//setting adapter and layout manager to recyclerView
verticalScrollRecyclerView.setLayoutManager(new LinearLayoutManager(this));
verticalScrollRecyclerView.setAdapter(new CustomAdapter(this, stringArrayList));
verticalScrollRecyclerView.setHasFixedSize(true);
}}
Looks Like

Only one item displaying in recycler view

I am having problems displaying all the items in my recyclerview. My code only shows one item (Home. I have 3 items: Home, Browse Photos and My Travels)
fragment_navigation_drawer.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/fragment_navigation_drawer"
android:background="#EEE"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.traveldiaries.ztir.traveldiaries.NavigationDrawerFragment">
<!-- TODO: Update blank fragment layout -->
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="220dp"
android:background="#16a085"
android:id="#+id/linearLayout">
</LinearLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/drawerList"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</android.support.v7.widget.RecyclerView>
</RelativeLayout>
RecyclerAdapter.java
public class RecyclerAdapter extends RecyclerView.Adapter<RecyclerAdapter.MyViewHolder> {
private LayoutInflater inflater;
List<MenuList> data = Collections.emptyList();
public RecyclerAdapter(Context context, List<MenuList> data){
inflater= LayoutInflater.from(context);
this.data = data;
}
#Override
public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
View view=inflater.inflate(R.layout.itemlist,parent,false);
MyViewHolder holder= new MyViewHolder(view);
return holder;
}
#Override
public void onBindViewHolder(MyViewHolder holder, int position) {
MenuList current=data.get(position);
holder.title.setText(current.title);
holder.image.setImageResource(current.icon);
}
#Override
public int getItemCount() {
return data.size();
}
class MyViewHolder extends RecyclerView.ViewHolder{
TextView title;
ImageView image;
public MyViewHolder(View itemView) {
super(itemView);
title = (TextView) itemView.findViewById(R.id.item_list);
image = (ImageView) itemView.findViewById(R.id.icons);
}
}
}
NavigationDrawerFragment.java (posted code only related to recyclerview)
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
View layout = inflater.inflate(R.layout.fragment_navigation_drawer, container, false);
recyclerView = (RecyclerView) layout.findViewById(R.id.drawerList);
adapter = new RecyclerAdapter(getActivity(),getData());
recyclerView.setAdapter(adapter);
recyclerView.setLayoutManager(new LinearLayoutManager(getActivity()));
return layout;
}
public static List<MenuList> getData(){
List<MenuList> data = new ArrayList<>();
String[] titles={"Home","My Travels","Browse Photos"};
int[] icons ={R.drawable.home,R.drawable.sunglasses,R.drawable.tooltip_image};
for(int i=0;i<3;i++){
MenuList current = new MenuList();
current.title=titles[i];
current.icon=icons[i];
Log.d("Data",titles[i]);
Log.d("Data",""+icons[i]);
data.add(current);
}
return data;
}
itemlist.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:padding="8dp"
android:id="#+id/icons"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_menu_camera"
android:layout_gravity="center_vertical"
/>
<TextView
android:id="#+id/item_list"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Dummy Text"
android:layout_gravity="center_vertical"
android:padding="8dp"
/>
</LinearLayout>
What I was able to do is to check all the passed data (all seems to be fine). Also tried to change width to wrap content (fragment_navigation_drawer.xml) in both my relative and linear layout but I just lose my background color instead and still only one item appear.

Change height of LinearLayout to wrap_content in itemlist.xml
android:layout_height="wrap_content"

Just change the height of your itemlist from "match_parent" to "wrap_content".

Develop Reference

The Android operating system is a mobile operating system that was developed by Google (GOOGL?) to be primarily used for touchscreen devices, cell phones, and tablets.

how to create image gallery with horizontal scroll - android

How can I make an image gallery with horizontal scroll in android studio in which images can be displayed one image at the screen and with buttons on the right and the left for moving to other images

You can use ViewPager instead of HorizontalScrollView, Please follow this tutorial

Related

Unable to Align 2 Cardviews Vertically Inside RecyclerView

Recycler view cardview showing wrap parent instead of match parent

Horizontal recyclerview into vertical recyclerview at specific position

Horizontal RecyclerView Like Paytm

Only one item displaying in recycler view

Categories

Resources