android android-fragments layout android-viewpager android-tablayout

ViewPager not showing up in xml and not working in emulator?

I have an application where I have a part of the screen for displaying information about a student and the remaining part with tablayout and viewpager. My problem is tablayout shows up in the design editor but viewpager doesn't. In-spite of the code written nothing is showing up. Tell me where I am getting things wrong?

CAMarksFragment.java

package com.learn.app;

import android.content.Context;
import android.content.SharedPreferences;
import android.net.Uri;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;

import android.support.v4.view.ViewPager;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;


public class CAMarksFragment extends Fragment {
TabLayout tabLayout;
ViewPager viewPager;
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
}
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    // Inflate the layout for this fragment

    return inflater.inflate(R.layout.fragment_camarks, container, false);
}
@Override
public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);
    //you can set the title for your toolbar here for different fragments different titles
    getActivity().setTitle("CA Marks");
    viewPager=(ViewPager)getActivity().findViewById(R.id.viewPager);
    viewPager.setAdapter(new CustomAdapter(getActivity().getSupportFragmentManager(),getActivity().getApplicationContext()));
    tabLayout=(TabLayout)getActivity().findViewById(R.id.tabLayout);
    tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
        @Override
        public void onTabSelected(TabLayout.Tab tab) {
            viewPager.setCurrentItem(tab.getPosition());
        }

        @Override
        public void onTabUnselected(TabLayout.Tab tab) {
            viewPager.setCurrentItem(tab.getPosition());
        }

        @Override
        public void onTabReselected(TabLayout.Tab tab) {
            viewPager.setCurrentItem(tab.getPosition());
        }
    });
}

@Override
public void onActivityCreated(@Nullable Bundle savedInstanceState) {
    super.onActivityCreated(savedInstanceState);
    SharedPreferences pref = getActivity().getApplicationContext().getSharedPreferences("AppStatus", 0); // 0 - for private mode
    SharedPreferences.Editor editor = pref.edit();
    editor.putBoolean("Home", false);
    editor.commit();



}

private class CustomAdapter extends FragmentPagerAdapter {
    private String[] fragments={"Theory","Practical"};
    public CustomAdapter(FragmentManager supportFragmentManager, Context applicationContext) {
        super(supportFragmentManager);
    }

    @Override
    public Fragment getItem(int position) {
        switch (position){
            case 0:
                return new Theory();
            case 1:
                return new Practical();
            default:
                return null;
        }
    }

    @Override
    public int getCount() {
        return fragments.length;
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return fragments[position];
    }
}
}

fragments_camarks.xml

<FrameLayout 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"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="com.learn.app.TestTimeTableFragment">
<ScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/tablebackgrounds"
    >
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:weightSum="100"
        >
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:id="@+id/ca_all"
            android:background="@drawable/allbackgrounds"
            >
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"


                >
                <ImageButton
                    android:id="@+id/user_profile_photo"
                    android:layout_width="120dp"
                    android:layout_height="120dp"
                    android:layout_marginTop="10dp"
                    android:layout_centerHorizontal="true"
                    android:background="@drawable/profile_circular_border_imageview"
                    android:padding="20dp"
                    android:scaleType="centerCrop"
                    android:src="@drawable/defaultpic" />
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical"

                    >
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:textSize="20dp"
                        android:text="Hewitt"
                        android:textStyle="bold"
                        android:textColor="#ffffff"
                        android:id="@+id/camarks_name"
                        android:padding="10dp"
                        />
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:textSize="14dp"
                        android:id="@+id/camarks_dept"
                        android:text="Master of Computer Application"
                        android:textColor="#ffffff"
                        android:padding="10dp"
                        />
                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:textSize="14dp"
                        android:id="@+id/camarks_rollno"
                        android:text="15mx13"
                        android:textColor="#ffffff"
                        android:padding="10dp"
                        />

                </LinearLayout>
            </LinearLayout>
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:textSize="20dp"
                android:textColor="#ffffff"
                android:textStyle="bold"
                android:background="#80000000"
                android:id="@+id/ca_title"
                android:text="CA Marks"
                android:gravity="center"
                android:padding="10dp"
                />
        </LinearLayout>

        <android.support.design.widget.TabLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/tabLayout"
            android:layout_below="@id/ca_all"
            android:background="@color/colorPrimaryDark"
            app:tabGravity="fill"
            app:tabMode="fixed"
            >


        </android.support.design.widget.TabLayout>
        <android.support.v4.view.ViewPager
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/viewPager"
            android:layout_below="@id/tabLayout"
            android:layout_centerHorizontal="true"
            >

        </android.support.v4.view.ViewPager>
        </RelativeLayout>
    </ScrollView>
    </FrameLayout>

Practical.java

package com.learn.app;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;


public class Practical extends Fragment {
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment

        return inflater.inflate(R.layout.fragment_layout1, container,  false);
   }
}

Theory.java

package com.learn.app;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

public class Theory extends Fragment {
     @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    // Inflate the layout for this fragment

    return inflater.inflate(R.layout.fragment_layout, container, false);
}
}

fragment_layout contains linearlayout with a textview in it. In the emulator viewpager doesn't showup and tablayout remain untouchable.What I am getting wrong here. Help me to proceed further. Thanks in advance.

Emulator Output

Solution

Many things are wrong in the code.

in xml : add android:layout_height="match_parent" for viewpager

<android.support.v4.view.ViewPager
            android:id="@+id/viewPager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_below="@id/tabLayout"
            android:layout_centerHorizontal="true">

in code:

change your code as: you need to use fragment's view to get the viewpager instance. Also your code missing some basic functionalities for viewpager with tablayout

  @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment

        View view = inflater.inflate(R.layout.fragment_camarks, container, false);

        viewPager=(ViewPager)view.findViewById(R.id.viewPager);
        tabLayout=(TabLayout)view.findViewById(R.id.tabLayout);
        tabLayout.addTab(tabLayout.newTab().setText("Theory"));
        tabLayout.addTab(tabLayout.newTab().setText("Practical"));
        tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
        viewPager.setAdapter(new CustomAdapter(getActivity().getSupportFragmentManager(),getActivity().getApplicationContext()));
        tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
            @Override
            public void onTabSelected(TabLayout.Tab tab) {
                viewPager.setCurrentItem(tab.getPosition());
            }

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

            }

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

            }
        });
        tabLayout.setupWithViewPager(viewPager);

        return view;
    }
    @Override
    public void onViewCreated(View view, @Nullable Bundle savedInstanceState) {
        super.onViewCreated(view, savedInstanceState);
        //you can set the title for your toolbar here for different fragments different titles
        getActivity().setTitle("CA Marks");

    }