Tablayout in Fragment not working in Navigation Drawer - android

I am creating a tabbed layout as home fragment of navigation drawer activity,
so i called fragment named 'test' as default in main activity. like
test home_fragment=new test();
android.support.v4.app.FragmentManager manager=getSupportFragmentManager();
manager.beginTransaction().replace(R.id.layout, home_fragment,home_fragment.getTag()).commit();
if i call this fragment again . like
if (id == R.id.nav_home) {
test home_fragment=new test();
android.support.v4.app.FragmentManager manager=getSupportFragmentManager();
manager.beginTransaction().replace(R.id.layout, home_fragment,home_fragment.getTag()).commit();
}
now the result is tab1 and tab2 are gone
See the screenshot for more reference
this is my test class( tabbed layout)
package com.hackerinside.jaisonjoseph.testapp;
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;
import static android.R.attr.x;
/**
* A simple {#link Fragment} subclass.
*/
public class test extends Fragment {
public SectionsPagerAdapter mSectionsPagerAdapter;
public ViewPager mViewPager;
public test() {
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_test, container, false);
// View x = inflater.inflate(R.layout.fragment_test,null);
mSectionsPagerAdapter = new SectionsPagerAdapter (getFragmentManager());
mViewPager = (ViewPager) rootView.findViewById(R.id.container);
mViewPager.setAdapter(mSectionsPagerAdapter);
TabLayout tabLayout = (TabLayout) rootView.findViewById(R.id.tabs);
//Adding the tabs using addTab() method
tabLayout.addTab(tabLayout.newTab().setText("Tab Title 1"));
tabLayout.addTab(tabLayout.newTab().setText("Tab Title 2"));
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
tabLayout.setupWithViewPager(mViewPager);
return rootView;
}
public class SectionsPagerAdapter extends FragmentPagerAdapter {
private SectionsPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
switch (position)
{
case 0:
tab1 tab1=new tab1();
return tab1;
case 1:
tab2 tab2=new tab2();
return tab2;
default:return null;
}
}
#Override
public int getCount() {
// Show 3 total pages.
return 2;
}
#Override
public CharSequence getPageTitle(int position) {
switch (position) {
case 0:
return "SECTION 1";
case 1:
return "SECTION 2";
}
return null;
}
}
}
this is my tabbed layout xml code
<?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:tools="http://schemas.android.com/tools"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.hackerinside.jaisonjoseph.testapp.MainActivity"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<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" />
</LinearLayout>

