Binding the ActionBar Tabs to a ViewPager - android

I am trying to bind the ActionBar Tabs to a ViewPager. At the very beginning I created two separate projects for ActionBar Tabs and ViewPager, and they were working fine. When trying to bind the to each other, according to the code below, the ViewPager comply to the TabListener, in other sense, when I touch an ActionBar Tab the ViewPager change accordingly and display the respective View.For an example, I have three Tabs, when touching the Tab number two, the ViewPager displays the respective page number two. and so on.
But the ActionBar Tabs do not obey the ViewPager, in other sense, when swiping the screen to move to the next page of the ViewPager, the ViewPager shows the respective View BUT the ActionBar Tab does not change its current selected state according to the current ViewPager's selected View. For an example, when swiping to to the ViewPage number three, the ViewPager displays its respected View which is number three, BUT, the current selected ActionBar Tab does not change to be number three. I could be accessing ViewPage three while the highlighted Tab is number one.
I hope I explained the problem clearly.
MainActivity
private ViewPager mViewPager;
private MyTabsPagerAdapter mPagerAdapter;
private ActionBar mActionBar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
List<Fragment> mFragList = new ArrayList<Fragment>();
mFragList.add(new Fragment01());
mFragList.add(new Fragment02());
mFragList.add(new Fragment03());
mViewPager = (ViewPager) findViewById(R.id.pager);
mActionBar = getActionBar();
mActionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
mPagerAdapter = new MyTabsPagerAdapter(getSupportFragmentManager(), mFragList);
mViewPager.setAdapter(mPagerAdapter);
for(int i=0; i<mFragList.size(); i++) {
mActionBar.addTab(mActionBar.newTab().setText("Fragment0"+(i+1)).setTabListener(this));
}
}
#Override
public void onTabReselected(Tab arg0, FragmentTransaction arg1) {
// TODO Auto-generated method stub
}
#Override
public void onTabSelected(Tab arg0, FragmentTransaction arg1) {
// TODO Auto-generated method stub
mViewPager.setCurrentItem(arg0.getPosition());
//mActionBar.setSelectedNavigationItem(arg0.getPosition());
}
#Override
public void onTabUnselected(Tab arg0, FragmentTransaction arg1) {
// TODO Auto-generated method stub
}
}
MyTabsPagerAdapter
public class MyTabsPagerAdapter extends FragmentPagerAdapter {
List<Fragment> mFragList;
public MyTabsPagerAdapter(FragmentManager fm, List<Fragment> mFragList) {
super(fm);
// TODO Auto-generated constructor stub
this.mFragList = mFragList;
}
#Override
public Fragment getItem(int arg0) {
// TODO Auto-generated method stub
return this.mFragList.get(arg0);
}
#Override
public int getCount() {
// TODO Auto-generated method stub
return this.mFragList.size();
}
}

You need to set a listener for when the viewpager changes for example,
mViewPager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
#Override
public void onPageSelected(int position) {
actionBar.setSelectedNavigationItem(position);
}
});
This waits for the viewpager to change and when it does, it sets the actionbar position equal to the position you moved the viewpager to.

Related

in swipe tabs how to keep the tab no reopen when u swipe more then one tab

i have swipe tabs with 3 tab i first tab will have web view with Facebook other got text only , now if i swipe from first tab to the second then come back to the first its good but if i swipe to the 3rd tab when i go back to the first tab the web view will reload again , how can i stop that
this is my code
home.java
public class MainActivity extends FragmentActivity {
ViewPager Tab;
TabPagerAdapter TabAdapter;
ActionBar actionBar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TabAdapter = new TabPagerAdapter(getSupportFragmentManager());
Tab = (ViewPager)findViewById(R.id.pager);
Tab.setOnPageChangeListener(
new ViewPager.SimpleOnPageChangeListener() {
#Override
public void onPageSelected(int position) {
actionBar = getActionBar();
actionBar.setSelectedNavigationItem(position); }
});
Tab.setAdapter(TabAdapter);
actionBar = getActionBar();
//Enable Tabs on Action Bar
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
ActionBar.TabListener tabListener = new ActionBar.TabListener(){
#Override
public void onTabReselected(android.app.ActionBar.Tab tab,
FragmentTransaction ft) {
// TODO Auto-generated method stub
}
#Override
public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) {
Tab.setCurrentItem(tab.getPosition());
}
#Override
public void onTabUnselected(android.app.ActionBar.Tab tab,
FragmentTransaction ft) {
// TODO Auto-generated method stub
}};
//Add New Tab
actionBar.addTab(actionBar.newTab().setText("Android").setTabListener(tabListener));
actionBar.addTab(actionBar.newTab().setText("iOS").setTabListener(tabListener));
actionBar.addTab(actionBar.newTab().setText("Windows").setTabListener(tabListener));
}
}
ViewPager has a method setOffscreenPageLimit() that determines how many pages to retain when they go off screen.
try increasing the page limit. For example:
Tab.setOffscreenPageLimit(3);

