Cardview inside tab fragment

Question

I'm working on material design navigation drawer with sliding tabs and I have implemented the same. Now I want to add cardview with recycler view inside one of the tab fragment but don't know how to do it.

Please can someone help me with this?

Here's my Tab fragment code:-

    public class TabFragment extends Fragment {

    public static TabLayout tabLayout;
    public static ViewPager viewPager;
    public static int int_items = 2 ;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        /**
         *Inflate tab_layout_tens and setup Views.
         */
        View x =  inflater.inflate(R.layout.tab_layout_tens,null);
        tabLayout = (TabLayout) x.findViewById(R.id.tabs);
        viewPager = (ViewPager) x.findViewById(R.id.viewpager);

        /**
         *Set an Apater for the View Pager
         */
        viewPager.setAdapter(new MyAdapter(getChildFragmentManager()));

        /**
         * Now , this is a workaround ,
         * The setupWithViewPager dose't works without the runnable .
         * Maybe a Support Library Bug .
         */

        tabLayout.post(new Runnable() {
            @Override
            public void run() {
                tabLayout.setupWithViewPager(viewPager);
            }
        });

        return x;

    }

    class MyAdapter extends FragmentPagerAdapter{

        public MyAdapter(FragmentManager fm) {
            super(fm);
        }

        /**
         * Return fragment with respect to Position .
         */

        @Override
        public Fragment getItem(int position)
        {
            switch (position){
                case 0 : return new CurrentFragment();
                case 1 : return new FavouriteFragment();

            }
            return null;
        }

        @Override
        public int getCount() {

            return int_items;

        }

        /**
         * This method returns the title of the tab according to the position.
         */

        @Override
        public CharSequence getPageTitle(int position) {

            switch (position){
                case 0 :
                    return "Current";
                case 1 :
                    return "Favourite";

            }
            return null;
        }
    }
}

And this is my fragment class in which I have added recycler view but it is giving NULL Point exception while setting the adapter.

 public class FavouriteFragment extends Fragment {
    private List<Person> persons;
    private RecyclerView rv;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

    }

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View rootView = inflater.inflate(R.layout.favourite_layout,container,false);

        RecyclerView rv = (RecyclerView)rootView.findViewById(R.id.rv);
        final LinearLayoutManager llm = new LinearLayoutManager(getActivity());
        rv.setLayoutManager(llm);

        initializeData();
        initializeAdapter();
        return rootView;
    }
    private void initializeData(){
        persons = new ArrayList<>();
        persons.add(new Person("XYZ", "jhxdjksd", R.drawable.profilepic));
        persons.add(new Person("ABC", "bsxhbs", R.drawable.profilepic));
        persons.add(new Person("PQR", "bsahxb", R.drawable.profilepic));
    }

    private void initializeAdapter(){
        RVAdapter adapter = new RVAdapter(persons);
        rv.setAdapter(adapter);
    }
}

MainActivity

    public class Tens extends AppCompatActivity {

    DrawerLayout mDrawerLayout;
    NavigationView mNavigationView;
    FragmentManager mFragmentManager;
    FragmentTransaction mFragmentTransaction;

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

        /**
         *Setup the DrawerLayout and NavigationView
         */

        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout);
        mNavigationView = (NavigationView) findViewById(R.id.shitstuff) ;

        /**
         * Lets inflate the very first fragment
         * Here , we are inflating the TabFragmentTens as the first Fragment
         */

        mFragmentManager = getSupportFragmentManager();
        mFragmentTransaction = mFragmentManager.beginTransaction();
        mFragmentTransaction.replace(R.id.containerView,new TabFragmentTens()).commit();
        /**
         * Setup click events on the Navigation View Items.
         */

        mNavigationView.setNavigationItemSelectedListener(new NavigationView.OnNavigationItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(MenuItem menuItem) {

                Fragment fragment = null;

                Class fragmentClass = null;
                switch(menuItem.getItemId()) {
                    case R.id.nav_item_tracker:
                        Intent intent = new Intent(
                        Tens.this, Tracker.class);
                startActivity(intent);
                        break;
                    case R.id.nav_item_clinic:
                        fragmentClass = ClinicFragment.class;
                        break;
                    case R.id.nav_item_about:
                        Intent intent0 = new Intent(
                                Tens.this, AboutFragment.class);
                        startActivity(intent0);
                        break;
                    case R.id.nav_item_settings:
                        Intent intent1 = new Intent(
                                Tens.this, SettingsFragment.class);
                        startActivity(intent1);
                        break;

                    case R.id.nav_item_logout:
                        Intent intent2 = new Intent(
                                Tens.this, MainActivity.class);
                        startActivity(intent2);

                        break;
                }

                try {
                    fragment = (Fragment) fragmentClass.newInstance();
                } catch (Exception e) {
                    e.printStackTrace();
                }

                FragmentTransaction xfragmentTransaction = mFragmentManager.beginTransaction();
                    xfragmentTransaction.replace(R.id.containerView, new TabFragmentTens()).commit();

                mDrawerLayout.closeDrawers();


                return false;
            }

        });


        android.support.v7.widget.Toolbar toolbar = (android.support.v7.widget.Toolbar) findViewById(R.id.toolbar);
        ActionBarDrawerToggle mDrawerToggle = new ActionBarDrawerToggle(this,mDrawerLayout, toolbar,R.string.app_name,
                R.string.app_name);

        mDrawerLayout.setDrawerListener(mDrawerToggle);

        mDrawerToggle.syncState();

    }
}

