Develop Reference

Fragment appearing multiple times in tabLayout

I didn't find any relevant posts to this problem. I am trying to implement simple tabs (tab layout) with swipe using this tutorial. However, my fragment is appearing multiple times even when I click for the first time. Please find below the relevant code. Will appreciate any help provided.
FragmentPagerAdapter Implementation:
public class SectionsPageAdapter extends FragmentPagerAdapter {
private final List<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();
public SectionsPageAdapter(FragmentManager manager) {
super(manager);
}
public void addFragment(Fragment fragment, String title) {
mFragmentList.add(fragment);
mFragmentTitleList.add(title);
}
#Override
public Fragment getItem(int position) {
return mFragmentList.get(position);
}
#Nullable
#Override
public CharSequence getPageTitle(int position) {
return mFragmentTitleList.get(position);
}
#Override
public int getCount() {
return mFragmentList.size();
}
}
Main Class:
SectionsPageAdapter mSectionsPageAdapter = new
SectionsPageAdapter(getSupportFragmentManager());
// Set up the ViewPager with the sections adapter and add fragments.
ViewPager mViewPager = (ViewPager) findViewById(R.id.container);
TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
mSectionsPageAdapter.addFragment(new TodayFragment(), "TAB1");
mSectionsPageAdapter.addFragment(new WeeklyFragment(), "TAB2");
mSectionsPageAdapter.addFragment(new PhotosFragment(), "TAB3");
mViewPager.setAdapter(mSectionsPageAdapter);
tabLayout.setupWithViewPager(mViewPager);
main.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=".DetailActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
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>
Fragments are one liner so I don't think there is any problem there. Please find below 2 screenshots taken 1) onLoading activity 2) after clicking on tab2 for 1st time.

Can you share with us the layout code for your second fragment? Id like to see if the lack of a solid background may be causing the issue.

Android. Tablayout inside a tab of another tablayout

Is it possible to have a tablayout inside a tab of another tablayout? I have created the following image for a better explanation. The slide movement desired is as it is described in the image.
My main activity
Xml
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed"
app:tabGravity="fill"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
Code
public class MainActivity extends AppCompatActivity {
private TabLayout tabLayout;
private final static int[] tabIcons = {
R.drawable.ic_tab_1,
R.drawable.ic_tab_2,
R.drawable.ic_tab_3,
R.drawable.ic_tab_4
};
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager);
setupViewPager(viewPager);
tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
setupTabIcons();
}
private void setupTabIcons() {
tabLayout.getTabAt(0).setIcon(tabIcons[0]);
tabLayout.getTabAt(1).setIcon(tabIcons[1]);
tabLayout.getTabAt(2).setIcon(tabIcons[2]);
tabLayout.getTabAt(3).setIcon(tabIcons[3]);
}
private void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFrag(new Fragment1());
adapter.addFrag(new Fragment2());
adapter.addFrag(new Fragment3());
adapter.addFrag(new Fragment4());
viewPager.setAdapter(adapter);
}
class ViewPagerAdapter extends FragmentPagerAdapter {
private final List<Fragment> mFragmentList = new ArrayList<>();
ViewPagerAdapter(FragmentManager manager) {
super(manager);
}
#Override
public Fragment getItem(int position) {
return mFragmentList.get(position);
}
#Override
public int getCount() {
return mFragmentList.size();
}
void addFrag(Fragment fragment) {
mFragmentList.add(fragment);
}
}
}
Fragments
Xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:background="#android:color/holo_blue_light"
android:id="#+id/fragment_1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="myContext">
<TextView
android:text="It is just a text."
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
Code
public class Fragment1 extends Fragment {
public Fragment1() { }
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment.
return inflater.inflate(R.layout.fragment_1, container, false);
}
}
How should Fragment2_A and Fragment2_B XML and Java code be?

