Develop Reference

ViewPager not showing second fragment

I am trying to show 4 fragments in one only ViewPager but when I scroll between Fragments the second fragment is not showing at all. It only shows Fragment 1,3 and 4 correctly.
I have checked a lot of other answers about stuff like this and they suggest to use
getChildFragmentManager()
instead of
getSupportFragmentManager()
and seems to work but, I can't use that because I'm using androidx.
This is my code in my MainActivity class:
public class MainMenu extends AppCompatActivity {
private ViewPager mViewPager;
private SectionPagerAdapter sectionPagerAdapter;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main_menu);
mViewPager = findViewById(R.id.menu_viewPager);
sectionPagerAdapter = new SectionPagerAdapter(getSupportFragmentManager(),this, getFragmentList());
bottomNavigationView.setOnNavigationItemSelectedListener(this);
mViewPager.setAdapter(sectionPagerAdapter);
}
private List<Fragment> getFragmentList() {
List<Fragment> fragmentList = new ArrayList<>();
fragmentList.add(new HomeMenuFragment(this));
fragmentList.add(new RestaurantsListFragment(this));
fragmentList.add(new OrdersMenuFragment(this));
fragmentList.add(new AccountConfigurationFragment(this));
return fragmentList;
}
And this is my Adapter class for ViewPager:
public class SectionPagerAdapter extends FragmentStatePagerAdapter {
Context context;
private List<Fragment> fragments = new ArrayList<>();
public SectionPagerAdapter(FragmentManager fm, Context context, List<Fragment> fragments) {
super(fm);
this.context=context;
this.fragments=fragments;
}
#NonNull
#Override
public Fragment getItem(int position) {
return fragments.get(position);
}
#Override
public int getCount() {
return 4;
}
#Override
public CharSequence getPageTitle(int position) {
switch (position) {
case 0:
return "SECTION 1";
case 1:
return "SECTION 2";
case 2:
return "SECTION 3";
case 3:
return "SECTION 4";
}
return null;
}
}
This is the my XML file for the first Fragment (HomeMenuFragment):
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical"
>
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:fitsSystemWindows="true">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="192dp"
android:background="#color/grayLight2"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_collapseMode="parallax"
android:background="#color/grayLight2"
>
<androidx.viewpager.widget.ViewPager
android:id="#+id/banner_view_pager"
android:layout_width="match_parent"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:layout_marginTop="10dp"
android:layout_height="150dp"
android:overScrollMode="never"/>
<LinearLayout
android:id="#+id/slider_dots"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="horizontal"/>
</LinearLayout>
<androidx.appcompat.widget.Toolbar
android:id="#+id/anim_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/food_recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</LinearLayout>
</LinearLayout>
I realize that what is causing this problem is what I have in my first Fragment's XML file:
CoordinatorLayout
AppBarLayout
CollapsingToolbarLayout
Toolbar
If I remove this elements the ViewPager displays all fragments correctly!
Any idea of what could I be doing wrong or what am I missing?
Thanks in advance!

In your SectionPagerAdapter class add break in the case statements and try

i have bottom navigation and navigation drawer and i set home screen fragment as default

i have bottom navigation and navigation drawer and i set home screen fragment as default
now problem is when i run my app on Emulator hamburger icon and bottom navigation is showing and home Fragment by default
when i click to hamburger icon its not working
when i remove default home fragment then navigation drawer is working
How to solve this Problem so both navigationDrawer and bottom navigation will work
HomeScreenActivity.java
public class HomeScreenActivity extends AppCompatActivity {
DrawerLayout mDrawerLayout;
ActionBarDrawerToggle mToggle;
BottomNavigationView bottomNavigationView;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_home_screen);
bottomNavigationView = findViewById(R.id.homeScreenBottomNavigation);
bottomNavigationView.setOnNavigationItemSelectedListener(bottomNavListener);
// getSupportFragmentManager().beginTransaction().replace(R.id.homeScreenframeLayout, new HomeFragment()).commit();
mDrawerLayout = findViewById(R.id.HomeScreenDrawerLayout);
mToggle = new ActionBarDrawerToggle(this, mDrawerLayout, R.string.open, R.string.close);
mDrawerLayout.addDrawerListener(mToggle);
mToggle.syncState();
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
if (mToggle.onOptionsItemSelected(item)) {
return true;
}
return super.onOptionsItemSelected(item);
}
private BottomNavigationView.OnNavigationItemSelectedListener bottomNavListener = new BottomNavigationView.OnNavigationItemSelectedListener() {
#Override
public boolean onNavigationItemSelected(#NonNull MenuItem menuItem) {
Fragment selectedFragment = null;
switch (menuItem.getItemId()) {
case R.id.bottomNavHome:
selectedFragment = new HomeFragment();
break;
case R.id.bottomNavAdd:
selectedFragment = new AddFragment();
break;
case R.id.bottomNavSearch:
selectedFragment = new SearchFragment();
break;
}
getSupportFragmentManager().beginTransaction().replace(R.id.homeScreenframeLayout, selectedFragment).commit();
return true;
}
};
}
ActivityHomeScreen.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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=".HomeScreenActivity"
>
<android.support.v4.widget.DrawerLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/HomeScreenDrawerLayout"
>
<android.support.design.widget.NavigationView
app:headerLayout="#layout/left_navigation_header"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:id="#+id/navigationView"
app:menu="#menu/drawer_layout"
android:layout_gravity="start"
android:background="#ffff"
>
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/homeScreenframeLayout"
>
</FrameLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/homeScreenBottomNavigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
app:menu="#menu/bottom_navigation"
android:background="?android:attr/windowBackground"
>
</android.support.design.widget.BottomNavigationView>
</RelativeLayout>