Android - Swiping without Tabs

NoteActivity Code:
public class NoteActivity extends FragmentActivity implements ActionBar.TabListener
{
private ViewPager viewPager;
private TabsPagerAdapter mAdapter;
private ActionBar actionBar;
// Tab titles
private String[] tabs = {"Note", "Note Info"};
#Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_note);
viewPager = (ViewPager) findViewById(R.id.pager);
actionBar = getActionBar();
mAdapter = new TabsPagerAdapter(getSupportFragmentManager());
viewPager.setAdapter(mAdapter);
actionBar.setHomeButtonEnabled(false);
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
// Adding Tabs
for (String tab_name : tabs) {
actionBar.addTab(actionBar.newTab().setText(tab_name)
.setTabListener(this));
}
viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
#Override
public void onPageSelected(int position) {
actionBar.setSelectedNavigationItem(position);
}
#Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
#Override
public void onPageScrollStateChanged(int arg0) {
}
});
}
#Override
public void onTabSelected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
viewPager.setCurrentItem(tab.getPosition());
}
#Override
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
}
#Override
public void onTabReselected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
}
}
TabsPageAdapter.Java
public class TabsPagerAdapter extends FragmentPagerAdapter
{
public TabsPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int index) {
switch (index)
{
case 0:
return new NoteFragment();
case 1:
return new NoteInfoFragment();
}
return null;
}
#Override
public int getCount()
{
// get item count - equal to number of tabs
return 2;
}
}
So basically, I used an example of Tabs View and got the Tabs working and it looks like this:
What would I have to do to make it just swipeable without the Tabs showing. An example is like Snapchat. It definitely uses the Swipe view control but the tabs are hidden. Can someone please show me how to get this done?
Since you already have a ViewPager in your code, all you have to do is remove the code that creates the ActionBar tabs (under the comment // Adding tabs), as well as the code that synchronizes the tab selection with the current page (start with the ViewPager.OnPageChangeListener and the ActionBar.TabListener callbacks and see if anything breaks).

how to change the tab colour in ViewPager from black to white

I want to change the tab colour in the ViewPager. I search but didn't find any good solution for it. I want to change the tab colour from default that is from black to white. Is their any way to do this programatically for i have to modify style.xml. I don't know how to do as i am new to android. plz somebody help
public class HomeActivity extends FragmentActivity implements ActionBar.TabListener
{
public ViewPager viewPager;
private PageAdapter mAdapter;
private ActionBar actionBar;
// Tab titles
private String[] tabs = { "Calculate EMI", "EMI Schedule"};
String TabFragmentSchedule;
public void setTabFragmentSchedule(String t){
TabFragmentSchedule = t;
}
public String getTabFragmentSchedule(){
return TabFragmentSchedule;
}
#SuppressLint("NewApi")
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_home);
// Initilization
viewPager = (ViewPager) findViewById(R.id.pager);
actionBar = getActionBar();
ColorDrawable colorDrawable = new ColorDrawable(Color.parseColor("#0F7BFF"));
actionBar.setBackgroundDrawable(colorDrawable);
mAdapter = new PageAdapter(getSupportFragmentManager());
viewPager.setAdapter(mAdapter);
actionBar.setHomeButtonEnabled(false);
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
// Adding Tabs
for (String tab_name : tabs)
{
actionBar.addTab(actionBar.newTab().setText(tab_name).setTabListener(this));
}
/**
* on swiping the viewpager make respective tab selected
* */
viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
#Override
public void onPageSelected(int position) {
// on changing the page
// make respected tab selected
actionBar.setSelectedNavigationItem(position);
}
#Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
#Override
public void onPageScrollStateChanged(int arg0) {
}
});
}
//method that is called to swipe viewpage on button click from calculation fragment
public void switchToFragmentSchedule(){
// viewPager.setCurrentItem(1);
viewPager.setCurrentItem(1, false);
}
#Override
public void onTabReselected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
}
#Override
public void onTabSelected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
viewPager.setCurrentItem(tab.getPosition());
}
#Override
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
}
}
You should style your theme in your xml files. You can find all the information for this task here.
If you need to change it programmatically, you can use
mActionBar.setBackgroundDrawable(new ColorDrawable(0xffffffff));
mActionBar.setDisplayShowTitleEnabled(false);
mActionBar.setDisplayShowTitleEnabled(true);
As a beginner, you might also find this styling tool very helpful.

Tab+swipe Gesture, Custom grid view, Fragments

