I searched a lot in the web about the possibility to have multiple fragments in one action bar tab.
This question comes closest to my needs but the code is not working.
Is there another possibility to include multiple fragments in one tab?
This is the StartActivity
public class StartActivity extends FragmentActivity implements ActionBar.TabListener {
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_start);
// Set up the action bar.
final ActionBar actionBar = getActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
actionBar.addTab(
actionBar.newTab()
.setText("Karte")
.setTabListener(new MapFragmentListener(this)));
}
The corresponding layout acticity_start contains two frame layouts for the two fragments that will be placed in the tab.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<FrameLayout
android:id="#+id/fragment_map"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<FrameLayout
android:id="#+id/fragment_realtime"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
The TabListener looks like this:
private class TabListener implements ActionBar.TabListener {
private static final String fragment1_tag = "fragment1_tag";
private static final String fragment2_tag = "fragment2_tag";
private FragmentActivity activity;
private RealtimeFragment fragment1;
private RealtimeFragment fragment2;
public TabListener(FragmentActivity activity) {
this.activity = activity;
android.support.v4.app.FragmentTransaction ft = activity.getSupportFragmentManager().beginTransaction();
fragment1 = (RealtimeFragment) activity.getSupportFragmentManager().findFragmentByTag(fragment1_tag);
if (fragment1 != null && !fragment1.isDetached()) {
ft.detach(fragment1);
}
fragment2 = (RealtimeFragment) activity.getSupportFragmentManager().findFragmentByTag(fragment2_tag);
if (fragment2 != null && !fragment2.isDetached()) {
ft.detach(fragment2);
}
ft.commit();
}
#Override
public void onTabReselected(Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
}
#Override
public void onTabSelected(Tab tab, FragmentTransaction ft) {
android.support.v4.app.FragmentTransaction fragmentTransaction = activity.getSupportFragmentManager().beginTransaction();
if(fragment1 == null) {
fragment1 = new RealtimeFragment();
fragmentTransaction.add(R.id.fragment_map, fragment1, fragment1_tag);
} else {
fragmentTransaction.attach(fragment1);
}
if(fragment2 == null) {
fragment2 = new RealtimeFragment();
fragmentTransaction.add(R.id.fragment_realtime, fragment2, fragment2_tag);
} else {
fragmentTransaction.attach(fragment2);
}
fragmentTransaction.commit();
}
#Override
public void onTabUnselected(Tab tab, FragmentTransaction ft) {
android.support.v4.app.FragmentTransaction fragementTransaction = activity.getSupportFragmentManager().beginTransaction();
if(fragment1_tag != null)
fragementTransaction.detach(fragment1);
if(fragment2 != null)
fragementTransaction.detach(fragment2);
fragementTransaction.commit();
}
}
The class RealtimeFragment and the corresponding layout fragment_realtime looks like this:
public class RealtimeFragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_realtime, container, false);
return view;
}
}
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button" />
</LinearLayout>
In one tab now two fragments of the class RealtimeFragment should be displayed. The fragments just show one button but NOTHING is displayed! Why?
I was looking for a solution to the same Topic, and found this, which comes in quite handy.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent">
<fragment android:name="com.example.news.ArticleListFragment"
android:id="#+id/list"
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="match_parent" />
<fragment android:name="com.example.news.ArticleReaderFragment"
android:id="#+id/viewer"
android:layout_weight="2"
android:layout_width="0dp"
android:layout_height="match_parent" />
</LinearLayout>
so Reference your Fragments and inflate it, just like a normal Fragment
Related
i'm trying to get this pageviewer with fragments to work however i'm stumbled on a problem where the view stays on screen on swipe. Ideally, i'd want it to only be on a particular layout yet i'm not too sure why it "carries over" to other screens (it also stays on screen during the transition between fragments).
Any feedback will be appreciated!
Link to Imgur Screenshots
Main:
private void initUI()
{
// ---------Page Viewer with Fragments -----------
viewPager = (ViewPager) findViewById(R.id.pager);
actionBar = getSupportActionBar();
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) {
// 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 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:
public class TabsPagerAdapter extends FragmentPagerAdapter {
public TabsPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int index) {
switch (index) {
case 0:
// Main Frag
return new Fragment1();
case 1:
// Second Frag
return new Fragment2();
case 2:
// Third Frag
return new Fragment3();
}
return null;
}
#Override
public int getCount() {
return 3;
}
}
Fragment classes are basically this:
public class Fragment1 extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.main, container, false);
return rootView;
}
}
Main Layout:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent">
</android.support.v4.view.ViewPager>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</RelativeLayout>
The EditText is in the main layout, the same layout that the ViewPager is in. It should be inflated within the tab. You'll need to create a separate layout for each tab.
Main layout
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<android.support.v4.view.ViewPager
android:id="#+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</RelativeLayout>
layout_fragment_1.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</RelativeLayout>
Then you need to inflate the new layout in fragment 1.
View rootView = inflater.inflate(R.layout.layout_fragment_1, container, false);
return rootView;
There are some questions related to this same issue. For example, this one. But it doesn't work.
Let me show what I did in my code.
activity_main.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:id="#+id/container"
android:layout_width="match_parent" android:layout_height="match_parent"
tools:context=".MainActivity" tools:ignore="MergeRootFrame" >
<fragment
android:id="#+id/my_fragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:name="com.example.zhouhao.test.MyFragment"
tools:layout="#layout/fragment_my" />
</FrameLayout>
fragment_my.xml (my main fragment which include a FragmentTabHost)
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.app.FragmentTabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="100"
android:orientation="horizontal">
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0" />
<LinearLayout
android:layout_width="0dp"
android:layout_weight="95"
android:layout_height="match_parent"
android:orientation="vertical">
<FrameLayout
android:id="#+id/panel_content"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
</LinearLayout>
</android.support.v4.app.FragmentTabHost>
fragment_tab1.xml (for the fragment corresponding to different tab, they are similar so that I only show you one code)
<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.example.zhouhao.test.TabFragment">
<!-- TODO: Update blank fragment layout -->
<TextView android:layout_width="match_parent" android:layout_height="match_parent"
android:text="#string/fragment_tab1" />
</FrameLayout>
MainActivity.java
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
if (savedInstanceState == null) {
FragmentManager fm = getSupportFragmentManager();
mMyFragment = (MyFragment) fm.findFragmentById(R.id.my_fragment);
}
}
public class MyFragment extends Fragment implements TabHost.OnTabChangeListener {
FragmentTabHost mFragmentTabHost;
public MyFragment() {
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_my, container, false);
if (rootView != null) {
mFragmentTabHost = (FragmentTabHost) rootView.findViewById(android.R.id.tabhost);
mFragmentTabHost.setup(getActivity(), getActivity().getSupportFragmentManager(), R.id.panel_content);
TabFragment1 tab1Fragment = new TabFragment1();
TabFragment2 tab2Fragment = new TabFragment2();
TabFragment3 tab3Fragment = new TabFragment3();
TabHost.TabSpec spec1 = mFragmentTabHost.newTabSpec("1").setIndicator("");
TabHost.TabSpec spec2 = mFragmentTabHost.newTabSpec("2").setIndicator("");
TabHost.TabSpec spec3 = mFragmentTabHost.newTabSpec("3").setIndicator("");
mFragmentTabHost.addTab(spec1,tab1Fragment.getClass(), null);
mFragmentTabHost.addTab(spec2,tab2Fragment.getClass(), null);
mFragmentTabHost.addTab(spec3,tab3Fragment.getClass(), null);
mFragmentTabHost.setOnTabChangedListener(this);
return rootView;
} else {
return super.onCreateView(inflater, container, savedInstanceState);
}
}
#Override
public void onTabChanged(String tabId) {
BaseFragment f = (BaseFragment)getActivity().getSupportFragmentManager().findFragmentByTag(tabId);
Log.d("Log",tabId);
}
}
My problem is the BaseFragment is always null in my onTabChanged. Can anybody help? Thanks.
You cannot get the selected fragment immediately if the fragment has never been instantiated.
#Override
public void onTabChanged(final String tabId) {
Fragment fg = getSupportFragmentManager().findFragmentByTag(tabId);
Log.d(TAG, "onTabChanged(): " + tabId + ", fragment " + fg);
if (fg == null) {
new Handler().postDelayed(new Runnable() {
#Override
public void run() {
Fragment fg = getSupportFragmentManager().findFragmentByTag(tabId);
Log.d(TAG, "onTabChanged() delay 50ms: " + tabId + ", fragment " + fg);
}
}, 50);
}
}
the output:
// cannot get the selected fragment immediately if the fragment has never been instantiated.
onTabChanged(): 1, fragment null
onTabChanged() delay 50ms: 1, fragment HistoryFragment{6f7a9d5 #2 id=0x7f09006e 1}
onTabChanged(): 2, fragment null
onTabChanged() delay 50ms: 2, fragment HistoryFragment{10c59e72 #3 id=0x7f09006e 2}
// can get the selected fragment immediately if the fragment already instantiated.
onTabChanged(): 1, fragment HistoryFragment{6f7a9d5 #2 id=0x7f09006e 1}
onTabChanged(): 2, fragment HistoryFragment{10c59e72 #3 id=0x7f09006e 2}
I think I get the right way to solve this problem, below is my answer.
Create a TabBean
private int imgId;
private int textId;
private Class fragment;
public MainTabBean(int textId, int imgId, Class fragment) {
this.textId = textId;
this.imgId = imgId;
this.fragment = fragment;
}
public int getTextId() {
return textId;
}
public void setTextId(int textId) {
this.textId = textId;
}
public int getImgId() {
return imgId;
}
public void setImgId(int imgId) {
this.imgId = imgId;
}
public Class getFragment() {
return fragment;
}
public void setFragment(Class fragment) {
this.fragment = fragment;
}
Then, get three TabBean instances with three fragments
List<MainTabBean> tabs = new ArrayList<>();
// three TabBean instances
TabBean homeTab = new MainTabBean(R.string.home, R.drawable.tab_home, HomepageFragment.class);
TabBean postcardTab = new MainTabBean(R.string.postcard, R.drawable.tab_postcard, PostcardFragment.class);
Bean notificationTab = new MainTabBean(R.string.notification, R.drawable.tab_notification, NotificationFragment.class);
// put tabs into a list
tabs.add(homeTab);
tabs.add(postcardTab);
tabs.add(notificationTab);
Third, just associate the TabBeans with FragmentTabHost as usual
// Obtain FragmentTabHost
tabHost = findViewById(android.R.id.tabhost);
// Associate fragmentManager with container
tabHost.setup(this, getSupportFragmentManager(), R.id.main_content);
// Create TabSpecs with TabBean and add it on TabHost
for(MainTabBean tab : tabs) {
TabHost.TabSpec spec = tabHost.newTabSpec(String.valueOf(tab.getTextId()))// set a tag
.setIndicator(getTabIndicator(tab));// set an indicator
tabHost.addTab(spec, tab.getFragment(), null);// add a tab
}
Forth, that's the most important step, I didn't get fragment instance with findFragmentByTag() like this
getSupportFragmentManager()
.findFragmentByTag(String.valueOf(tabs.get(1).getTextId()));
Instead, my answer is exactly like this:
tabs.get(0).getFragment().newInstance();
and cast it.
And I finally got the fragment.
I am making an android application where I need to create two Tabs that is simple I did but I need to add the OverFlow menu also in same row. See screenshot.
I never implement this in Android that might seems more tricky to me.
Please help me if you know how to achieve this in Android.
I simply achieved the Tabs using below code.
public class PayStubActivity extends ActionBarActivity implements ActionBar.TabListener {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_CUSTOM_TITLE); // requesting to set the custom title bar
setContentView(R.layout.activity_pay_stub);
getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.custom_title);
// adding action bar tabs to the activity
ActionBar mActionBar = getSupportActionBar();
Tab firstTab = mActionBar.newTab().setText(getString(R.string.paystub_current_tab)).setTabListener(this);
Tab secondTab = mActionBar.newTab().setText(getString(R.string.paystub_all_tab)).setTabListener(this);
// add the tabs to the action bar
mActionBar.addTab(firstTab);
mActionBar.addTab(secondTab);
// set the navigation mode the Action Bar Tabs
mActionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
}
#Override
public void onTabReselected(Tab tab, FragmentTransaction fragmentTransaction) {
}
#Override
public void onTabSelected(Tab tab, FragmentTransaction fragmentTransaction) {
// user is selected first tab
if(tab.getPosition() == 0) {
fragmentTransaction.replace(R.id.container, new CurrentPayStubFragment());
} else {
// user is selected second tab.
}
}
#Override
public void onTabUnselected(Tab tab, FragmentTransaction fragmentTransaction) {}
}
Thanks in advance.
You will need a custom Layout for your Action bar:
layout_action_bar:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
android:showDividers="middle"
android:divider="#drawable/action_bar_divider"
android:dividerPadding="10dp"
android:weightSum="7">
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:layout_gravity="center_vertical"
android:orientation="vertical"
android:clickable="true"
android:onClick="imagesViewClick">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="IMAGES"
android:textColor="#android:color/white"
android:gravity="center"
android:layout_centerInParent="true"/>
<View
android:id="#+id/images_selected_view"
android:layout_width="match_parent"
android:layout_height="6dp"
android:layout_alignParentBottom="true"
android:background="#427fed"/>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="3"
android:layout_gravity="center_vertical"
android:orientation="vertical"
android:clickable="true"
android:onClick="videosViewClick">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="VIDEOS"
android:textColor="#android:color/white"
android:gravity="center"
android:layout_centerInParent="true"/>
<View
android:id="#+id/videos_selected_view"
android:layout_width="match_parent"
android:layout_height="6dp"
android:layout_alignParentBottom="true"
android:background="#427fed"
android:visibility="gone"/>
</RelativeLayout>
<ImageView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:src="#drawable/ic_action_overflow"
android:layout_gravity="center_vertical"
android:layout_weight="1"/>
</LinearLayout>
And then your Activity Implementation:
public class MainActivity extends ActionBarActivity{
private View imagesViewSelected;
private View videosViewSelected;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setupActionBar();
setContentView(R.layout.activity_main);
if (savedInstanceState == null) {
getSupportFragmentManager().beginTransaction()
.add(R.id.container, new ImagesFragment())
.commit();
}
}
private void setupActionBar() {
ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setDisplayUseLogoEnabled(false);
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setDisplayShowHomeEnabled(false);
ActionBar.LayoutParams lp1 = new ActionBar.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT);
View customNav = LayoutInflater.from(this).inflate(R.layout.layout_action_bar, null);
imagesViewSelected = customNav.findViewById(R.id.images_selected_view);
videosViewSelected = customNav.findViewById(R.id.videos_selected_view);
actionBar.setCustomView(customNav, lp1);
}
public static class ImagesFragment extends Fragment {
public ImagesFragment() {
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_main, container, false);
((TextView)rootView.findViewById(R.id.txt_fragment_locator)).setText("Images Fragment");
return rootView;
}
}
public static class VideosFragment extends Fragment {
public VideosFragment() {
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_main, container, false);
((TextView)rootView.findViewById(R.id.txt_fragment_locator)).setText("Videos Fragment");
return rootView;
}
}
public void imagesViewClick(View view){
getSupportFragmentManager().beginTransaction()
.replace(R.id.container, new ImagesFragment())
.commit();
imagesViewSelected.setVisibility(View.VISIBLE);
videosViewSelected.setVisibility(View.GONE);
}
public void videosViewClick(View view){
getSupportFragmentManager().beginTransaction()
.replace(R.id.container, new VideosFragment())
.commit();
imagesViewSelected.setVisibility(View.GONE);
videosViewSelected.setVisibility(View.VISIBLE);
}
}
Gabriele Mariotti's Cardslib has a good implementation thereof in the CardView class.
The CardView consists of a CardHeader which provides an overflow button with a PopupMenuListener, a button to expand/collapse an area, or a customizable button with its listener.
The CardHeader will greatly assist you in this regard. CardHeader source code
HTH
I would like to make it possible to swipe between the tabs in my app.
I have already found plenty tutorials to do this, but I can't get it to work with my code, because I use different code.
MyActivity.class:
public class MyActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
final ActionBar actionBar = getActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
ActionBar.Tab tabA = actionBar.newTab();
tabA.setIcon(R.drawable.icon_settings);
actionBar.setDisplayShowHomeEnabled(false);
actionBar.setDisplayShowTitleEnabled(false);
tabA.setText("");
tabA.setTabListener(new com.example.MainActivity.TabListener<Tab1>(this, "Tab1", Tab1.class));
actionBar.addTab(tabA);
Tab tabB = actionBar.newTab();
tabB.setText("Tab2");
tabB.setTabListener(new com.example.MainActivity.TabListener<Tab2>(this, "Tab2", Tab2.class));
actionBar.addTab(tabB);
Tab tabC = actionBar.newTab();
tabC.setText("Tab3");
tabC.setTabListener(new com.example.MainActivity.TabListener<Tab3>(this, "Tab3", Tab3.class));
actionBar.addTab(tabC);
if (savedInstanceState != null) {
int savedIndex = savedInstanceState.getInt("SAVED_INDEX");
getActionBar().setSelectedNavigationItem(savedIndex);
}
}
Main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TabHost
android:id="#+id/tabHost"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:paddingTop="5dip">
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
</TabWidget>
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:id="#+id/einstellungen"
android:layout_width="fill_parent"
android:layout_height="wrap_content" android:orientation="vertical" android:background="#ffffff">
</LinearLayout>
<LinearLayout
android:id="#+id/tab1"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</LinearLayout>
<LinearLayout
android:id="#+id/tab2"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</LinearLayout>
<LinearLayout
android:id="#+id/tab3"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</LinearLayout>
</FrameLayout>
</LinearLayout>
</TabHost>
Tab1.class
public class Tab1 extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View myFragmentView = inflater.inflate(R.layout.fragment_a, container, false);
return myFragmentView;
}
}
TabListener.class
public class TabListener <T extends Fragment> implements ActionBar.TabListener{
private final Activity myActivity;
private final String myTag;
private final Class myClass;
public TabListener(Activity activity, String tag, Class<T> cls) {
myActivity = activity;
myTag = tag;
myClass = cls;
}
#Override
public void onTabSelected(ActionBar.Tab tab, FragmentTransaction ft) {
Fragment myFragment = myActivity.getFragmentManager().findFragmentByTag(myTag);
if (myFragment == null) {
myFragment = Fragment.instantiate(myActivity, myClass.getName());
ft.add(android.R.id.content, myFragment, myTag);
} else {
ft.attach(myFragment);
}
}
#Override
public void onTabUnselected(ActionBar.Tab tab, FragmentTransaction ft) {
Fragment myFragment = myActivity.getFragmentManager().findFragmentByTag(myTag);
if (myFragment != null) {
ft.detach(myFragment);
}
}
#Override
public void onTabReselected(ActionBar.Tab tab, FragmentTransaction ft) {
// TODO Auto-generated method stub
}
}
You can do it easier using the default ActionBar Tabs + Swipe Views of your Eclipse, Android Sudio or IntelliJ IDEA. Anyway you can take a look at my answer here Android ActionBar Tabs - Swipe or here Creating Swipe Views with Tabs you can find a very nice tutorial by Android Developers.
Hope I helped you
I am currently having an issue with replacing a certain fragment within ViewPager with another. The fragment id like to replace is my "Departments" which has an Imagebutton id like to use to begin the replacement. I've tried to apply some suggestions from other similar questions (most of which were old and prior to the new api release which allows for nested fragments) and have had no success. Would using nested fragments be easier? I am new to android app development so any help would be great. Thanks in advance.
here is my FragmentAcitivty
public class ViewPagerStyle extends FragmentActivity {
private ViewPager mViewPager;
private ViewPagerAdapter adapter;
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
setUpView();
setTab();
}
private void setUpView(){
mViewPager = (ViewPager) findViewById(R.id.viewPager);
adapter = new ViewPagerAdapter(getApplicationContext(),getSupportFragmentManager());
mViewPager.setAdapter(adapter);
mViewPager.setCurrentItem(0);
}
private void setTab(){
mViewPager.setOnPageChangeListener(new OnPageChangeListener(){
#Override
public void onPageScrollStateChanged(int position) {}
#Override
public void onPageScrolled(int arg0, float arg1, int arg2) {}
#Override
public void onPageSelected(int position) {
// TODO Auto-generated method stub
switch(position){
case 0:
findViewById(R.id.first_tab).setVisibility(View.VISIBLE);
findViewById(R.id.second_tab).setVisibility(View.INVISIBLE);
findViewById(R.id.third_tab).setVisibility(View.INVISIBLE);
break;
case 1:
findViewById(R.id.first_tab).setVisibility(View.INVISIBLE);
findViewById(R.id.second_tab).setVisibility(View.VISIBLE);
findViewById(R.id.third_tab).setVisibility(View.INVISIBLE);
break;
case 2:
findViewById(R.id.first_tab).setVisibility(View.INVISIBLE);
findViewById(R.id.second_tab).setVisibility(View.INVISIBLE);
findViewById(R.id.third_tab).setVisibility(View.VISIBLE);
break;
}
}
});
}
}
FragmentPagerAdapter
public class ViewPagerAdapter extends FragmentPagerAdapter {
private Context _context;
public ViewPagerAdapter(Context context, FragmentManager fm) {
super(fm);
_context = context;
}
#Override
public Fragment getItem(int position) {
Fragment f = new Fragment();
switch(position){
case 0:
f=PubView.newInstance(_context);
break;
case 1:
f=MyView.newInstance(_context);
break;
case 2:
f=Departments.newInstance(_context);
break;
}
return f;
}
#Override
public int getCount() {
return 3;
}
}
Departments Fragment with button
public class Departments extends Fragment {
public static Fragment newInstance(Context context) {
Departments f = new Departments();
return f;
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {
View root = (View) inflater.inflate(R.layout.activity_departments, null);
ImageButton engineeringButton = (ImageButton)root.findViewById(R.id.engineeringButton);
engineeringButton.setOnClickListener(new View.OnClickListener(){
#Override
public void onClick(View v){
Fragment newFragment = Engineering.newInstance(null);
FragmentTransaction transaction = getChildFragmentManager().beginTransaction();
transaction.addToBackStack(null);
transaction.replace(R.id.viewPager, newFragment).commit();
}
});
return root;
}
}
Also, here is my main.xml file which hosts the viewpager
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/purple"
android:orientation="vertical" >
<TableLayout
style="#style/layout_f_w"
android:stretchColumns="*" >
<TableRow
android:id="#+id/tableRow1"
style="#style/layout_wrap"
android:background="#color/white" >
<!-- First Tab -->
<LinearLayout
android:id="#+id/first_text"
style="#style/layout_f_w"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
style="#style/text_title"
android:text="pubView"
android:textColor="#color/purple" />
</LinearLayout>
<!-- Second Tab -->
<LinearLayout
android:id="#+id/second_text"
style="#style/layout_f_w"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
style="#style/text_title"
android:gravity="center"
android:text="myView"
android:textColor="#color/purple" />
</LinearLayout>
<!-- Third Tab -->
<LinearLayout
android:id="#+id/third_text"
style="#style/layout_f_w"
android:orientation="vertical" >
<TextView
android:id="#+id/textView1"
style="#style/text_title"
android:text="Dept."
android:textColor="#color/purple" />
</LinearLayout>
</TableRow>
</TableLayout>
<!-- Include Tab Indicator -->
<include
android:layout_width="fill_parent"
android:layout_height="wrap_content"
layout="#layout/indicator" />
<android.support.v4.view.ViewPager
android:id="#+id/viewPager"
android:layout_width="fill_parent"
android:layout_height="450dp" />
<ImageButton
android:id="#+id/settingsButton"
android:layout_width="wrap_content"
android:layout_height="30dp"
android:layout_marginLeft="50dp"
android:background="#drawable/settings_button"
android:src="#drawable/settings_button" />
</LinearLayout>
One thing i am confused on is that I don't know which id to put into the first argument of transaction.replace(r.id.viewPager, newfragment)...Ive read that it needs the id of the container but when I use this I receive the runtime error from logcat:
04-13 21:41:48.680: E/AndroidRuntime(960): java.lang.IllegalArgumentException: No view found for id 0x7f0a0029 (com.pvcalendar:id/viewPager) for fragment Engineering{4089a730 #0 id=0x7f0a0029}
I think the point is to use a fragment as a container.
In your ViewPagerAdapter:
#Override
public Fragment getItem(int position) {
/*
* IMPORTANT: This is the point. We create a RootFragment acting as
* a container for other fragments
*/
if (position == 0)
return new RootFragment();
else
return new StaticFragment();
}
RootFragment layout should look like:
<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"
android:id="#+id/root_frame" >
</FrameLayout>
And directly, you fill it with your first "real" fragment:
public class RootFragment extends Fragment {
private static final String TAG = "RootFragment";
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
/* Inflate the layout for this fragment */
View view = inflater.inflate(R.layout.root_fragment, container, false);
FragmentTransaction transaction = getFragmentManager()
.beginTransaction();
/*
* When this container fragment is created, we fill it with our first
* "real" fragment
*/
transaction.replace(R.id.root_frame, new FirstFragment());
transaction.commit();
return view;
}
}
Finally, you can replace fragments. For instance, inside your "real" fragment you could have a button:
btn.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
FragmentTransaction trans = getFragmentManager()
.beginTransaction();
/*
* IMPORTANT: We use the "root frame" defined in
* "root_fragment.xml" as the reference to replace fragment
*/
trans.replace(R.id.root_frame, new SecondFragment());
/*
* IMPORTANT: The following lines allow us to add the fragment
* to the stack and return to it later, by pressing back
*/
trans.setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN);
trans.addToBackStack(null);
trans.commit();
}
});
I've developed an example application that shows a similar concept. You could replace a fragment inside a ViewPager without changing to a new Activity. The code is available in:
https://github.com/danilao/fragments-viewpager-example
I'm assuming you want the Engineering fragment to be on a completely new page, because you aren't using it in your ViewPagerAdapter. If that's the case, create a new Activity, with your Engineering fragment in the layout, and launch the Activity from the engineeringButton click.
The problem is you are trying to shove your Engineering fragment into the View hierarchy of R.layout.activity_departments, and there is (hopefully) no ViewPager in there, hence the error.