Develop Reference

Tabs with Icons using ViewPager, How to layout them? by Attaching Some Layout File

I am new to Android, Designing an Android Application that contains "Tabs".
I have designed this:
But I want to design like this,
I think there must be way, as like of populating lists using Custom Adapters, But I am not finding any thing to do this, the tutorials that are available on Android Web are out of scope of my mind, because I am new..
My code:
Tabs.xml
Tabs.java
package com.example.medbleep;
import TabsManager.TabPagerAdapter;
import android.app.ActionBar;
import android.app.ActionBar.Tab;
import android.app.FragmentTransaction;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import android.widget.ImageView;
import android.widget.TextView;
public class Tabs extends FragmentActivity implements ActionBar.TabListener {
private ViewPager viewPager;
private TabPagerAdapter mAdapter;
private android.app.ActionBar actionBar;
private int numberOfTabs = 5;
// Tab titles
private int[] tabIcons = {R.drawable.home,R.drawable.home,R.drawable.home,R.drawable.home,R.drawable.home,R.drawable.home};
private String[] tabText = { "Home", "units", "conferences", "couses", "more" };
ImageView imageView;
TextView textView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.tabs);
imageView = (ImageView)findViewById(R.id.tab_icon);
textView = (TextView)findViewById(R.id.tab_title);
// Initialization
viewPager = (ViewPager) findViewById(R.id.pager);
viewPager.setBackgroundColor(getResources().getColor(R.color.darkLoginBlue));
actionBar = getActionBar();
mAdapter = new TabPagerAdapter(getSupportFragmentManager(),
numberOfTabs);
viewPager.setAdapter(mAdapter);
actionBar.setHomeButtonEnabled(false);
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
// Adding Tabs
for (int i = 0; i<5 ; i++) {
actionBar.addTab(actionBar.newTab().setText(tabText[i])
.setIcon(getResources().getDrawable(tabIcons[i]))
.setTabListener(this));
//actionBar.addTab(actionBar.newTab().setCustomView(R.layout.tab_layout).setText(tabText[i]).setIcon(tabIcons[i]).setTabListener(this));
//actionBar.setLogo(tabIcons[4]);
//actionBar.setIcon(tabIcons[i]);
//actionBar.setTitle(tabText[i]);
}
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 arg0, FragmentTransaction arg1) {
// TODO Auto-generated method stub
}
#Override
public void onTabSelected(Tab tab, FragmentTransaction arg1) {
// TODO Auto-generated method stub
// on tab selected
// show respected fragment view
viewPager.setCurrentItem(tab.getPosition());
}
#Override
public void onTabUnselected(Tab arg0, FragmentTransaction arg1) {
// TODO Auto-generated method stub
}
}
TabPagerAdapter.java
package TabsManager;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentStatePagerAdapter;
public class TabPagerAdapter extends FragmentStatePagerAdapter{
int mNumOfTabs;
public TabPagerAdapter(FragmentManager fm, int NumOfTabs) {
super(fm);
this.mNumOfTabs = NumOfTabs;
}
#Override
public Fragment getItem(int position) {
switch (position) {
case 0:
HomeTabFragment homeTabFragment = new HomeTabFragment();
return homeTabFragment;
case 1:
UnitTabFragment unitTabFragment = new UnitTabFragment();
return unitTabFragment;
case 2:
ConferencesTabFragment conferencesTabFragment = new ConferencesTabFragment();
return conferencesTabFragment;
case 3:
CoursesTabFragment coursesTabFragment = new CoursesTabFragment();
return coursesTabFragment;
case 4:
MoreTabFragment moreTabFragment = new MoreTabFragment();
return moreTabFragment;
default:
return null;
}
}
#Override
public int getCount() {
return mNumOfTabs;
}
}

For making this, your have to create Custom Adaptor and set width and height According to your requirement of each tab.
Please Follow this:
http://mobikul.com/make-custom-tabs-icons-android/

how to give equal width to all tabs?