The issue is with your ActivityHomeScreen.xml. You have to make DrawerLayout as the parent view. Inside that you have to place BottomNavigationDrawer and remaining code.
And You havent created custom appbar for naviagtion drawer(it now comes with navigation drawer template)
Your ActivityHomeScreen.xml should look like this:
ActivityHomeScree.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<include
layout="#layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer" />
</android.support.v4.widget.DrawerLayout>
Now create a layout file app_bar_main.xml. Inside it create a toolbar and place your frameLayout here.
app_bar_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:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
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:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<!--
Place your frameLayout here
-->
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_gravity="bottom"
app:menu="#menu/navigation" />
</android.support.design.widget.CoordinatorLayout>
Now both Navdrawer and BottomNavigationDrawer should work.

Same Layout but different result

I have a problem. With the same layout, one time it's charging on launch and second time it's by an intent.
Good:
Bad:
Here is my MainActivity. I implement the drawer and so on... :
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
//Get the list of shoes
new getSneakers().execute();
mDrawer = (DrawerLayout) findViewById(R.id.drawer_layout);
drawerToggle = setupDrawerToggle();
navigationView = (NavigationView) findViewById(R.id.nav_view);
navigationView.setNavigationItemSelectedListener(this);
// Tie DrawerLayout events to the ActionBarToggle
mDrawer.addDrawerListener(drawerToggle);
}
#Override
protected void onPostCreate(Bundle savedInstanceState) {
super.onPostCreate(savedInstanceState);
// Sync the toggle state after onRestoreInstanceState has occurred.
drawerToggle.syncState();
}
#Override
public void onConfigurationChanged(Configuration newConfig) {
super.onConfigurationChanged(newConfig);
// Pass any configuration change to the drawer toggles
drawerToggle.onConfigurationChanged(newConfig);
}
private ActionBarDrawerToggle setupDrawerToggle() {
return new ActionBarDrawerToggle(this, mDrawer, toolbar, R.string.drawer_open, R.string.drawer_close);
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
if (drawerToggle.onOptionsItemSelected(item)) {
return true;
}
return super.onOptionsItemSelected(item);
}
//#SuppressWarnings("StatementWithEmptyBody")
#Override
public boolean onNavigationItemSelected(MenuItem item) {
// Handle navigation view item clicks here.
int id = item.getItemId();
if (id == R.id.all_sneak) {
LinearLayout mainLayout = (LinearLayout) findViewById(R.id. main_container);
LayoutInflater inflater = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View layout = inflater.inflate(R.layout.content_main, null);
mainLayout.removeAllViews();
mainLayout.addView(layout);
new getSneakers().execute();
} else if (id == R.id.my_colleciton) {
} else if (id == R.id.nav_want) {
}
DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
mDrawer.closeDrawer(GravityCompat.START);
return true;
}
Here is my content_main. This is included by the app bar main and it's showing the shoes. For me the problem is coming from here, but I try something and it changes nothing.
<?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="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.etml.sneakcolleciton.MainActivity"
tools:showIn="#layout/app_bar_main"
android:id="#+id/content_main"
android:background="#eaecea">
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="5dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>
My Activit_Main is the simple menu where I include the app_main_main whose content one includes where the RecyclerView is:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start"
android:background="#eaecea">
<include
layout="#layout/app_bar_main"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_main"
app:menu="#menu/activity_main_drawer" />
</android.support.v4.widget.DrawerLayout>
Here's the app_bar_main where I include the content_main where is the list with the shoes:
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/layout_main"
tools:context="com.etml.sneakcolleciton.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
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:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include
android:id="#+id/main_container"
layout="#layout/content_main" />
</android.support.design.widget.CoordinatorLayout>