Try this two solution:
Solution 1
instead of
public class SectionsPagerAdapter extends FragmentPagerAdapter {
use
public class SectionsPagerAdapter extends FragmentStatePagerAdapter {
Solution 2
use getChildFragmentManager() instead of getFragmentManager()
mSectionsPagerAdapter = new SectionsPagerAdapter (getChildFragmentManager());

Related

Give tabs who are a child of a viewpager a style/icon

I have a viewpager activity with tabs on the bottom:
import android.support.design.widget.FloatingActionButton;
import android.support.design.widget.Snackbar;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
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.os.Bundle;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import com.example.susan.myapplication.R;
public class ViewPagerActivity extends AppCompatActivity {
private SectionsPagerAdapter mSectionsPagerAdapter;
private ViewPager mViewPager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_view_pager);
mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
// Set up the ViewPager with the sections adapter.
mViewPager = (ViewPager) findViewById(R.id.container);
mViewPager.setAdapter(mSectionsPagerAdapter);
}
public static class PlaceholderFragment extends Fragment {
private static final String ARG_SECTION_NUMBER = "section_number";
public PlaceholderFragment() {
}
/**
* Returns a new instance of this fragment for the given section
* number.
*/
public static PlaceholderFragment newInstance(int sectionNumber) {
PlaceholderFragment fragment = new PlaceholderFragment();
Bundle args = new Bundle();
args.putInt(ARG_SECTION_NUMBER, sectionNumber);
fragment.setArguments(args);
return fragment;
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_view_pager, container, false);
TextView textView = (TextView) rootView.findViewById(R.id.section_label);
textView.setText(getString(R.string.section_format, getArguments().getInt(ARG_SECTION_NUMBER)));
return rootView;
}
}
/**
* 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) {
// getItem is called to instantiate the fragment for the given page.
// Return a PlaceholderFragment (defined as a static inner class below).
return PlaceholderFragment.newInstance(position + 1);
}
#Override
public int getCount() {
// Show 5 total pages.
return 4;
}
#Override
public CharSequence getPageTitle(int position) {
switch (position) {
case 0:
return "Home";
case 1:
return "Account";
case 2:
return "Data";
case 3:
return "Settings";
}
return null;
}
}
}
My layout looks like this:
<?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/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.example.susan.myapplication.activities.ViewPagerActivity">
<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" >
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top">
</android.support.design.widget.TabLayout>
</android.support.v4.view.ViewPager>
</android.support.design.widget.CoordinatorLayout>
I have been following Google's viewpager tutorial and have created a viewpager with 4 slides and a set of tabs. Currently the tabs are just strings which I specified. I would like to have more control of these tabs and be able to also give them an icon and to style the background. In the layout all I see is the tablayout so I am unsuyre how to access the tabs themselves to give them these features.
Update your layout XML. Put your TabLayout outside of ViewPager and give an Id to TabLayout.
activity_view_pager.xml
<?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/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.example.susan.myapplication.activities.ViewPagerActivity">
<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" />
</android.support.design.widget.CoordinatorLayout>
In your ViewPagerActivity, onCreate() method do the followings:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_view_pager);
// Toolbar
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
// Set up the ViewPager with the sections adapter.
mViewPager = (ViewPager) findViewById(R.id.container);
mViewPager.setAdapter(mSectionsPagerAdapter);
// TabLayout
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(mViewPager);
}
To customize the Tab style, follow this nice Tutorial
Hope this will help~

How to create customized swipeable tabs in android

I want to create customized swipeable tabs in my android application project as I have provided in the
picture here
.
Since link only answers are not allowed in the SO, adding some kind of steps to do.
Step 1 :
Define three different set of Fragment Classes that will be used for each tabs. [ Android recommends to use fragments instead of Activity ]
Step 2 :
Define a Pager adapter that will help you to load the above three fragments under each tabs.
Step 3 :
In you main activity define the tablayout, and set the above adapter as shown in the tutorial link.
Kindly refer the below tutorial, that is very basic and help you achieve what you needed.
http://www.truiton.com/2015/06/android-tabs-example-fragments-viewpager/
Above link, only guides you to implement the swipe-able views. If you need to implement the exact design like the image you posted needs some work in your styles xml or try with drawable images here.
One more useful link
Let me know for queries.
EDIT
I'm also refering to the same thing what #kush mentioned.
Try this..
As I tried.. you can do well..
activity_main.xml
<RelativeLayout
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"
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.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#id/tab_layout"/>
</RelativeLayout>
In your MainActivity
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
...........................
...........................
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 2"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 3"));
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) {
}
});
}
add PagerAdapter.java
package com.truiton.designsupporttabs;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
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:
TabFragment1 tab1 = new TabFragment1();
return tab1;
case 1:
TabFragment2 tab2 = new TabFragment2();
return tab2;
case 2:
TabFragment3 tab3 = new TabFragment3();
return tab3;
default:
return null;
}
}
#Override
public int getCount() {
return mNumOfTabs;
}
}
Reference...
http://www.truiton.com/2015/06/android-tabs-example-fragments-viewpager/
I found a way to make similar tab layout using pageadapter. Below is the code for the same.
MainActivity code:
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
public class MainActivity extends FragmentActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// Get the view from activity_main.xml
setContentView(R.layout.activity_main);
// Locate the viewpager in activity_main.xml
ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
// Set the ViewPagerAdapter into ViewPager
viewPager.setAdapter(new PagerAdapter(getSupportFragmentManager()));
}
}
MainActivity.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v4.view.PagerTabStrip
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top"
android:paddingBottom="10dp"
android:paddingTop="10dp"
android:textColor="#000000" />
</android.support.v4.view.ViewPager>
PageAdapter.java
import android.content.Context;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
public class PagerAdapter extends FragmentPagerAdapter {
final int PAGE_COUNT = 3;
// Tab Titles
private String tabtitles[] = new String[] { "PLAYLIST", "SONGS", "ALBUMS" };
Context context;
public PagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public int getCount() {
return PAGE_COUNT;
}
#Override
public Fragment getItem(int position) {
switch (position) {
// Open FragmentTab1.java
case 0:
SongsList fragmenttab1 = new SongsList();
return fragmenttab1;
// Open FragmentTab2.java
case 1:
SecondFragment fragmenttab2 = new SecondFragment();
return fragmenttab2;
// Open FragmentTab3.java
case 2:
ThirdFragment fragmenttab3 = new ThirdFragment();
return fragmenttab3;
}
return null;
}
#Override
public CharSequence getPageTitle(int position) {
return tabtitles[position];
}
}
You can create n fragments in your project. Here is the example fragment code.
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class SecondFragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Get the view from fragmenttab1.xml
View view = inflater.inflate(R.layout.fragment_second, container, false);
return view;
}
}
and its XML
<RelativeLayout 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" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="#string/Fragment2" />
</RelativeLayout>
Add this RESOURCE values to remove the action bar,title bar in layout in styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:windowNoTitle">true</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
</resources>

How to set the left right padding for a tab

I am trying to make a tab when swiped gives a padding between two fragment like this
I am making this with a support lib
compile 'com.astuetz:pagerslidingtabstrip:1.0.1'
My java code
import android.os.Bundle;
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.support.v7.app.AppCompatActivity;
import com.astuetz.PagerSlidingTabStrip;
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ViewPager pager = (ViewPager) findViewById(R.id.pager);
pager.setAdapter(new TestAdapter(getSupportFragmentManager()));
PagerSlidingTabStrip tabs = (PagerSlidingTabStrip) findViewById(R.id.tabs);
tabs.setViewPager(pager);
}
}
class TestAdapter extends FragmentPagerAdapter {
public TestAdapter (FragmentManager manager) {
super(manager);
}
#Override
public Fragment getItem(int i) {
Fragment fragment=null;
if (i==0){
fragment=new One();
}
if (i==1){
fragment=new Two();
}
if (i==2){
fragment=new Three();
}
return fragment;
}
#Override
public int getCount() {
return 3;
}
#Override
public CharSequence getPageTitle(int position) {
String title = new String();
if (position==0){
return "tab1";
}
if (position==1){
return "tab2";
}
if (position==2){
return "tab3";
}
return title;
}
}
I tried to set the padding in viewpager but it is not working then I tried to set pstsTabPaddingLeftRight but it is also not working my xml code
LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<com.astuetz.PagerSlidingTabStrip
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="48dip"
app:pstsShouldExpand="true"
app:pstsTextAllCaps="true"
app:pstsScrollOffset="7dp"
app:pstsIndicatorColor="#color/dem"
app:pstsDividerPadding="10dp"
app:pstsTabPaddingLeftRight="40dp"
/>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/pager">
</android.support.v4.view.ViewPager>
</LinearLayout>
is there any other way to set the padding between any two tabs
Since you are using ViewPager, the easiest way to achieve some space is to use setPageMargin() method of Viewpager, which in your case will be
ViewPager pager = (ViewPager) findViewById(R.id.pager);
pager.setPageMargin(200);
//200 is value in pixel
There is also a method setPageMarginDrawable() sets a drawable that will be used to fill the margin between pages (Android documentation).

Swipe not Working in android ViewPager using FragmentPagerAdapter

I want to create a swipe application for this I am using ViewPager in Android. When I run the code below, it runs successfully and a blue colored Fragment is opened, but swipe is not working on this. Can you tell me why?
This is the my Activity:
package app.learn.com.learnapp;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.os.Bundle;
import java.util.List;
import java.util.Vector;
import menulistFrag.blueColor;
import menulistFrag.greenColor;
import menulistFrag.redColor;
public class MenuActivityList1 extends FragmentActivity {
ViewPager viewPager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_menu_activity_list1);
viewPager = (ViewPager)findViewById(R.id.pager);
instantiateFrags();
}
public void instantiateFrags(){
List<Fragment> frags = new Vector<Fragment>();
frags.add(Fragment.instantiate(this, redColor.class.getName()));
frags.add(Fragment.instantiate(this, greenColor.class.getName()));
frags.add(Fragment.instantiate(this, blueColor.class.getName()));
PagerAdapter pagerAdapter = new PagerAdapter(getSupportFragmentManager(),frags);
viewPager.setAdapter(pagerAdapter);
viewPager.setCurrentItem(0);
}
}
This is my PagerAdapter:
package app.learn.com.learnapp;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import java.util.List;
import menulistFrag.blueColor;
import menulistFrag.greenColor;
import menulistFrag.redColor;
/**
* Created by root on 13/9/15.
*/
public class PagerAdapter extends FragmentPagerAdapter {
List<Fragment> fragments;
public PagerAdapter(FragmentManager fm,List<Fragment> fragLists){
super(fm);
fragments =fragLists;
}
#Override
public Fragment getItem(int position) {
return fragments.get(position);
}
#Override
public int getCount() {
return 3;
}
}
I have three fragments:
redColor.java
greenColor.java
blueColor.java
And this is my layout file:
<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"
android:orientation="vertical">
<android.support.v4.view.ViewPager 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"
android:id="#+id/pager">
</android.support.v4.view.ViewPager>
</LinearLayout>
Your instantiateFrags function is a bit strange - normally you should declare the fragments from within the PagerAdapter, and then instantiate the PagerAdapter itself from with the activity's onCreate method. Your code for the PagerAdapter could be something like the following:
public class PagerAdapter extends FragmentPagerAdapter {
int mNumOfTabs;
public PagerAdapter(FragmentManager fm, int NumOfTabs){
super(fm);
this.mNumOfTabs = NumOfTabs;
}
#Override
public Fragment getItem(int position) {
switch (position) {
case 0:
blueColor tab1 = new blueColor();
return tab1;
case 1:
greenColor tab2 = new greenColor();
return tab2;
case 2:
redColor tab3 = new redColor();
return tab3;
default:
return null;
}
}
#Override
public int getCount() {
return mNumOfTabs;
}
}
And then in your onCreate method in the main activity initialise the PagerAdapter (I have used a TabLayout here):
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab().setText("Blue"));
tabLayout.addTab(tabLayout.newTab().setText("Green"));
tabLayout.addTab(tabLayout.newTab().setText("Red"));
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
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) {
}
});
xml for the tab layout and pager:
<android.support.design.widget.TabLayout
android:id="#+id/tab_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:layout_alignParentTop="true"
android:theme="#style/YOUR_THEME_HERE"/>
<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 - ActionBarActivity with ViewPager