hello
could you please tell me why on landscape it is not acquiring equal width as in portrait mode ?? is there any way to provide equal width into tabs in portrait mode.
I do like this
landscape
potrait
here is my code ..in portrait it is taking equal width but on landscape it is not taking the equal width why ?
here is my code
import android.app.ActionBar;
import android.app.FragmentTransaction;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
public class MainActivity extends FragmentActivity implements ActionBar.TabListener {
ActionBar actionBar;
ViewPager viewPager;
PageAdapter pageAdapter;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
viewPager = (ViewPager) findViewById(R.id.pager);
pageAdapter =new PageAdapter(getSupportFragmentManager());
viewPager.setAdapter(pageAdapter);
actionBar = getActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
actionBar.addTab(actionBar.newTab().setText("Tab1").setTabListener(this));
actionBar.addTab(actionBar.newTab().setText("Tab2").setTabListener(this));
actionBar.addTab(actionBar.newTab().setText("Tab3").setTabListener(this));
viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
#Override
public void onPageScrolled(int i, float v, int i1) {
}
#Override
public void onPageSelected(int i) {
actionBar.setSelectedNavigationItem(i);
}
#Override
public void onPageScrollStateChanged(int i) {
}
});
}
#Override
public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) {
viewPager.setCurrentItem(tab.getPosition());
}
#Override
public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction ft) {
}
#Override
public void onTabReselected(ActionBar.Tab tab, FragmentTransaction ft) {
}
}
Adapter
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
public class PageAdapter extends FragmentPagerAdapter{
public PageAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int i) {
switch (i){
case 0:
return new Fragmentone();
case 1:
return new Fragmenttwo();
case 2:
return new FragmentThree();
default:
break;
}
return null;
}
#Override
public int getCount() {
return 3;
}
}

Fragment creates an Activity object but it is null

In my fragment class, I create an object of my Activity class:
MainActivity mainActivity;
and in my fragment's OnCreateView(), I initialize it:
mainActivity = new MainActivity();
However, when I debug my app, mainActivity is always null. Why is this?
My Activity class:
package com.example.brettrosen.atls;
import android.annotation.TargetApi;
import android.app.ActionBar;
import android.app.FragmentTransaction;
import android.os.Build;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
#TargetApi(Build.VERSION_CODES.HONEYCOMB)
public class MainActivity extends FragmentActivity implements ActionBar.TabListener {
private ViewPager viewPager;
private TabsPagerAdapter mAdapter;
public ActionBar actionBar;
// Tab titles
private String[] tabs = {"Pre-arrival Plan", "Primary Survey", "Secondary Survey"};
#TargetApi(Build.VERSION_CODES.ICE_CREAM_SANDWICH)
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Initialization
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) {
}
});
updateTabTitles(0, 12);
updateTabTitles(1, 2);
updateTabTitles(2, 14);
}
public void updateTabTitles(int pageNum, int remaining) {
String text = tabs[pageNum] + " (" + remaining + ")";
System.out.println(actionBar);
actionBar.getTabAt(pageNum).setText(text);
}
#Override
public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) {
viewPager.setCurrentItem(tab.getPosition());
}
#Override
public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction ft) {
}
#Override
public void onTabReselected(ActionBar.Tab tab, FragmentTransaction ft) {
}
};

I see your problem is that you want to access MainActivity from within a fragment that it hosts.
To do that, you could just call this:
getActivity();
And it will return your MainAcitvity (or any other Activity that is currently hosting your Fragment).
To access a method from it, you'd have to cast the return of that method.
MainActivity yourMain = (MainActivity) getActivity();
yourMain.method1();
Remember to do this inside of your fragment.

switching android map fragment -- crashed

In my application I have two tab (map and nearby). Both fragments are using map fragment.
Here is my map.xml
<RelativeLayout
android:id="#+id/countryLayout"
android:layout_below="#id/partnersLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/mainFooterLayout">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<fragment
android:id="#+id/map"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:name="com.google.android.gms.maps.MapFragment"/>
</FrameLayout>
</RelativeLayout>
Here is my inflated code
View view = inflater.inflate(R.layout.map, container, false);
and in NearbyFragment and MyMapFragment I called
public void onDestroyView() {
super.onDestroyView();
Fragment fragment = (getFragmentManager().findFragmentById(R.id.map));
FragmentTransaction ft = mActivity.getFragmentManager().beginTransaction();
ft.remove(fragment);
ft.commit();
}
but still my application crashed
I have this exception
Caused by: java.lang.IllegalArgumentException: Binary XML file line #42: Duplicate id 0x7f0600b5, tag null, or parent id 0xffffffff with another fragment for com.google.android.gms.maps.MapFragment
Could anyone tell me what is wrong here?
Is it possible that I use MapFragment instead of SupportMapFragment?
Thank you

