Custom adapter for FirebaseAdapter to a HorizontalScrollView or Carousel

I have a simple RecyclerView where I show all the products from firebase but now I'd like to show them on a Carousel like this Library, the thing is that I have all on my ChooseProduct.java class and I'd like to create a custom Adapter to put the products as a Carousel.

First I get the products as follows :

FirebaseRecyclerOptions< CardPOJO > options =
            new FirebaseRecyclerOptions.Builder< CardPOJO >()
                    .setQuery(products_ref, CardPOJO.class)
                    .build();

And I store it on options, so then I create the Adapter

FirebaseRecyclerAdapter adapter = new   FirebaseRecyclerAdapter< CardPOJO, CardHolder>(options) {
        @Override
        public CardHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            //inflate the single recycler view layout(item)
            View view = LayoutInflater.from(parent.getContext())
                    .inflate(R.layout.card_product, parent, false);
            int width = parent.getMeasuredWidth() / 2;
            width -= mContext.getResources().getDimensionPixelSize(R.dimen._8sdp);
            final CardHolder cardViewHolder = new CardHolder(view,width);
            return cardViewHolder;
        }

        @Override
        public void onDataChanged() {
            super.onDataChanged();
            tv.setVisibility(getItemCount() == 0 ? View.VISIBLE : View.GONE);
        }

        @Override
        protected void onBindViewHolder(CardHolder holder, int position, final CardPOJO model) {
            holder.state.setText(model.getState());
            holder.cardName.setText(model.getName());
            switch (model.getState()){
                case "free":
                    //Img free
                    break;
                case "not_free":
                    //Img not free
                    break;
                default:
                    break;
            }
            holder.view.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    if(model.getState().equals("free")){
                       //stuff
                    }
                    else{
                       //stuff
                        }
                        root_ref.child("PurchasedProducts").child(currentuser).addValueEventListener(new ValueEventListener() {
                            @Override
                            public void onDataChange(DataSnapshot dataSnapshot) {
                                //stuff
                            }

                            @Override
                            public void onCancelled(DatabaseError databaseError) {

                            }
                        });
                    }

                }
            });


        }
    };
    adapter.startListening();
    products_recycler.setAdapter(adapter);

And my .xml has a RecyclerView like this :

<android.support.v7.widget.RecyclerView

        android:id="@+id/recycler_view_chooseCard"

        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        />

So my question is, how do I change this to put a Carousel and use like the example a in.goodiebag.carouselpicker.CarouselPicker instead of a RecyclerView?

Also could I move all of this code to another one to make it clean?

Note

When I try to implement the CourouselPicker it says this :

setAdapter (android.support.v4.view.PagerAdapter) in CarouselPicker cannot be applied to (com.firebase.ui.database.FirebaseRecyclerAdapter)

What I have tried so far?

I changed the RecyclerView to

<in.goodiebag.carouselpicker.CarouselPicker
            android:id="@+id/carousel"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="20dp"
            android:layout_marginTop="20dp"
            android:background="#CCC"
            app:items_visible="three" />

I initialized it : carouselPicker = (CarouselPicker) findViewById(R.id.carousel);

And then I tried to put the .setAdapter() with the FireBaseAdapter one, but they are not compatible...

carouselPicker.setAdapter(adapter);

IN CASE IT'S HARD TO DO THAT READ THIS

If that's to broad and it's too dificult to make it with ViewPager and those stuff, could be possible to create a RecyclerView that acts like carousel? You have the items horizontally and then the item on the middle you see it bigger than rest.

query.addListenerForSingleValueEvent(new ValueEventListener() { @Override public void onDataChange(DataSnapshot snapshot) { List<CarouselPicker.PickerItem> items = new ArrayList<>(); for (DataSnapshot child : snapshot.getChildren()) { CardPOJO card = child.getValue(CardPOJO.class); // Use card items.add(new CarouselPicker...); } mCarouselPicker.setAdapter(new CarouselPicker.CarouselViewAdapter(Activity.this, items, 0)); } // ... }

final ObservableSnapshotArray<CardPOJO> cards = new FirebaseArray(query, new ClassSnapshotParser<>(CardPOJO.class)); cards.addChangeEventListener(new ChangeEventListener() { @Override public void onDataChanged() { List<CarouselPicker.PickerItem> items = new ArrayList<>(); for (CardPOJO card : cards) { // Use card items.add(new CarouselPicker...); } mCarouselPicker.setAdapter(new CarouselPicker.CarouselViewAdapter(Activity.this, items, 0)); } })

Note

What I have tried so far?

IN CASE IT'S HARD TO DO THAT READ THIS

Recommended topics

Hot tags