Here's my recyclerview class:-

 public class RVAdapter extends RecyclerView.Adapter<RVAdapter.PersonViewHolder> {

    public static class PersonViewHolder extends RecyclerView.ViewHolder {

        CardView cv;
        TextView personName;
        TextView personAge;
        ImageView personPhoto;

        PersonViewHolder(View itemView) {
            super(itemView);
            cv = (CardView)itemView.findViewById(R.id.cv);
            personName = (TextView)itemView.findViewById(R.id.person_name);
            personAge = (TextView)itemView.findViewById(R.id.person_age);
            personPhoto = (ImageView)itemView.findViewById(R.id.person_photo);
        }
    }

    List<Person> persons;

    RVAdapter(List<Person> persons){
        this.persons = persons;
    }

    @Override
    public void onAttachedToRecyclerView(RecyclerView recyclerView) {
        super.onAttachedToRecyclerView(recyclerView);
    }

    @Override
    public PersonViewHolder onCreateViewHolder(ViewGroup viewGroup, int i) {
        View v = LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.card_view_tens_fvrt, viewGroup, false);
        PersonViewHolder pvh = new PersonViewHolder(v);
        return pvh;
    }

    @Override
    public void onBindViewHolder(PersonViewHolder personViewHolder, int i) {
        personViewHolder.personName.setText(persons.get(i).name);
        personViewHolder.personAge.setText(persons.get(i).age);
        personViewHolder.personPhoto.setImageResource(persons.get(i).photoId);
    }

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

I want to add cardview with recycler view inside Favourite fragment. I know how to implement cardview but unable to implement it inside fragments.

Kasi

Can u plz post ur whole code. – Villalobos

Do your fragment have a parent activity..? – Villalobos

Done @RubinNellikunnathu – Kasi

I hope u have mainactivity..Isnt it.? – Villalobos

if yes . move your code for tablayout and viewpager to mainactivity. then create fragments for each tab. add only recyclerview to the fragment class..(Now u added tablayout and viewpager in your Tabfragment). – Villalobos

Its like I have implemented a main activity "Tens" which is having sliding tab fragments "Current" and "Favorite". Now I want to add cardview with recyclerview inside the "Favorite Fragment". – Kasi

Answer Updated. try that way please. – Villalobos

Answer 1

first Make Changes in your mainactivity . here i added a navigation drawer and tablayout in mainactivity.