Well I have this app with swipe gesture functionality between fragments which they contains images which are located in the resources folders .. but when i swipe left and right I noticed that the performance is bad and slow .. Any suggestions to improve it?
And here is the header of the main activity code :
public class MainActivity extends FragmentActivity implements
ActionBar.TabListener {
private ViewPager viewPager;
private TabsPagerAdapter mAdapter;
private ActionBar actionBar;
// Tab titles
private String[] tabs = {"Roman Curtain", "Roller Blinds", "Wooden Blinds" ,"Kitchen Blinds"};
//
#SuppressLint("NewApi")
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Initilization
viewPager = (ViewPager) findViewById(R.id.pager);
actionBar = getActionBar();
mAdapter = new TabsPagerAdapter(getSupportFragmentManager());
viewPager.setAdapter(mAdapter);
actionBar.setHomeButtonEnabled(false);
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
// Adding Tabs
for (String tab_name : tabs) {
actionBar.addTab(actionBar.newTab().setText(tab_name)
.setTabListener(this));
}
/**
* on swiping the viewpager make respective tab selected
* */
viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
#Override
public void onPageSelected(int position) {
// on changing the page
// make respected tab selected
actionBar.setSelectedNavigationItem(position);
}
#Override
public void onPageScrolled(int arg0, float arg1, int arg2) {
}
#Override
public void onPageScrollStateChanged(int arg0) {
}
});
}
#Override
public void onTabReselected(Tab tab, FragmentTransaction ft) {
}
#Override
public void onTabSelected(Tab tab, FragmentTransaction ft) {
// on tab selected
// show respected fragment view
viewPager.setCurrentItem(tab.getPosition());
}
#Override
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
}
and here is tab pager adapter :
public class TabsPagerAdapter extends FragmentPagerAdapter {
public TabsPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int index) {
switch (index) {
case 0:
return new RomanCurtains();
case 1:
return new RollerBlinds();
case 2:
return new WoodenBlinds();
case 3:
return new KitchenBlinds();
// case 4:
// return new KitchenBlinds();
}
return null;
}
#Override
public int getCount() {
// get item count - equal to number of tabs
return 4;
}
}
There may be a two reason for the bad performance
Your images are too big and takes too much space in the memory
You can put the images in assets folder and then use Picasso library to use them. It will improve the performance.
https://github.com/square/picasso
All the pages in the ViewPager is in the memory if you use PagerAdapter or FragmentPagerAdapter.
If you use FragmentStatePagerAdapter only the visible page and the
pages adjacent to that page are kept in the memory. This will
improve the performance too.
Use ViewPager.setOffscreenPageLimit(int limit)

Unable to start activity component info (nullpointer)

im trying to make a basic ui in android with tabs. however i keep getting a nullpointer exception whenever i try to run it. the error originates from initializing viewpager. (i dont know what else to type and i keep receiving an error whenever i try to post.)
public class MainActivity extends FragmentActivity implements TabListener {
ActionBar actionBar;
ViewPager viewPager;
#Override
protected void onCreate(Bundle arg0) {
super.onCreate(arg0);
setContentView(R.layout.activity_main);
viewPager=(ViewPager) viewPager.findViewById(R.id.tabs);
viewPager.setAdapter(new adapter(getSupportFragmentManager()));
actionBar = getActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
ActionBar.Tab stocks = actionBar.newTab();
stocks.setText("Stocks");
stocks.setTabListener(this);
ActionBar.Tab market = actionBar.newTab();
market.setText("Market");
market.setTabListener(this);
ActionBar.Tab portfolio = actionBar.newTab();
portfolio.setText("Portfolio");
portfolio.setTabListener(this);
actionBar.addTab(stocks);
actionBar.addTab(market);
actionBar.addTab(portfolio);
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
// Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.menu.mainsearch, menu);
return true;
}
#Override
public void onTabReselected(Tab arg0, FragmentTransaction arg1) {
// TODO Auto-generated method stub
}
#Override
public void onTabSelected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
}
#Override
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
}
class adapter extends FragmentPagerAdapter {
public adapter(FragmentManager fm) {
super(fm);
// TODO Auto-generated constructor stub
}
public Fragment getItem(int arg0) {
Fragment fragment = null;
if(arg0==0) {
fragment = new StocksFragment();
}
if (arg0==1){
fragment = new MarketFragment();
}
if (arg0==2){
fragment = new PortfolioFragment();
}
return fragment;
}
#Override
public int getCount() {
// TODO Auto-generated method stub
return 3;
}
}
}
Of course this line will give a NPE
viewPager=(ViewPager) viewPager.findViewById(R.id.tabs);
you are calling a method on an object that you are trying to initialize (calling findViewById() on null viewPager)
If tabs is in activity_main.xml then just remove viewPager
viewPager=(ViewPager) findViewById(R.id.tabs);
findViewById is a method of the activity, not of the view. So it should be:
viewPager=(ViewPager) this.findViewById(R.id.tabs);

Categories

Resources