i have a problem with ActionBarActivity and ViewPager.
On my "main-activity" which is a ActionBarActivity i have some tabs, which are fragments.
I want to implement the "swipe-feature" between these tabs.
I've already read the following tutorial:
http://developer.android.com/training/implementing-navigation/lateral.html
Actually i have implemented the whole code, but my app wont work. :(
There is no "swipe-feature" between the tabs.
Here is my code of the main-activity:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_hauptmenue_extended);
try {
actionBar = getSupportActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
// ViewPager ...
pagerAdapter = new CollectionPagerAdapter(
getSupportFragmentManager());
viewPager = (ViewPager) findViewById(R.id.viewpager);
viewPager.setAdapter(pagerAdapter);
viewPager.setCurrentItem(1);
viewPager
.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
#Override
public void onPageSelected(int position) {
actionBar.setSelectedNavigationItem(position);
}
});
// Add all tabs to the actionbar...
Tab tabB = actionBar.newTab();
tabB.setText("Home");
tabB.setIcon(R.drawable.icon_home);
tabB.setTabListener(new TabListener<Startmenue_activity>(this,
"Start", Startmenue_activity.class, viewPager));
actionBar.addTab(tabB);
Tab tabA = actionBar.newTab();
tabA.setText("");
tabA.setIcon(R.drawable.icon_nachrichten_sel);
tabA.setTabListener(new TabListener<Nachrichten_activity>(this,
"News", Nachrichten_activity.class, viewPager));
actionBar.addTab(tabA);
Tab tabC = actionBar.newTab();
tabC.setText("");
tabC.setIcon(R.drawable.icon_favoriten);
tabC.setTabListener(new TabListener<Favoriten_activity>(this,
"Favs", Favoriten_activity.class, viewPager));
actionBar.addTab(tabC);
And my adapter looks like this:
public class CollectionPagerAdapter extends FragmentPagerAdapter {
final int NUM_ITEMS = 3; // number of tabs
List<Fragment> fragments = new ArrayList<Fragment>();
public Fragment getItem(int pos) {
return fragments.get(pos);
}
public void addFragment(Fragment f) {
fragments.add(f);
}
public CollectionPagerAdapter(FragmentManager fm) {
super(fm);
Fragment home_Fragment = new Startmenue_activity();
addFragment(home_Fragment);
Fragment news_Fragment = new Nachrichten_activity();
addFragment(news_Fragment);
Fragment favoriten_Fragment = new Favoriten_activity();
addFragment(favoriten_Fragment);
}
#Override
public int getCount() {
return NUM_ITEMS;
}
}
Oh and my XML of the main-activity looks like this:
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/fragView"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".Hauptmenue_extended" >
<!-- The ViewPager -->
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<!-- The main content view -->
<FrameLayout
android:id="#+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</FrameLayout>
<!-- The navigation drawer -->
<ListView
android:id="#+id/left_drawer"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#fff"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp" />
</android.support.v4.view.ViewPager>
</android.support.v4.widget.DrawerLayout>
There's a bunch of things that I don't fully understand about your code, for example, why are you putting a ListView inside the ViewPager?. Anyways if you want to implement some tabs with the swipe feature. Here is how do it:
First the xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<android.support.v4.view.PagerTabStrip
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top" />
</android.support.v4.view.ViewPager>
Now the activity:
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
public class MainActivity extends FragmentActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ViewPager pager = (ViewPager) findViewById(R.id.pager);
pager.setAdapter(new SampleAdapter(this, getSupportFragmentManager()));
}
}
The adapter:
import android.content.Context;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
public class SampleAdapter extends FragmentStatePagerAdapter {
Context ctxt = null;
public SampleAdapter(Context ctxt, FragmentManager mgr) {
super(mgr);
this.ctxt = ctxt;
}
#Override
public int getCount() {
return 3;
}
#Override
public Fragment getItem(int position) {
switch (position) {
case 0:
return new SimpleFragment("Hi");
case 1:
return new SimpleFragment("There");
case 2:
return new SimpleFragment("Fella");
}
return null;
}
#Override
public String getPageTitle(int position) {
switch (position) {
case 0:
return "First Tab";
case 1:
return "Second Tab";
case 2:
return "Third Tab";
}
return null;
}
}
And the SimpleFragment:
import android.annotation.SuppressLint;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
#SuppressLint("ValidFragment")
public class SimpleFragment extends Fragment {
String text;
public SimpleFragment(String string) {
text = string;
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View root = inflater.inflate(R.layout.fragment, container, false);
TextView textview = (TextView) root.findViewById(R.id.textView1);
textview.setText(text);
return root;
}
}
And the fragment.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</RelativeLayout>
Hope this helps :)
Try this out. But I've not tested it.
http://wptrafficanalyzer.in/blog/swipable-navigation-tabs-using-actionbarcompat-library/

Categories

Resources