ok, so inside your fragment you have only TextView. Now for fragment_2 put another TabLayout and ViewPager (you don't need AppBar, and Coordinator, they will be already there from parent layout of Activity)
frag2.xml
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="#+id/frag2_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed"
app:tabGravity="fill"/>
<android.support.v4.view.ViewPager
android:id="#+id/frag2_viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
you have to create Frag2 Fragment , init with above layout inside OnCreateView and then for frag2_viewpager ViewPager class set another adapter for frag2a.xml and frag2b.xml Fragments only, they may have lets assume only TextViews or whatever. TabLayout will be placed above, inside Frag2 (and one in Activity as on pic)

I know that this is not a direct answer to the question and that I might get penalized for this, but you should not nest tabs in tabs. Google uses design concepts called material design. One of the rules for tabs is not to nest them. Here is a link to the page: https://material.google.com/components/tabs.html#tabs-usage. I think that it is really important that we as developers follow this to make the Android platform as universal and as amazing as it can be.
Thanks,
Oak

Simple
Everything will remain same like you set ViewPager in Activity. Just you need to use getChildFragmentManager() in Fragment instead of getFragmentManager().
From getChildFragmentManager() documentation
Return a private FragmentManager for placing and managing Fragments
inside of this Fragment.
From getFragmentManager() documentation
Return the FragmentManager for interacting with fragments associated
with this fragment's activity.
You can see #this answer for complete code.

Android Tabs in middle of layout

In the middle of my layout I want to have 2 tabs to choose between viewing 2 different lists in the second half of the screen. How can I do this?
Here is an image illustrating what I wish to achieve. This image has a questions tab and an answers tab in the middle of the screen. Depending on which tab you select it shows a different listview:
I wish to achieve this exact same thing.
I tried doing it with TabHost widget, but for the life of me I couldn't get rid of the title bar (I tried selecting themes with no title bar, tried setting the theme in the manifest to a no title bar one)
I also tried make action bar tabs, but those were at the top of the screen....
How can I create tabs in the middle of my screen like in the image?

I had to do the same today! I tried with PagerTabStrip, because I thought you can't use TabLayout if it's not with a Toolbar. Turns out I was wrong, and it's even used in Google iosched. So you can put a TabLayout + ViewPager wherever you want.
I know you want to do some very custom tabs, which would be easier to customize if they were buttons, but in my opinion it's better to use TabLayout + ViewPager, since it makes things more scalable.
activity_main.xml
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<LinearLayout
android:id="#+id/top_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal"></LinearLayout>
<RelativeLayout
android:id="#+id/bottom_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/top_layout"
android:layout_weight="1">
<android.support.design.widget.TabLayout
android:id="#+id/pager_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:minHeight="60dp"
app:tabGravity="fill"
app:tabIndicatorColor="#color/colorAccentSecondary"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/colorAccentSecondary"
app:tabTextAppearance="#style/TournamentWaitingTimerTabTextAppearance" />
<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:layout_below="#+id/pager_header"></android.support.v4.view.ViewPager>
</RelativeLayout>
</LinearLayout>
MainActivity class:
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
// Locate the viewpager in activity_main.xml
ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
// Set the ViewPagerAdapter into ViewPager
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFrag(new LeftFragment(), "Players");
adapter.addFrag(new RightFragment(), "Prizes");
viewPager.setAdapter(adapter);
TabLayout mTabLayout = (TabLayout) findViewById(R.id.pager_header);
mTabLayout.setupWithViewPager(viewPager);
}
class ViewPagerAdapter extends FragmentStatePagerAdapter {
private final List<Fragment> mFragmentList = new ArrayList<>();
private final List<String> mFragmentTitleList = new ArrayList<>();
public ViewPagerAdapter(FragmentManager manager) {
super(manager);
}
#Override
public Fragment getItem(int position) {
return mFragmentList.get(position);
}
#Override
public int getCount() {
return mFragmentList.size();
}
public void addFrag(Fragment fragment, String title) {
mFragmentList.add(fragment);
mFragmentTitleList.add(title);
}
#Override
public CharSequence getPageTitle(int position) {
return mFragmentTitleList.get(position);
}
}
}
You can change the adapter you use, it doesn't matter.
To customize tabs, I'd take a look at this amazing tutorial.

You can try using a ViewPager with PagerTabStrip
You can add fragments as page tabs by implementing a FragmentPagerAdapter
In your layout xml file, you should be able to move around the ViewPager to anywhere in your layout like you would most other components. I haven't tried centering it, but I have placed things above and below it, and it behaves as you would expect.
<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:id="#+id/pager_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
</android.support.v4.view.ViewPager>
FragmentPagerAdapter example
public class FragmentPagerAdapter extends android.support.v4.app.FragmentPagerAdapter
{
final int PAGE_COUNT = 2;
private final String[] PAGE_TITLES =
{
"Fragment1",
"Fragment2"
};
public FragmentPagerAdapter()
{
super(getSupportFragmentManager());
}
#Override
public int getCount()
{
return PAGE_COUNT;
}
#Override
public CharSequence getPageTitle(int position)
{
return PAGE_TITLES[position];
}
#Override
public Fragment getItem(int position)
{
switch(position)
{
case 0:
return new Fragment1();
case 1:
return new Fragment2();
default:
return null;
}
}
}
and in your main Acivity:
#Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
...
mCustomPagerAdapter = new FragmentPagerAdapter();
mViewPager = (ViewPager) findViewById(R.id.pager);
mViewPager.setAdapter(mCustomPagerAdapter);
...
}

