Hi I have a small problem with the tab layout. After I have implemented tab layout and put the recycle view in I have the problem that after I scroll the list the toolbar seem to blend with the title. Am I making the mistake in the code tab activity or its some other issue.
Thanks
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
Tab activity:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_completed__challenges);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
// Create the adapter that will return a fragment for each of the three
// primary sections of the activity.
mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
// Set up the ViewPager with the sections adapter.
mViewPager = (ViewPager) findViewById(R.id.container);
mViewPager.setAdapter(mSectionsPagerAdapter);
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(mViewPager);
}
/**
* A {#link FragmentPagerAdapter} that returns a fragment corresponding to
* one of the sections/tabs/pages.
*/
public class SectionsPagerAdapter extends FragmentPagerAdapter {
public SectionsPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
switch (position){
case 0:
tab1_completed_running tab1 = new tab1_completed_running();
return tab1;
case 1:
tab2_completed_walking tab2 = new tab2_completed_walking();
return tab2;
case 2:
tab3_completed_cycling tab3 = new tab3_completed_cycling();
return tab3;
default:
return null;
}
}
#Override
public int getCount() {
// Show 3 total pages.
return 3;
}
#Override
public CharSequence getPageTitle(int position) {
switch (position) {
case 0:
return "Running";
case 1:
return "Walking";
case 2:
return "Cycling";
}
return null;
}
}
Layout of recycle view:
<android.support.v7.widget.RecyclerView
android:id="#+id/tab_resultList"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="20dp">
</android.support.v7.widget.RecyclerView>
Related
I am trying to combine TabLayout and BottomNavigationView in one TabsActivity.java file. TabLayout works fine but facing problem with BottomNavigationView. It doesn't display its fragment pages content on ViewPager ( #+id/container ) but it hides and shows TabLayout which means it's getting through switch (item.getItemId()) { cases.
It loads first page during app start but once I click on bottom tabs all I see is white pages on every tab. Any idea how to fix this problem?
java
public class TabActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tab);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
final SectionsPagerAdapter mSectionsPagerAdapter;
mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
final ViewPager mViewPager;
mViewPager = (ViewPager) findViewById(R.id.container);
mViewPager.setAdapter(mSectionsPagerAdapter);
final TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(mViewPager);
BottomNavigationView bottomNavigationView = (BottomNavigationView)
findViewById(R.id.navigation);
bottomNavigationView.setOnNavigationItemSelectedListener
(new BottomNavigationView.OnNavigationItemSelectedListener() {
#Override
public boolean onNavigationItemSelected(#NonNull MenuItem item) {
Fragment selectedFragment = null;
switch (item.getItemId()) {
case R.id.action_item1:
selectedFragment = HomeTab.newInstance();
tabLayout.setVisibility(View.VISIBLE);
break;
case R.id.action_item2:
selectedFragment = StatusTab.newInstance();
tabLayout.setVisibility(View.GONE);
break;
}
FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
transaction.replace(R.id.container, selectedFragment);
transaction.commit();
return true;
}
});
FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
transaction.replace(R.id.container, HomeTab.newInstance());
transaction.commit();
}
public void do_refresh(View v){
//try refresh onclick
}
private class SectionsPagerAdapter extends FragmentPagerAdapter {
private SectionsPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
switch (position){
case 0:
return new HomeTab();
case 1:
return new SecondTab();
case 2:
return new ThirdTab();
default:
return null;
}
}
#Override
public int getCount() {
return 3;
}
#Override
public CharSequence getPageTitle(int position) {
switch (position) {
case 0:
return "Home";
case 1:
return "Second";
case 2:
return "Third";
}
return null;
}
}
}
xml
<android.support.design.widget.CoordinatorLayout
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"
android:fitsSystemWindows="true"
tools:context="com.tesrs.serv">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay">
<TextView
android:id="#+id/custom_toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="20dp"
android:layout_gravity="end"
android:onClick="do_refresh"
android:text="test"/>
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="45dp"
android:background="#color/greyish"
app:tabTextColor="#color/inactiveblack"
app:tabSelectedTextColor="#color/activeblack"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="40dp"
android:layout_marginTop="85dp"/>
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_gravity="bottom"
android:background="#color/greyish"
app:itemIconTint="#color/black"
app:itemTextColor="#color/black"
app:menu="#menu/bottom_tab"/>
</android.support.design.widget.CoordinatorLayout>
transaction.replace(R.id.container, selectedFragment);
it should be your frame layout to be replaced with selected fragment, not view pager
<FrameLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true">
</FrameLayout>
I have a activity that contain 2 fragments and both the fragments containing a recyclerview.
I need to implement a swipe gesture (when i swipe from one side to another the fragments need to be changed).
Previously i have added swipe gesture, but when i swipe the recycler view will scroll instead of change of fragments.
Can you help in implementing this..
Thanks
Use TabLayout with ViewPager. Create two tabs for two fragments in the activity .
http://www.androidhive.info/2015/09/android-material-design-working-with-tabs/
just use Android TabLayout with ViewPager and your problem will be solved :)
This is how you can do it:
public class YourActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.your_activity);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);
setupViewPager(viewPager);
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.setupWithViewPager(viewPager);
}
private void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new FragmentOne(), "Fragment One");
adapter.addFragment(new FragmentTwo(), "Fragment Two");
viewPager.setAdapter(adapter);
}
private class ViewPagerAdapter extends FragmentPagerAdapter {
private final List<Fragment> fragmentList = new ArrayList<>();
private final List<String> fragmentTitleList = new ArrayList<>();
ViewPagerAdapter(FragmentManager fragmentManager) {super(fragmentManager);}
#Override
public Fragment getItem(int position) {return fragmentList.get(position);}
#Override
public int getCount() {
return fragmentList.size();
}
void addFragment(Fragment fragment, String title) {
fragmentList.add(fragment);
fragmentTitleList.add(title);
}
#Override
public CharSequence getPageTitle(int position) {
return fragmentTitleList.get(position);
}
}
}
And this is the .XML file:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
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/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".YourActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="8dp"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:animateLayoutChanges="true"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
Hope it helps!
Simply use Tablayout and ViewPager
Here the code :-
public class DispatchOrderTab extends Fragment {
public static TabLayout tabLayout;
public static ViewPager viewPager;
public static int int_items = 2 ;
android.support.v4.app.FragmentManager mFragmentManager;
View view;
#Nullable
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
getActivity().setTitle("Order");
View x = inflater.inflate(R.layout.activity_dispatch_order_tab,null);
tabLayout = (TabLayout) x.findViewById(R.id.sliding_tabs_dispatchtoken);
viewPager = (ViewPager) x.findViewById(R.id.viewpagerdispatchtoken);
viewPager. setOffscreenPageLimit(2);
viewPager.setAdapter(new MyAdapter(getChildFragmentManager()));
tabLayout.setupWithViewPager(viewPager);
return x;
}
class MyAdapter extends FragmentPagerAdapter {
Order order;
Home home;
public MyAdapter(FragmentManager fm) {
super(fm);
}
/**
* Return fragment with respect to Position .
*/
#Override
public Fragment getItem(int position)
{
switch (position){
//Here u can put your fragment files for swipe
case 0 : return new Dispatchorder();
case 1 : return new DispatchOrderTokenComplete();
}
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 :
//Here you can put the name of tabs.
return "Pending Order";
case 1 :
return "Complete Order";
}
return null;
}
}
}
Here the xml :-
<LinearLayout 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.Weal.sachin.omcom.TabFragment"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="#+id/sliding_tabs_dispatchtoken"
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="#11977c"
app:tabTextColor="#d2cece"
app:tabSelectedTextColor="#fff"
/>
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v4.view.ViewPager
android:id="#+id/viewpagerdispatchtoken"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white">
android:background="#color/white">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/framelayout1"></FrameLayout>
</android.support.v4.view.ViewPager>
</android.support.design.widget.CoordinatorLayout>
</LinearLayout>
Hope this will help you... :)
I have a project that uses Action Bar Tabs(with ViewPager).
Tabs move really smoothly when swiping between them, but I need to add two sub tabs, in TAB 2, then move to the next tabs or of course back, just like on the Glassdoor or Flipboard.
Please help.
MainActivity
public class MainActivity extends AppCompatActivity {
private SectionsPagerAdapter mSectionsPagerAdapter;
private ViewPager mViewPager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
mViewPager = (ViewPager) findViewById(R.id.container);
mViewPager.setAdapter(mSectionsPagerAdapter);
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(mViewPager);
}
public class SectionsPagerAdapter extends FragmentPagerAdapter {
public SectionsPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
switch (position) {
case 0:
return Tab1Fragment.newInstance();
case 1:
return Tab2Fragment.newInstance();
default:
return Tab3Fragment.newInstance();
}
}
#Override
public int getCount() {
// Show 3 total pages.
return 3;
}
#Override
public CharSequence getPageTitle(int position) {
switch (position) {
case 0:
return "Tab 1";
case 1:
return "Tab 2";
case 2:
return "Tab 3";
}
return null;
}
}
}
activity_main.xml
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/appbar_padding_top"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
Tab2Fragment- where i want to nest SubTab1Fragment and SubTab2Fragment
public class Tab2Fragment extends Fragment {
private static final String ARG_PARAM1 = "param1";
private static final String ARG_PARAM2 = "param2";
public Tab2Fragment() {
// Required empty public constructor
}
// TODO: Rename and change types and number of parameters
public static Tab2Fragment newInstance() {
Tab2Fragment fragment = new Tab2Fragment();
return fragment;
}
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
if (getArguments() != null) {
}
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_tab2, container, false);
}
}
fragment_tab2.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"
tools:context="com.r3dm4n.testprojectapp.Tab2Fragment">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/hello_blank_fragment" />
I figured this out.
I've also posted a demo project on Github
In the MainActivity you need to return a new Fragment for the one you want "nested" like this:
#Override
public Fragment getItem(int position) {
switch (position) {
case 0:
return Tab1Fragment.newInstance();
case 1:
return new Tab2Fragment();
default:
return Tab3Fragment.newInstance();
}
In TAB2 fragment, where you want the other nested fragments make the following changes:
public class Tab2Fragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_tab2, container, false);
ViewPager mViewPager = (ViewPager) view.findViewById(R.id.container_main);
SectionsPagerAdapter mSectionsPagerAdapter = new SectionsPagerAdapter(getChildFragmentManager());
mViewPager.setAdapter(mSectionsPagerAdapter);
return view;
}
private class SectionsPagerAdapter extends FragmentPagerAdapter {
public SectionsPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
switch (position) {
case 0:
return Nest1Fragment.newInstance(1);
default:
return Nest2Fragment.newInstance(2);
}
}
#Override
public int getCount() {
// Show 4 total pages.
return 2;
}
#Override
public CharSequence getPageTitle(int position) {
switch (position) {
case 0:
return "Nested 1";
default:
return "Nested 2";
}
}
}
}
fragment_tab2.xml
<android.support.v4.view.ViewPager
android:id="#+id/container_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
app:layout_scrollFlags="scroll|enterAlways">
<android.support.design.widget.TabLayout
android:id="#+id/tabs2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
</android.support.v4.view.ViewPager>
Take a look at this answer
It might help
ViewPager nested in ViewPager
Also while adding sub tabs You can add a condition like this in the listener for moving to next tab
if(mPager.getCurrentItem() >=2)
mParentPager.setCurrentItem()=mParentPager.getCurrenItem()+1
This for moving to previous tab
if(mPager.getCurrentItem() ==0)
mParentPager.setCurrentItem()=mParentPager.getCurrenItem()-1
I have successfully used TabLayout with AppCompatActivity with a CoordinatorLayout that looks close to this snippet:
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:fab="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="snap"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabMode="fixed" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content" />
</android.support.design.widget.CoordinatorLayout>
Now I have implemented a NavigationDrawer and I am struggling to implement tabs within one of the Fragments being shown inside my AppCompatActivity. I want to be able to switch with TabLayout between few child Fragments inside of this Fragment.
How do I access TabLayout from one of my Fragments?
How do I set PagerAdapter for each of the Fragments correctly?
Where do I call addOnPageChangeListener?
How do I hide TabLayout when one of my Fragments does not need to
display tabs?
1. Switching between first-level Fragments
Suppose layout content.xml stands for:
<FrameLayout 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/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context=".ui.MyActivity"
tools:showIn="#layout/my_activity" />
Then, to be able to switch between the Fragments, implement this function:
private void makeTransition(int fragmentId) {
FragmentManager fragmentManager = getSupportFragmentManager();
FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
switch (fragmentId) {
// Fragment with tabs
case FRAGMENT_TABS:
fragmentTransaction.replace(R.id.fragment_container, new TabsFragment());
// This shows TabLayout
findViewById(R.id.tabs).setVisibility(View.VISIBLE);
getSupportActionBar().setTitle(R.string.fragment_tabs_title);
break;
// Fragment with no tabs
case FRAGMENT_NO_TABS:
fragmentTransaction.replace(R.id.fragment_container, new NoTabsFragment());
// This hides TabLayout
findViewById(R.id.tabs).setVisibility(View.GONE);
getSupportActionBar().setTitle(R.string.fragment_no_tabs_title);
break;
default:
throw new RuntimeException("No fragment with ID " + fragmentId + " found");
}
fragmentTransaction.commit();
}
2. Accessing and setting up TabLayout from first-level Fragment
In TabsFragment class, add a private class TabAdapter:
private class TabAdapter extends FragmentPagerAdapter {
public TabAdapter(FragmentManager fm) {
super(fm);
}
#Override
public CharSequence getPageTitle(int position) {
switch (position) {
case 0:
return "TAB1";
case 1:
return "TAB2";
// ...
}
return null;
}
#Override
public Fragment getItem(int position) {
switch (position) {
case 0:
return Tab1Fragment.getInstance();
case 1:
return Tab2Fragment.getInstance();
// ...
}
return null;
}
#Override
public int getCount() {
return 2;
}
}
Also, optionally, implement a ViewPager.OnPageChangeListener:
private class FragmentPageChangeListener implements ViewPager.OnPageChangeListener {
#Override
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
Log.d(getClass().getName(), "onPageScrolled");
}
#Override
public void onPageSelected(int position) {
Log.d(getClass().getName(), "onPageSelected");
}
#Override
public void onPageScrollStateChanged(int state) {
Log.d(getClass().getName(), "onPageScrollStateChanged");
}
}
Suppose your layout for fragment with tabs is like this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true" />
</RelativeLayout>
Override onCreateView to look like this:
#Nullable
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.viewpager_fragment, null);
fragmentPagerAdapter = new TabAdapter(getChildFragmentManager());
fragmentPageChangeListener = new FragmentPageChangeListener();
ViewPager pager = (ViewPager) view.findViewById(R.id.viewpager);
pager.setAdapter(fragmentPagerAdapter);
pager.addOnPageChangeListener(fragmentPageChangeListener);
TabLayout tabLayout = (TabLayout) MyAcvtivity.getInstance().findViewById(R.id.tabs);
tabLayout.setupWithViewPager(pager);
return view;
}
NB:
Use getChildFragmentManager() and not getFragmentManager() in first-level Fragments when instantiating a ViewPager.
I am trying to implement both tabs and navigation drawer.
I have already successfully implemented tabs, and I started to insert navigation drawer, now just in my activity_main.xml layout.
I don't know how to implement this in my main activity, since all tutorials I have found don't use the same structure I use for my tabs.
Ideally, I want that on a click to the last tab, the navigation drawer opens from right, like that I could mask ActionBar (like Airbnb did)
I think it could be possible either with moving my tabs on action bar, or making a tab icon click to open navigation drawer (simpler I think.
If it is not possible, keep my sliding tabs and their "links" just bellow action bar.
How do you think I can activate/display and populate my navigation drawer, without disturbing my tabs ?
activity_main.xml
<LinearLayout
android:id="#+id/main_layout"
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"
android:orientation="vertical"
tools:context=".MainActivity">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#id/tab_layout"/>
</android.support.v4.widget.DrawerLayout>
MainActivity.java
public class MainActivity extends AppCompatActivity {
private int[] tabIcons = {
R.drawable.ic_discover_tab,
R.drawable.ic_planning_tab,
R.drawable.ic_favorite_tab,
R.drawable.ic_message_tab,
R.drawable.ic_account_tab
};
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
//getSupportActionBar().setDisplayHomeAsUpEnabled(true); //Fleche de retour
//getSupportActionBar().setDisplayShowHomeEnabled(false); // hides action bar icon
//getSupportActionBar().setDisplayShowTitleEnabled(false); // hides action bar title
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
for (int i=0; i<=4; i++) {
tabLayout.addTab(tabLayout.newTab().setIcon(tabIcons[i]));//.setText("D").setIcon()
}
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
final ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
final PagerAdapter adapter = new PagerAdapter (getSupportFragmentManager(), tabLayout.getTabCount());
viewPager.setAdapter(adapter);
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
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) {
}
});
//Launch login activity
Intent intent = new Intent(this, LoginActivity.class);
startActivity(intent);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
PagerAdapter.java
public class PagerAdapter extends FragmentStatePagerAdapter {
int mNumOfTabs;
public PagerAdapter(FragmentManager fm, int NumOfTabs) {
super(fm);
this.mNumOfTabs = NumOfTabs;
}
#Override
public Fragment getItem(int position) {
switch (position) {
case 0:
Tab1Discover tab1 = new Tab1Discover();
return tab1;
case 1:
Tab2Planning tab2 = new Tab2Planning();
return tab2;
case 2:
Tab3Favorites tab3 = new Tab3Favorites();
return tab3;
case 3:
Tab4Messages tab4 = new Tab4Messages();
return tab4;
case 4:
Tab5Profile tab5 = new Tab5Profile();
return tab5;
default:
return null;
}
}
#Override
public int getCount() {
return mNumOfTabs;
}
}
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:id="#+id/drawerLayout"
android:layout_height="match_parent">
<RelativeLayout
android:layout_gravity="start"
android:layout_width="240dp"
android:layout_height="match_parent">
</RelativeLayout>
</android.support.v4.widget.DrawerLayout>
change android:layout_gravity="start" to android:layout_gravity="end" to change navigationdrawer position from left to right