We Keep Coding

Multi Tab application

I have created multi tabs app in android , But I can't refer to my Xml elements in the class in picture , I have tried solution here findViewById in Fragment but it didn't work for me
here is my xml code
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".CountDown">
<EditText
android:id="#+id/time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="101dp"
android:layout_marginTop="50dp"
android:layout_marginEnd="101dp"
android:layout_marginBottom="450dp"
android:autofillHints="time will be here"
android:inputType="time"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.482"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.45"
tools:ignore="Autofill,LabelFor"
tools:text="time" />
</androidx.constraintlayout.widget.ConstraintLayout>
here is my main activity class
public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
SectionsPagerAdapter sectionsPagerAdapter = new SectionsPagerAdapter(this, getSupportFragmentManager());
ViewPager viewPager = findViewById(R.id.view_pager);
viewPager.setAdapter(sectionsPagerAdapter);
TabLayout tabs = findViewById(R.id.tabs);
tabs.setupWithViewPager(viewPager);
}
}
here is my main activity xml
<androidx.coordinatorlayout.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">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:minHeight="?actionBarSize"
android:padding="#dimen/appbar_padding"
android:text="#string/app_name"
android:textAppearance="#style/TextAppearance.Widget.AppCompat.Toolbar.Title" />
<com.google.android.material.tabs.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary" />
</com.google.android.material.appbar.AppBarLayout>
<androidx.viewpager.widget.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>

Try like below code.
#Nullable
#Override
public View onCreateView(LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
View frag = inflater.inflate(R.layout.count_down, container, false);
EditText time = frag.findViewById(R.id.time);
return frag;
}

Toolbar disappears while replacing fragment when Data Binding in Android