Update A ListView In One Fragment From A Second Fragment

I have a ViewPager that shows the user 2 fragments.
Fragment 1 contains a button with an onClickListener that adds an entry to the ListView contents in fragment 2. The new entry is a number generated by a random number generator.
Fragment 2 contains a ListView with some random numbers in.
I cannot find a way to refresh the list in fragment 2 from the button listener in fragment 1. How do i do this?
I have tried:
initializing and setting the list adapter in an onResume in
fragment 2.
Calling myViewPager.notifyDataSetChanged from fragment 1.
Neither of the above methods have worked. Any ideas?
Edit: Here is my code:
layout_main.xml
<android.support.v4.view.ViewPager
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainpager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
layout_frag_one.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" >
<Button
android:id="#+id/main_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Add Number" />
</RelativeLayout>
layout_frag_two
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_height="wrap_content">
</ListView>
</LinearLayout>
MainActivity
public class SlideActivity extends FragmentActivity {
private final static int FRAGMENT_NUMBER = 2;
private ViewPager pager;
protected void onCreate(Bundle savedInstanceState) {
setContentView(R.layout.activity_mainpager);
pager = (ViewPager) findViewById(R.id.mainpager);
pager.setAdapter(new ViewPagerAdapter(getSupportFragmentManager()));
super.onCreate(savedInstanceState);
}
private class ViewPagerAdapter extends FragmentStatePagerAdapter {
public ViewPagerAdapter(FragmentManager fm) {
super(fm);
}
public Fragment getItem(int index) {
switch(index){
case 0:
return new Fragment1();
case 1:
return new Fragment2();
default:
return new Fragment1();
}
}
public int getCount() {
return FRAGMENT_NUMBER;
}
}
}

You may need to implement some of this to get it working right:
http://developer.android.com/training/basics/fragments/communicating.html
And some more reading here:
http://developer.android.com/guide/components/fragments.html#CommunicatingWithActivity

FragmentPagerAdapter using ViewPagerIndicator not working

I have decided for remaking UI of my app by using ViewPagerIndicator and TitlePageIndicator, but I have following problems:
1) Fragments that are for each page are not displayed.
2) Swipe betwen two pages does not work.
I am using ActionBarSherlock as I did with tabs.
I have not changed anything in Fragmens since it has workrd fine when I was using tabs and I have written following code:
public class CustomFragmentAdapter extends FragmentPagerAdapter {
private final String[] TITLES = new String[] {
"General",
"Companies",
"Discounts"
};
public final int NUM_TITLES = TITLES.length;
public CustomFragmentAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
Log.v("POSITION", "position: "+position);
switch (position) {
case 0:
return new General();
case 1:
return new Companies();
case 2:
return new Discounts();
}
return null;
}
#Override
public int getCount() {
return NUM_TITLES;
}
#Override
public CharSequence getPageTitle(int position) {
return TITLES[position % NUM_TITLES].toUpperCase();
}
}
and
mViewPager = (ViewPager)findViewById(R.id.pager);
mViewPager.setAdapter(new CustomFragmentAdapter(getSupportFragmentManager()));
TitlePageIndicator indicator = (TitlePageIndicator) findViewById(R.id.indicator);
indicator.setViewPager(mViewPager);
indicator.setCurrentItem(0);
and my XML
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/main"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<com.viewpagerindicator.TitlePageIndicator
android:id="#+id/indicator"
android:layout_height="wrap_content"
android:layout_width="match_parent"
/>
<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="0dp"
android:layout_weight="1"
/>
As I have seen most of the tutorials and examples are quiet similar to my code, but I still can't make it work. I have tried almost everything. It was also not working when I have put there some dummy fragments with just some TextView. I also have tried to remove ViewPagerIndicator and try only ViewPager, but it was not working for me.
I am probably missing something, but I can't find it.
Thank you very much in advance for your advices.

One difference I see from a similar Activity of mine is that you're not setting the current item of the pager:
mViewPager.setCurrentItem(0, false);

I have found the problem which was missing android:orientation="vertical" in activity layout xml