See what you should do:
1) Define activity layout:
<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"/>
2) Create adapter for your tabulated pager:
import java.util.ArrayList;
import java.util.List;
import java.util.Locale;
import android.app.Fragment;
import android.app.FragmentManager;
import android.content.Context;
import android.support.v13.app.FragmentPagerAdapter;
public class SectionsPagerAdapter extends FragmentPagerAdapter {
List<Fragment> mValues = new ArrayList<Fragment>();
public SectionsPagerAdapter(FragmentManager fm) {
super(fm);
// HERE YOU ADD INSTANCES OF FRAGMENTS WHAT YOU NEED
mValues.add(new com.google.android.gms.maps.MapFragment());
mValues.add(new com.google.android.gms.maps.MapFragment());
}
#Override
public Fragment getItem(int position) {
return PlaceholderFragment.newInstance(position + 1);
}
#Override
public int getCount() {
return 2;
}
#Override
public CharSequence getPageTitle(int position) {
switch (position) {
case 0:
return "Map";
case 1:
return "Nearby";
}
return null;
}
}
3) Create main activity with tabs
import android.app.ActionBar;
import android.app.Activity;
import android.app.FragmentTransaction;
import android.os.Bundle;
import android.support.v4.view.ViewPager;
public class MainActivity extends Activity implements ActionBar.TabListener {
SectionsPagerAdapter mSectionsPagerAdapter;
ViewPager mViewPager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final ActionBar actionBar = getActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
mSectionsPagerAdapter = new SectionsPagerAdapter(getFragmentManager());
mViewPager = (ViewPager) findViewById(R.id.pager);
mViewPager.setAdapter(mSectionsPagerAdapter);
mViewPager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
#Override
public void onPageSelected(int position) {
actionBar.setSelectedNavigationItem(position);
}
});
for (int i = 0; i < mSectionsPagerAdapter.getCount(); i++) {
actionBar.addTab(actionBar.newTab().setText(mSectionsPagerAdapter.getPageTitle(i)).setTabListener(this));
}
}
#Override
public void onTabSelected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction) {
mViewPager.setCurrentItem(tab.getPosition());
}
#Override
public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction) {
}
#Override
public void onTabReselected(ActionBar.Tab tab, FragmentTransaction fragmentTransaction) {
}
}
Inside Adapter you have to create instances of fragmnets what you need to place in your activity like a tabs
P.S. sorry for my english and typo

Add a dynamic listview to a fragment

In my app I need the possibility to create a dynamic listview populated by elements extracted from the db.
This in itself wouldn't be a big problem (there are a lot of tutorials about it, like this one), problem is, my activity is divided in tabs and, therefore, I have a Fragment for each tab (the code it's basically this).
There are lots of methods that I can't use in a Fragmentand I'm honestly pretty stuck.
How can I implement a dynamic layout solution inside a fragment?
Edit: code for clarity:
Fragment:
package it.sii.mywaiter;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
public class AllerFragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.aller_layout, container, false);
return rootView;
}
}
Activity:
package it.sii.mywaiter;
import android.app.ActionBar.Tab;
import android.app.FragmentTransaction;
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
//import android.widget.*;
import android.app.ActionBar;
public class UserPrefActivity extends FragmentActivity implements ActionBar.TabListener {
private ViewPager viewPager;
private PrefPagerAdapter mAdapter;
private ActionBar actionBar;
// Tab titles
private String[] tabs = { "Ingredienti preferiti", "Allergie e Intolleranze" };
int tabsnum = tabs.length;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.user_pref_layout);
// Initilization
viewPager = (ViewPager) findViewById(R.id.pager);
actionBar = getActionBar();
mAdapter = new PrefPagerAdapter(getSupportFragmentManager());
mAdapter.setCount(tabsnum);
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) {
}
}
Adapter
package it.sii.mywaiter;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
public class PrefPagerAdapter extends FragmentPagerAdapter {
private int count = 0;
public PrefPagerAdapter(FragmentManager fm) {
super(fm);
}
public void setCount(int count){
this.count = count;
}
#Override
public Fragment getItem(int index) {
switch (index) {
case 0:
return new PrefFragment();
case 1:
return new AllerFragment();
}
return null;
}
#Override
public int getCount() {
return count;
}
}
Fragment's layout:
<?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"
android:orientation="vertical"
android:background="#fa6a6a" >
<TextView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="test test"
android:textSize="20sp"
android:layout_centerInParent="true"/>
</RelativeLayout>

As you said, you have Fragments. Every Fragment has its own class so you can create a CustomArrayAdapter and the use it in the Fragments onCreate Method. Inside the Fragment get your ListView, which you defined in the xml File for this Fragment, with findViewByID and then set its Adapter with setAdapter(new YourCustomAdapterClass()); then you have your custom dynamic ListView in a Fragment.