I'm replacing my main activity's layout with fragments in order to keep the same navigation menu. However I've done data binding to fragment_home.xml and now the toolbar no longer shows up, even though I still switch to the intended fragment. After some debugging, I believe it has something to do with the setContentView in HomeFragment.java.
Any ideas?
Here's my activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".MainActivity"
tools:openDrawer="start">
<LinearLayout
android:id="#+id/linearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#000"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<FrameLayout
android:id="#+id/frag_container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<com.google.android.material.navigation.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="#layout/nav_header"
app:menu="#menu/side_navbar"
app:itemTextColor="#color/black"
app:itemIconTint="#color/black"/>
</androidx.drawerlayout.widget.DrawerLayout>
Replacing frame layout with the fragment
getSupportFragmentManager().beginTransaction().replace(R.id.frag_container, new HomeFragment()).commit(); ```
And the fragment_home.xml
<?xml version="1.0" encoding="utf-8"?>
<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"
tools:context=".HomeFragment">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/viewCities"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:padding="4dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
</layout>
And finally the HomeFragment.java
public class HomeFragment extends Fragment {
private CityViewModel cityViewModel;
private RetrofitAdapter retrofitAdapter;
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
View view = inflater.inflate(R.layout.fragment_home, container, false);
FragmentHomeBinding activityMainBinding =
DataBindingUtil.setContentView(getActivity(), R.layout.fragment_home);
RecyclerView recyclerView = activityMainBinding.viewCities;
recyclerView.setLayoutManager(new LinearLayoutManager(getContext()));
recyclerView.setHasFixedSize(true);
cityViewModel = new ViewModelProvider(requireActivity()).get(CityViewModel.class);
retrofitAdapter = new RetrofitAdapter();
recyclerView.setAdapter(retrofitAdapter);
return view;
}
}

You do not have to set the content view again from the fragment. From the HomeFragnent for using the data-binding just do something as follows.
FragmentHomeBinding binding; // declare the binding variable
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
binding = DataBindingUtil
.inflate(inflater, R.layout.fragment_home, container, false);
/* FragmentHomeBinding activityMainBinding =
DataBindingUtil.setContentView(getActivity(), R.layout.fragment_home); */
RecyclerView recyclerView = binding.viewCities; // use the binding here
recyclerView.setLayoutManager(new LinearLayoutManager(getContext()));
recyclerView.setHasFixedSize(true);
cityViewModel = new ViewModelProvider(requireActivity()).get(CityViewModel.class);
retrofitAdapter = new RetrofitAdapter();
recyclerView.setAdapter(retrofitAdapter);
return binding.getRoot();
}

How to set up a tablayout with viewpager in a bottom navigation view fragment?

I have a bottom Navigation view navigation view that contains 5 fragments, in one of those fragments I need to have a card slider (basically a view pager with a tab layout that slides between two cards back and forth) I have tried a lot of solutions but nothing worked, my most successful attempt is the app not crashing and the pager fragments are not showing.
Q: How to setup a view pager that has two tabs inside a fragment of a bottom Navigation View ?
This is my main fragment's XML and JAVA:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:calendarview="http://schemas.android.com/apk/res-auto"
xmlns:weekview="http://schemas.android.com/apk/res-auto"
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"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".Fragments.HealthRecordFragment">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="12dp"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<androidx.viewpager.widget.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.viewpager.widget.PagerTitleStrip
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom" />
<com.google.android.material.tabs.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top" />
</androidx.viewpager.widget.ViewPager>
</LinearLayout>
</LinearLayout>
</LinearLayout>
</FrameLayout>
.
private TabLayout tabLayout;
private ViewPager viewPager;
/*******/
viewPager = (ViewPager) view.findViewById(R.id.viewpager);
setupViewPager(viewPager);
tabLayout = (TabLayout) view.findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
/*******/
private void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter adapter = new ViewPagerAdapter(getChildFragmentManager());
TabOne tabFirst = new TabFirst();
TabTwo tabSecond = new TabSecond();
adapter.addFragment(tabFirst, "tab title 1");
adapter.addFragment(tabSecond, "tab title 2");
viewPager.setAdapter(adapter);
}
This is my view pager's first tab (XML & JAVA):
<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="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".Tabs.TabOne">
<androidx.cardview.widget.CardView
app:cardUseCompatPadding="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="this is tab 1"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</androidx.cardview.widget.CardView>
</FrameLayout>
.
public class TabOne extends Fragment {
public TabOne() {
// Required empty public constructor
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_first, container, false);
return view;
}
}
This is my view pager's second tab (XML & JAVA):
<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="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context=".Tabs.TabTwo">
<androidx.cardview.widget.CardView
app:cardUseCompatPadding="true"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:text="this is tab 2"
android:gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</androidx.cardview.widget.CardView>
</FrameLayout>
.
public class TabTwo extends Fragment {
public TabTwo() {
// Required empty public constructor
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_second, container, false);
return view;
}
}

I can't use transaction.replace

I am trying to replace the content of frame_layout with a view of fragment.
I used to do that by just using transaction.replace but it just put the view on the top of the main content.
Here is the code:
That's where I replace the frame_layout whose ID is contain:
VideosFragment videosFragment = new VideosFragment();
Bundle bundle = new Bundle();
bundle.putCharSequence("Character", view.getContentDescription());
videosFragment.setArguments(bundle);
FragmentTransaction transaction = fragmentManager.beginTransaction();
transaction.replace(R.id.contain , videosFragment).addToBackStack(null).commit();
here is the xml of main_Activity
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.shobakyDC.muchannel.MainActivity">
<FrameLayout
android:id ="#+id/contain"
android:layout_width="match_parent"
android:background="#drawable/islamic_green"
android:layout_height="match_parent">
<ProgressBar
android:id="#+id/progressBar2"
style="?android:attr/progressBarStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" />
<GridView
android:id="#+id/gridview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:horizontalSpacing="10dp"
android:numColumns="2"
android:paddingStart="50dp"
android:paddingTop="10dp"
android:verticalSpacing="10dp"
android:paddingRight="0dp"
android:paddingLeft="50dp"
android:paddingEnd="0dp">
</GridView>
</FrameLayout>
<android.support.design.widget.NavigationView
android:id="#+id/Navigator"
android:layout_width="wrap_content"
android:layout_height="match_parent"
app:headerLayout="#layout/header"
android:layout_gravity="start"
android:background="#android:color/white"
app:itemTextColor="#color/navcolor"
app:itemIconTint="#color/navcolor"
app:menu="#menu/navigationmenu">
</android.support.design.widget.NavigationView>
the video_fragment:
public class VideosFragment extends Fragment {
#Nullable
#Override
public View onCreateView(LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.videofragment_layout , container , false);
Bundle args = getArguments();
TextView textView = view.findViewById(R.id.textView);
textView.setText(args.getString("Character"));
return view;
}
}

In xml of Main Activity, you have to make an empty FrameLayout with an ID like this:
<FrameLayout
android:id ="#+id/contain"
android:layout_width="match_parent"
android:background="#drawable/islamic_green"
android:layout_height="match_parent">
</FrameLayout>
and then make a separate xml layout for this fragment. Now you have to replace this fragment layout with frame layout in Main Activity.

Unable to replace fragment in viewpager

I've been trying to replace the current fragment with another one when an item on the list view has been pressed. However when the button is pressed, the onClick method is fired but it does not replace the fragment.
JournalFragment.java
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
rootView = inflater.inflate(R.layout.fragment_journal_view, container, false);
context = getContext();
ListView myView = (ListView) rootView.findViewById(R.id.listView);
TableControllerUser TCU = new TableControllerUser(context);
final TableControllerJournal TCJ = new TableControllerJournal(context);
int accID = TCU.getLoggedInId();
Cursor cursor = TCJ.getAllJournals(accID);
Cursor allFood = TCJ.getAllFoodJournals(accID);
Cursor allActivity = TCJ.getAllActivityJournals(accID);
Cursor[] cursors = {cursor, allFood, allActivity};
MergeCursor m = new MergeCursor(cursors);
final JournalAdapter adapter = new JournalAdapter(context, m, 0);
myView.setAdapter(adapter);
myView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
#Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
Cursor c = (Cursor) adapter.getItem(position);
Toast.makeText(getActivity(), "onClick Pressed!", Toast.LENGTH_SHORT).show();
String title = c.getString(c.getColumnIndexOrThrow("title"));
if (title.contains("Glucose")) {
String glucose = c.getString(c.getColumnIndexOrThrow("glucose"));
String dateTime = c.getString(c.getColumnIndexOrThrow("glucose_time"));
String journalId = c.getString(c.getColumnIndexOrThrow("_id"));
String split[] = dateTime.split(" ");
String date = split[0];
String time = split[1];
Fragment gluFrag = new GlucoseFragment();
Bundle bundle = new Bundle();
bundle.putString("time", time);
bundle.putString("date", date);
bundle.putString("glucose", glucose);
bundle.putString("journalId", journalId);
gluFrag.setArguments(bundle);
((GraphActivity) getActivity()).replaceFragments(gluFrag, bundle);
}
}
});
return rootView;
// Inflate the layout for this fragment
}
}
JournalFragment.XML
<LinearLayout 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="edu.tp.sghealthapp.JournalViewFragment"
android:id="#+id/jv">
<ListView
android:id="#+id/listView"
android:layout_below="#+id/viewPager"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:divider="#color/iron"
android:dividerHeight="1dp" />
</LinearLayout>
JournalListViewLayout.XML
<?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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<TextView
android:id="#+id/txt_listTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_toLeftOf="#+id/arrowIcon"
android:layout_toStartOf="#+id/arrowIcon"
android:textColor="#000000"
android:focusable="false"
android:textSize="16sp"
android:typeface="sans" />
<ImageView
android:id="#+id/arrowIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:focusable="false"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:src="#drawable/ic_arrow" />
</RelativeLayout>
GraphActivity.java
public class GraphActivity extends AppCompatActivity {
Context context;
TabLayout mTabLayout;
ViewPager mViewPager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
context = getApplicationContext();
getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
setContentView(R.layout.activity_graph);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setElevation(0);
mTabLayout = (TabLayout) findViewById(R.id.tabLayout);
mViewPager = (ViewPager) findViewById(R.id.viewPager);
ViewPagerAdapter pgAdapter = new ViewPagerAdapter(getSupportFragmentManager());
pgAdapter.addFragments(new GraphFragment(), "Graph");
pgAdapter.addFragments(new JournalViewFragment(), "Journal");
mViewPager.setAdapter(pgAdapter);
mTabLayout.setupWithViewPager(mViewPager);
}
public void replaceFragments(Fragment newFragment, Bundle bundle) {
Fragment fragment = newFragment;
FragmentManager fm = getSupportFragmentManager();
FragmentTransaction ft = fm.beginTransaction();
fragment.setArguments(bundle);
ft.replace(R.id.jv, fragment);
ft.commit();
}
}
EDIT:
ActivityGraph.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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
tools:context=".GraphActivity"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/graph">
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/primary"
app:tabGravity="fill"
app:tabMode="scrollable"
app:tabSelectedTextColor="#color/white"
app:tabTextColor="#color/black">
<!--To be fixed in future to occupy whole bar when mode = fixed-->
</android.support.design.widget.TabLayout>
<edu.tp.sghealthapp.library.graphViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/tabLayout"></edu.tp.sghealthapp.library.graphViewPager>
</RelativeLayout>
EDIT 2
Tried Harron's and Vivek_Neel's methods, both of them work but cause this problem with the formatting
Putting android:layout_below="#+id/viewPager" in the linearLayout causes the fragment to no longer display
EDIT 3
Solved the formatting problem with this https://stackoverflow.com/a/34573034/5509513

activity_graph.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:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
tools:context=".GraphActivity"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/graph">
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/primary"
app:tabGravity="fill"
app:tabMode="scrollable"
app:tabSelectedTextColor="#color/white"
app:tabTextColor="#color/black">
<!--To be fixed in future to occupy whole bar when mode = fixed-->
</android.support.design.widget.TabLayout>
<edu.tp.sghealthapp.library.graphViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/tabLayout"></edu.tp.sghealthapp.library.graphViewPager>
<LinearLayout
android:id="#+id/jv"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>

<FrameLayout
android:id="#+id/jv"
android:layout_width="match_parent"
android:layout_height="match_parent" />
Put this code snip and into activity and check

Try wrap_content the height of View Pager and add Relative Layout with #+id/jd and give it layout below view pager.
Refer 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:id="#+id/graph"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/ColorPrimary"
app:tabGravity="fill"
app:tabMode="scrollable"
app:tabSelectedTextColor="#FFF"
app:tabTextColor="#000">
<!--To be fixed in future to occupy whole bar when mode = fixed-->
</android.support.design.widget.TabLayout>
<edu.tp.sghealthapp.library.graphViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/tabLayout" />
<RelativeLayout
android:id="#+id/jv"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/viewPager" />
</RelativeLayout>
EDIT 1
Second way to do it create new layout only with Frame Layout. And use it's Place Holder while replacing your Fragment.
<?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" >
<FrameLayout
android:id="#+id/jd"
android:layout_width="match_parent"
android:layout_height="match_parent">
</FrameLayout>
</LinearLayout>