public class HomeActivity extends AppCompatActivity
        implements NavigationView.OnNavigationItemSelectedListener {


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_home);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);

        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
                this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
        drawer.setDrawerListener(toggle);
        toggle.syncState();

        NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
        navigationView.setNavigationItemSelectedListener(this);

        TabLayout tabLayout1 = (TabLayout) findViewById(R.id.tab_layout1);
        tabLayout1.addTab(tabLayout1.newTab().setIcon(R.drawable.tab_ic_home));
        tabLayout1.addTab(tabLayout1.newTab().setIcon(R.drawable.tab_ic_map));
        tabLayout1.addTab(tabLayout1.newTab().setIcon(R.drawable.tab_ic_login));

        tabLayout1.setTabGravity(TabLayout.GRAVITY_FILL);

        final ViewPager viewPager1 = (ViewPager) findViewById(R.id.pager1);
        final PagerAdapter1 adapter = new PagerAdapter1
                (getSupportFragmentManager(), tabLayout1.getTabCount());
        viewPager1.setAdapter(adapter);
        viewPager1.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout1));
        tabLayout1.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                viewPager1.setCurrentItem(tab.getPosition());
            }

            @Override
            public void onTabUnselected(TabLayout.Tab tab) {

            }

            @Override
            public void onTabReselected(TabLayout.Tab tab) {

            }
        });
    }

    @Override
    public void onBackPressed() {
        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        if (drawer.isDrawerOpen(GravityCompat.START)) {
            drawer.closeDrawer(GravityCompat.START);
        } else {
            super.onBackPressed();
        }
    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.home, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings) {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }

    @SuppressWarnings("StatementWithEmptyBody")
    @Override
    public boolean onNavigationItemSelected(MenuItem item) {
        FragmentManager fragmentManager = getSupportFragmentManager();
        FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
        // Handle navigation view item clicks here.
        int id = item.getItemId();
        RelativeLayout mainLayout=(RelativeLayout)findViewById(R.id.main_layout);

           if (id == R.id.nav_project) {
            ProjectFragment fragment = new ProjectFragment();
            fragmentTransaction.replace(R.id.mainlayout, fragment);
            fragmentTransaction.addToBackStack(null).commit();
            }
        }

        DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
        drawer.closeDrawer(GravityCompat.START);
        return true;
    }
}

Then create a pager adapter. here u can add fragments for your tabs.. i named it as PagerAdapter1.java.

  import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;

public class PagerAdapter1 extends FragmentStatePagerAdapter {
    int mNumOfTabs;

    public PagerAdapter1(FragmentManager fm, int NumOfTabs) {
        super(fm);
        this.mNumOfTabs = NumOfTabs;
    }

    @Override
    public Fragment getItem(int position) {

        switch (position) {
            case 0:
                HomeTabFragment1 tab1 = new HomeTabFragment1();
                return tab1;
            case 1:
                HomeTabFragment2 tab2 = new HomeTabFragment2();
                return tab2;
            case 2:
                HomeTabFragment3 tab3 = new HomeTabFragment3();
                return tab3;
            default:
                return null;
        }
    }

    @Override
    public int getCount() {
        return mNumOfTabs;
    }
}

i just wanted a Recycler view in first tab. So i added code for recyclerview in HomeTabFragment1.java.

public class HomeTabFragment1 extends Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View v=inflater.inflate(R.layout.home_tab_fragment_1, container, false);
        RecyclerView rv = (RecyclerView)v.findViewById(R.id.home_recyclerview);
        setupRecyclerView(rv);
        return v;

I hope the rest you can do..

Villalobos

Thanks @Rubin but I know how to implement a recyclerview. The problem is how to implement it inside a fragment. – Kasi

yes but it is giving error while calling getItemCount() method. Log cat error- java.lang.NullPointerException: Attempt to invoke interface method 'int java.util.List.size()' on a null object reference at com.ediode.graphics3d.RVAdapter.getItemCount(RVAdapter.java:60) – Kasi

Is that getItemCount() or getCount().? – Villalobos

is your tablayout with viewpager working correctly without recyclerview.? – Villalobos

Yes tab layout with view pager is working correctly without Recyclerview – Kasi

Added @Rubin Nellikunnathu – Kasi

Answer 2

Looks like the field "rv" is never initialized in the FavouriteFragment class, you did initialize the local variable "rv" in method onCreateView.

public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
    View rootView = inflater.inflate(R.layout.favourite_layout,container,false);

    RecyclerView rv = (RecyclerView)rootView.findViewById(R.id.rv);
    final LinearLayoutManager llm = new LinearLayoutManager(getActivity());
    rv.setLayoutManager(llm);

    initializeData();
    initializeAdapter();
    return rootView;
} 

Bluecoat