Try this:
replace
<?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="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.etml.sneakcolleciton.MainActivity"
tools:showIn="#layout/app_bar_main"
android:id="#+id/content_main"
android:background="#eaecea">
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="5dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</LinearLayout>`
with
<?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="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.etml.sneakcolleciton.MainActivity"
tools:showIn="#layout/app_bar_main"
android:id="#+id/content_main"
android:background="#eaecea">
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="5dp"/>
</LinearLayout>`

Textview in Fragment not working

I am currently working on adding tabs into my activity. For the same, I am using the Google SlidingTabLayout and SlidingTabStrip.
My fragment xml looks like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent" > >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="Large Text"
android:id="#+id/textViewTab" />
</RelativeLayout>
My contents xml looks like this:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.example.musicisfun.allaboutfootball.MainActivity"
tools:showIn="#layout/activity_main">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<com.example.musicisfun.allaboutfootball.tabs.SlidingTabLayout
android:layout_width="match_parent"
android:id="#+id/tabs"
android:layout_height="wrap_content">
</com.example.musicisfun.allaboutfootball.tabs.SlidingTabLayout>
<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"
/>
</LinearLayout>
</RelativeLayout>
and my code looks like this:
public static class TabFragment extends Fragment{
public static TabFragment getInstance(int position){
TabFragment tabFragment = new TabFragment();
Bundle bundle = new Bundle();
bundle.putInt("site",position);
tabFragment.setArguments(bundle);
return tabFragment;
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View layout = inflater.inflate(R.layout.fragment_tab,container,false);
TextView textViewTab = (TextView) layout.findViewById(R.id.textViewTab);
Bundle bundle = getArguments();
if (bundle!=null){
textViewTab.setText("Current Tab is" + bundle.getInt("site"));
}
return layout;
}
}
My fragment adaptor looks like this:
class TabPagerAdaptor extends FragmentPagerAdapter{
String[] tab_names;
public TabPagerAdaptor(FragmentManager fm) {
super(fm);
tab_names=getResources().getStringArray(R.array.feed_names);
}
#Override
public Fragment getItem(int position) {
TabFragment tabFragment = TabFragment.getInstance(position);
return tabFragment;
}
#Override
public CharSequence getPageTitle(int position) {
return tab_names[position];
}
#Override
public int getCount() {
return 2;
}
}
and this is how i am invoking the tabs:
mViewPager= (ViewPager) findViewById(R.id.pager);
mViewPager.setAdapter(new TabPagerAdaptor(getSupportFragmentManager()));
mTabs = (SlidingTabLayout) findViewById(R.id.tabs);
mTabs.setViewPager(mViewPager);
But when I run the code, I can't find the textview being shown even though two tabs are working fine.

You cannot view your textView because the height of the ViewPager is 0dp in your xml -
<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"
/>
you have to change that to either wrap_content or 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="match_parent"
/>
Also, Your LinearLayout's orientation is horizontal and the width of SlidingTabLayout is match_parent. SlidingTabLayout is occupying whole screen width leaving no room to display Viewpager.
Your LinearLayout's orientation should be vertical not horizontal
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<com.example.musicisfun.allaboutfootball.tabs.SlidingTabLayout
android:layout_width="match_parent"
android:id="#+id/tabs"
android:layout_height="wrap_content">
</com.example.musicisfun.allaboutfootball.tabs.SlidingTabLayout>
<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"
/>
</LinearLayout>

Android Eclipse Start Fragment from TabLayout Tab

I have implemented a TabLayout which has a few tabs & one of the tabs has a table & when a user clicks on a row in the table I need it to get rid of the tab layout, except for the toolbar & open up a new Fragment.
I've tried a few different ways but nothing seems to work, if anyone has any ideas, it'll will be much appreciated!
Thank you!
Cheers!
This is the 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>
& this is the MainActivity.java
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab().setText("Tab1"));
tabLayout.addTab(tabLayout.newTab().setText("Tab2"));
tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
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) {
}
});
}
#Override
public boolean onCreateOptionsMenu(Menu menu) {
//getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
#Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}
& this is tab1.xml
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:background="#F0F0F0" >
<ScrollView
android:id="#+id/scrollView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center" >
<TableLayout
android:id="#+id/table"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center" >
</TableLayout>
<RelativeLayout
android:id="#+id/loadingPanel"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center" >
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:indeterminate="true" />
</RelativeLayout>
</FrameLayout>
& this is Tab1.java
public class TopStories extends Fragment {
A lot of code goes here............
public void createTable() {
TableLayout table = (TableLayout) getActivity().findViewById(R.id.table);
table.setBackgroundColor(Color.rgb(240, 240, 240));
table.setStretchAllColumns(true);
table.setShrinkAllColumns(true);
table.removeAllViews();
TableRow row = new TableRow(getActivity());
row .setGravity(Gravity.CENTER);
row .setPadding(0, 10, 0, 10);
row .setBackgroundColor(Color.WHITE);
row .setClickable(true);
TableRow.LayoutParams params = new TableRow.LayoutParams();
row .setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
This is where I need to start up the new fragment (NewFragment.Java).
}
});
}
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment_topstories, container, false);
}
}
NewFragment.java
public class NewFragment extends Fragment {
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
return inflater.inflate(R.layout.newfragment, container, false);
}
}
newfragment.xml
<?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" >
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1.04" >
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="17dp"
android:layout_marginTop="18dp"/>
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView1"
android:layout_centerHorizontal="true"
android:layout_marginTop="37dp"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView1"
android:layout_marginTop="87dp"
android:text="Medium Text"
android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>
</LinearLayout>

I think you need to give the fragment somewhere to replace. Here is the XML from my app, and when I swap fragments, they post to flcontent.
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk
xmlns:app="http://schemas.android.com/apk/res
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<!-- The ActionBar -->
<include
layout="#layout/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
<!-- The main content view -->
<FrameLayout
android:id="#+id/flContent"
android:layout_width="match_parent"
android:layout_height="match_parent"
</LinearLayout>
<!-- The navigation drawer -->
<android.support.design.widget.NavigationView
android:id="#+id/nvView"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#android:color/white"
app:menu="#menu/drawer_view"
app:headerLayout="#layout/nav_header"/>
and the class code
// Insert the fragment by replacing any existing fragment
FragmentManager fm = getSupportFragmentManager();
FragmentTransaction ft = fm.beginTransaction();
ft.replace(R.id.flContent, fragment);
ft.addToBackStack(null);
ft.commit();

Alright so I think that I figured out a really cheap & a cheeky way to do this & probably not very healthy for the app but it works perfect!
Thank you very much for the help Brian! Appreciate it! Maybe you can do this for the backstack problem of your app as well, don't know if it will work or the right thing that you need to do though.
Cheers!
Added a FrameLayout to my main_activity.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"/>
<FrameLayout
android:id="#+id/flContent"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</FrameLayout>
</RelativeLayout>
Changed my newfragment.xml to this
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/fullStoryLinearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/fullStoryRelativeLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1.04" >
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="17dp"
android:layout_marginTop="80dp"/>
<TextView
android:id="#+id/fullStorytitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/imageView1"
android:layout_centerHorizontal="true"
android:layout_marginTop="80dp"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/fullStory"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/image"
android:layout_marginTop="50dp"
android:text="Medium Text"
android:textAppearance="?android:attr/textAppearanceMedium" />
</RelativeLayout>
</LinearLayout>
& added this to the onClick event of the table row
row.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
getActivity().findViewById(R.id.tab_layout).setVisibility(View.GONE);
getActivity().findViewById(R.id.pager).setVisibility(View.GONE);
((AppCompatActivity)getActivity()).getSupportActionBar().setDisplayHomeAsUpEnabled(true);
((AppCompatActivity)getActivity()).getSupportActionBar().setTitle("New Fragment");
Fragment fragment = null;
Class fragmentClass = NewFragment.class;
try {
fragment = (Fragment) fragmentClass.newInstance();
} catch (Exception e) {
e.printStackTrace();
}
FragmentManager fragmentManager = getActivity().getSupportFragmentManager();
FragmentTransaction fragmentTransaction = fragmentManager.beginTransaction();
fragmentTransaction.replace(R.id.flContent, fragment);
fragmentTransaction.commit();
}
});
& to go back to the main TabLayout from the NewFragment, I added this at MainActivity.java
#Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
switch (id) {
case android.R.id.home:
onBackPressed();
return true;
default:
return super.onOptionsItemSelected(item);
}
}
#Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
switch(keyCode){
case KeyEvent.KEYCODE_BACK:
if (getSupportActionBar().getTitle() != "Main Activity"){
onBackPressed();
}
else {
System.exit(0);
}
return true;
}
return super.onKeyDown(keyCode, event);
}
public void onBackPressed(){
getSupportActionBar().setDisplayHomeAsUpEnabled(false);
getSupportActionBar().setTitle("Main Activity");
findViewById(R.id.fullStoryLinearLayout).setVisibility(View.GONE);
findViewById(R.id.tab_layout).setVisibility(View.VISIBLE);
findViewById(R.id.pager).setVisibility(View.VISIBLE);
}