Develop Reference

TabLayout tab can't click in Android

I can't click tab in TabLayout. I have two tabs(Genel and Ozel). When I open the app genel open I slither Ozel layout open in genel tab. I can't click in Ozel Tab. The codes are in below.
XML Codes:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<android.support.v7.widget.Toolbar
android:id="#+id/fotogpsbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme"
/>
<android.support.design.widget.TabLayout
android:id="#+id/fotogpslayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabMode="fixed"
>
<android.support.design.widget.TabItem
android:id="#+id/fotogpsgenel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Genel"
/>
<android.support.design.widget.TabItem
android:id="#+id/fotogpsozel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Özel"
/>
</android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:id="#+id/ogesayfa"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
</android.support.v4.view.ViewPager>
</RelativeLayout>
Java Codes (MainActivity):
Toolbar fototoolbar;
TabLayout fototabl;
TabItem genelit, ozelit;
ViewPager fotogpspager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
fototoolbar = findViewById(R.id.fotogpsbar);
fototabl = findViewById(R.id.fotogpslayout);
genelit = findViewById(R.id.fotogpsgenel);
ozelit = findViewById(R.id.fotogpsozel);
fotogpspager = findViewById(R.id.ogesayfa);
sayfaadapter sayfaada = new sayfaadapter(getSupportFragmentManager(), fototabl.getTabCount());
fotogpspager.setAdapter(sayfaada);
}
Java codes (sayfaadapter - Adapter):
public class sayfaadapter extends FragmentPagerAdapter {
private int tabsayi;
sayfaadapter(FragmentManager fm, int tabsayi){
super(fm);
this.tabsayi = tabsayi;
}
#Override
public Fragment getItem(int i) {
switch(i){
case 0:
return new genel();
case 1:
return new ozel();
default:
return null;
}
}
#Override
public int getCount() {
return tabsayi;
}
}
How I can resolve this problem?
I need your help.
Not: I hope you can understand. I doesn't have a good English. You can ask where you doesn't understand.

you forgot to add layout_below into your views so viewpager overlay on tab because of this you cant click on tab,
replace code as below in your xml.
<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=".MainActivity">
<android.support.v7.widget.Toolbar
android:id="#+id/fotogpsbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:theme="?attr/actionBarTheme" />
<android.support.design.widget.TabLayout
android:id="#+id/fotogpslayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/fotogpsbar"
app:tabGravity="fill"
app:tabMode="fixed">
<android.support.design.widget.TabItem
android:id="#+id/fotogpsgenel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Genel" />
<android.support.design.widget.TabItem
android:id="#+id/fotogpsozel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Özel" />
</android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:id="#+id/ogesayfa"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/fotogpslayout" />
</RelativeLayout>

RecyclerView - How to smooth scroll to top of item on a certain position inside Nested scrollview?

I implemented Recycler view, when click on recyclerview it goes to next activity but when I came back I should be back with the same position which I was clicked, like I need to scroll to specific position based on the position of the item, I have the position but I couldn't able to scroll because of nested scrollview.
How can I fix this issue?
<android.support.design.widget.CoordinatorLayout 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.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="140dp"
android:background="#android:color/transparent"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/theme_color"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
app:title="#string/app_name"
app:titleEnabled="false">
<LinearLayout
android:id="#+id/ll_report_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"
android:orientation="vertical">
......
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/theme_color"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
.....
</RelativeLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/palegray"
android:scrollbars="none"
android:id="#+id/nested_scroll"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/palegray"
android:orientation="vertical">
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="#color/card_header" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerview"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
In this recyclerview, I need to scroll to specific item based on the position how can I make it? I used:
recyclerview.smoothScrollToPosition(position);
But didn't worked, and I used this one also but this one also dint worked for me,
RecyclerView.SmoothScroller smoothScroller = new LinearSmoothScroller(RoleActivity.this) {
#Override protected int getVerticalSnapPreference() {
return LinearSmoothScroller.SNAP_TO_START;
}
};
smoothScroller.setTargetPosition(i);
mLayoutManager.startSmoothScroll(smoothScroller);

private int mPosition = RecyclerView.NO_POSITION;
mPosition is the certain position you want to scroll. Save this in onSaveInstanceState
#Override
public void onSaveInstanceState(Bundle outState) {
outState.putInt(SELECTED_KEY, mPosition);
}
in onCreate
if(savedInstanceState != null && savedInstanceState.containsKey(SELECTED_KEY))
{
mPosition = savedInstanceState.getInt(SELECTED_KEY);
}
Call mRecylerView.smoothScrollToPosition(mPosition) once the data to be passed to reccylerview is ready,that is after adapter.notifyDataSetChanged();

ViewPager inside ScrollView not working

I want to put a ViewPager inside a CoordinatorLayout withing a NestedScrollView. The viewpager houses 3 fragments.
Problem is the fragments aren't visible. Tabs show up and the rest of the layout is visible and scrolls accordingly.
Below is the code for my layout:
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical">
<include layout="#layout/toolbar" />
<android.support.design.widget.CoordinatorLayout
android:id="#+id/coordinatorLayout"
android:layout_below="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/DarkBodyBackground"
android:fitsSystemWindows="true"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="500dp"
android:background="#color/DarkBodyBackground"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<include layout="#layout/artist_header" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include layout="#layout/loading_indicator" />
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
style="#style/TabLayoutStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|enterAlways"
app:tabGravity="fill"
app:tabMode="fixed" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone" />
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
</RelativeLayout>

Try adding this piece of code before loading your viewPager
NestedScrollView scrollView = (NestedScrollView) findViewById (R.id.nest_scrollview);
scrollView.setFillViewport (true);
Let me know if it helped fix the issue.

Use android:fillViewport="true" in ScrollView

The accepted answer resulted in my fragments now being visible. However, it left me with the problem that my NestedScrollView would no longer scroll!
To overcome this, I have created a custom ViewPager (based on this article) that calculates it's height in the required manner.
Here is full code for my CustomViewPager:
package org.example;
import android.content.Context;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.support.v4.view.ViewPager;
import android.util.AttributeSet;
import android.view.View;
public class CustomViewPager extends ViewPager {
public CustomViewPager(#NonNull Context context) {
super(context);
}
public CustomViewPager(#NonNull Context context, #Nullable AttributeSet attrs) {
super(context, attrs);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
try {
int numChildren = getChildCount();
for (int i = 0; i < numChildren; i++) {
View child = getChildAt(i);
if (child != null) {
child.measure(widthMeasureSpec, MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));
int h = child.getMeasuredHeight();
heightMeasureSpec = Math.max(heightMeasureSpec, MeasureSpec.makeMeasureSpec(h, MeasureSpec.EXACTLY));
}
}
}
catch (Exception e) {
e.printStackTrace();
}
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
}
In your layout xml, you'd then just replace android.support.v4.view.ViewPager with org.example.CustomViewPager.
(I also removed the new android:fillViewport="true" attribute from my NestedScrollView element as it seems this is now no longer needed.)

No need to use ScrollView and NestedScroolview Just use SliderLayout it will work perfectly.
add below dependency inside build.gradle (app level)
implementation 'ru.noties:scrollable:1.3.0'
layout
<?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:background="#color/cardview_light_background"
android:fitsSystemWindows="true"
android:orientation="vertical">
<include layout="#layout/toolbar" /> <!-- its toolbar -->
<ru.noties.scrollable.ScrollableLayout
android:id="#+id/scrollable_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:scrollable_autoMaxScroll="true"
app:scrollable_defaultCloseUp="true">
<!-- what ever you want you can add here, its like tabs header part -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="1">
<ImageView
android:id="#+id/imageViewProfilePic"
android:layout_width="match_parent"
android:layout_height="60dp"
android:layout_gravity="center"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:layout_weight=".75"
android:src="#drawable/hashtag" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:layout_marginBottom="10dp"
android:layout_weight=".25"
android:orientation="vertical">
<TextView
android:id="#+id/textviewTagName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="5dp"
android:fontFamily="#font/roboto_medium"
android:text=""
android:textColor="#000"
android:textSize="12sp"
android:textStyle="bold" />
/>
<TextView
android:id="#+id/textViewNoofPosts"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/textviewFollow"
android:layout_marginLeft="5dp"
android:fontFamily="#font/roboto"
android:text="(University name)"
android:textSize="11dp" />
</LinearLayout>
</LinearLayout>
<!--
<ru.noties.scrollable.sample.SampleHeaderView
style="#style/HeaderStyle"
app:shv_title="#string/sample_title_fragment_pager"/>
-->
<android.support.design.widget.TabLayout
android:id="#+id/tablayout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom|center_horizontal|center_vertical"
app:tabIndicatorColor="#color/appcolor"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/appcolor" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize" />
</ru.noties.scrollable.ScrollableLayout>
</LinearLayout>
Activity code:
public class TabActivity extends AppCompatActivity {
TabLayout tabLayout;
private SectionsPagerAdapter mSectionsPagerAdapter;
private ViewPager mViewPager;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_tab);
Toolbar mToolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(mToolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);//back arrow on toolbar
getSupportActionBar().setDisplayShowTitleEnabled(false);
mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
mViewPager = (ViewPager) findViewById(R.id.viewpager);
mViewPager.setAdapter(mSectionsPagerAdapter);
tabLayout = (TabLayout) findViewById(R.id.tablayout);
tabLayout.setupWithViewPager(mViewPager);
}
#Override
public boolean onOptionsItemSelected(MenuItem menuItem) {
if (menuItem.getItemId() == android.R.id.home) {
onBackPressed();
}
}
#Override
public void onBackPressed() {
this.finish();
super.onBackPressed();
}
public class SectionsPagerAdapter extends FragmentPagerAdapter {
public SectionsPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
switch (position) {
case 0:
return new frag1();
case 1:
return new frag2();
}
return null;
}
#Override
public int getCount() {
// Show 2 total pages.
return 2;
}
#Override
public CharSequence getPageTitle(int position) {
switch (position) {
case 0:
return "one";
case 1:
return "two";
}
return null;
}
}
}

Use nestedScrollview and set the property of nestedscrollenabled as true and I think you will do it.

So let me do it for you : the correct hierarchy as suggested by google blogspot it is working fine for me:Check this out
<?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"
android:orientation="vertical"
android:id="#+id/cl_parent"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="256dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/img_backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
android:src="#drawable/coverimage"
app:layout_collapseMode="parallax" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:tabGravity="center"
android:layout_gravity="bottom"
app:tabMode="scrollable"
app:tabContentStart="72dp" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/my_cloud_tv"
android:textColor="#fff"
android:textSize="18sp" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</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" />
let me know if it helps

How do I make my Fragment layout fit under the tabs created in main Activity?

I have a problem which seems to have a different solution everytime it is asked, and causing me great distress. I have tried to use the solutions in other SO questions, but none worked.
I have an Activity from which initializes a ViewPager, a toolbar and a TabLayout. There are two tabs, both of which are implemented using fragments. The problem is
that my fragment is layed out with a spinner, a recycler view, a button and a textfield. Of these widgets, only the recyclerView shows up with the first two items missing,
forcing me to believe the Spinner is hidden just behind my AppLayoutBar, and the textField and buttons are below the screen. My question is, how do I get the layout
of my fragment to appear in the visible part of the screen below the tabs? Below are the Layout files for both fragment and main activity
Fragment:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/header"
>
<Spinner
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/spinner"
android:entries="#array/status"
>
</Spinner>
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/list"
android:paddingTop="20dp"
android:layout_below="#+id/spinner"
android:layout_above="#+id/editText"
/>
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="0.75"
android:inputType="textMultiLine"
android:id="#+id/editText"
android:hint="#string/goal_edit_text_hint"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:maxLines="5"
android:minLines="1"
android:scrollHorizontally="false"
android:layout_alignParentStart="true"
android:layout_toLeftOf="#+id/addButton"
android:layout_toStartOf="#+id/addButton" />
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="#string/add_button_text"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:textAppearance="?android:textAppearanceLarge"
android:layout_alignParentEnd="true"
android:drawableLeft="#drawable/math"
android:id="#+id/addButton" />
</RelativeLayout>
Main Activity
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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">
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="612dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_gravity="center" />
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/header"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:popupTheme="#style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed"
app:tabGravity="fill"
/>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>

For a Detail Tutorial Have a look At
Dear I can understand your problem and I have a solution for you that will work perfectly. I'm giving complete piece of code that will solve your issue.
Step - 1: Paste this XML in your Main Activity layout.
<?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:fitsSystemWindows="true"
tools:context="com.broadpeakit.hmehmood.company.HomeActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.CustonActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:titleTextColor="#color/white"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_home" />
</android.support.design.widget.CoordinatorLayout>
Step 2 - Crate another layout with named content_home. and paste this code there.
<?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"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:context="com.broadpeakit.hmehmood.company.HomeActivity"
tools:showIn="#layout/app_bar_home">
<FrameLayout
android:id="#+id/fl_testing"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"></FrameLayout>
</RelativeLayout>
Step 3 - Now Create another layout with name viewPager_fragment that will contain your view pager with tabs and we'll inflate this layout later.
<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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:paddingLeft="0dp"
android:paddingRight="0dp"
android:paddingTop="0dp"
android:paddingBottom="0dp">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:background="#color/blue"
app:tabTextColor="#color/white"
app:tabSelectedTextColor="#color/gray"
app:tabIndicatorColor="#color/red"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"/>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="#id/tabs"/>
</RelativeLayout>
Step 4 - Now create a class with name viewPagerFragment and extends it with Fragment. we'll inflate this Fragment later in your Main Activity.
public class viewPagerFragment extends Fragment {
private TabLayout tabLayout;
private ViewPager viewPager;
TabsTestFragment1 tabsTestFragment1;
TabsTestFragment2 tabsTestFragment2;
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {
// Inflate the layout for this fragment
setHasOptionsMenu(true);
return inflater.inflate(R.layout.viewPager_fragment, container, false);
}
#Override
public void onViewCreated(View view, Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
((HomeActivity)getActivity()).updateDrawerIcon();
tabsTestFragment1 = new TabsTestFragment1();
tabsTestFragment2 = new TabsTestFragment1();
viewPager = (ViewPager) view.findViewById(R.id.viewpager);
setupViewPager(viewPager);
tabLayout = (TabLayout)view.findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
}
public void setupViewPager(ViewPager viewPager) {
ViewPagerAdapter adapter = new ViewPagerAdapter(getChildFragmentManager());
adapter.addFragment(tabsTestFragment1, "Tab 1");
adapter.addFragment(tabsTestFragment2, "Tab 2");
viewPager.setAdapter(adapter);
}
class ViewPagerAdapter extends FragmentPagerAdapter {
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 addFragment(Fragment fragment, String title) {
mFragmentList.add(fragment);
mFragmentTitleList.add(title);
}
#Override
public CharSequence getPageTitle(int position) {
return mFragmentTitleList.get(position);
}
}
}
Step 5 - Now place this code in onCreate of your Main Activity.
getSupportFragmentManager().beginTransaction().setTransition(FragmentTransaction.TRANSIT_FRAGMENT_OPEN).replace(R.id.fl_testing, new viewPagerFragment()).commit();
Now you are good to RUN your code. Get back to me if you have any issue later. Also mark this issue as solved if you are able to solve your issue using this code. Happy Coding :)

Change your Main Activity with this one
<?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"
android:id="#+id/tabanim_maincontent"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<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|snap"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</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>

Collapsing/Expanding view coordinated with Sliding RecyclerView

I am trying to achieve the following affect (also see image below):
the app opens with a view (map) partially visible and the RecyclerView at a default anchor point (center image)
user scrolls the RecyclerView up, the map collapses and the list continues scrolling (right image)
user scrolls the RecyclerView down, the map expands to a maximum point (note the list should not slide completely off screen but to some anchored point) (left image)

To create this we need 1 Activity and 3 Fragments.
The Activity will host a TabLayout and a ViewPager like so:
<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/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar" />
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
Since we only need to do the sliding behavior for the 1st Fragment the first Fragment gets an XML layout like so:
<android.support.design.widget.CoordinatorLayout
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.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="400dp"
android:orientation="vertical"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsingToolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<com.google.android.gms.maps.MapView
android:id="#+id/mapView"
app:layout_collapseMode="parallax"
android:layout_height="400dp"
android:layout_width="match_parent" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
You can make the other Fragments however you like I just created fake data and a simple RecyclerView in the other Fragments.
Then call these views in your Activity and Fragment like so:
Activity
public class MainActivity extends AppCompatActivity {
private TabLayout mTabLayout;
private ViewPager mViewPager;
private SampleViewPagerAdapter mViewPagerAdapter;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.another_activity);
mTabLayout = (TabLayout) findViewById(R.id.sliding_tabs);
mViewPager = (ViewPager) findViewById(R.id.viewpager);
mViewPagerAdapter = new SampleViewPagerAdapter(getSupportFragmentManager());
mViewPager.setAdapter(mViewPagerAdapter);
mTabLayout.setupWithViewPager(mViewPager);
}
}
ViewPager Adapter
public class SampleViewPagerAdapter extends FragmentPagerAdapter {
public SampleViewPagerAdapter(FragmentManager fm) {
super(fm);
}
#Override
public Fragment getItem(int position) {
switch (position) {
case 0:
return new MapFragment();
case 1:
return new ScrollFragment();
case 2:
return new ScrollFragment();
default:
return new ScrollFragment();
}
}
#Override
public int getCount() {
return 3;
}
#Override
public CharSequence getPageTitle(int position) {
String[] tabNames = {"Stops", "Planner", "Alerts"};
return tabNames[position];
}
}
Map Fragment with Sliding RecyclerView
public class MapFragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View root = inflater.inflate(R.layout.activity_main, null);
initCollapsingToolbar(root);
// Initialize map
initFragment();
return root;
}
private void initCollapsingToolbar(View root) {
CollapsingToolbarLayout collapsingToolbarLayout =
(CollapsingToolbarLayout) root.findViewById(R.id.collapsingToolbar);
collapsingToolbarLayout.setContentScrimColor(getResources().getColor(R.color.cyan_500));
}
private void initFragment() {
FakeDataFragment fragment = new FakeDataFragment();
getChildFragmentManager().beginTransaction()
.replace(R.id.content, scrollFragment)
.commit();
}
}
You should get something like this then:
Setting the position:
You can programmatically collapse the toolbar (CollapsingToolbarLayout) using the following code:
public void collapseToolbar(){
CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) mFrameLayout.getLayoutParams();
AppBarLayout.ScrollingViewBehavior behavior = (AppBarLayout.ScrollingViewBehavior) params.getBehavior();
if (behavior != null) {
behavior.onNestedFling(rootLayout, appbarLayout, null, 0, 10000, true);
}
}
This means when the User first sees the map the map is partially collapsed to your Default State.

I Found Solution for Tabs in CoordinatorLayout
<?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"
android:id="#+id/htab_maincontent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/htab_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/htab_collapse_toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:statusBarScrim="#null"
app:titleEnabled="false">
<LinearLayout
android:id="#+id/isprofile"
android:layout_width="match_parent"
android:layout_height="180dp"
android:background="#drawable/profile_cover"
android:gravity="center"
app:layout_collapseMode="parallax">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="10dp"
android:gravity="center"
android:orientation="vertical">
<com.root.findagame.utills.CircleImageView
android:id="#+id/profile_pic"
android:layout_width="60dp"
android:layout_height="60dp"
android:background="#drawable/profile_pic" />
<TextView
android:id="#+id/txtUserName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:textColor="#color/cpb_white"
android:textSize="#dimen/text_medium_size"
android:textStyle="bold" />
<TextView
android:id="#+id/txtAge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text=""
android:textColor="#color/cpb_white"
android:textSize="#dimen/text_small_size" />
<TextView
android:id="#+id/txtName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text=""
android:textColor="#color/cpb_white"
android:textSize="#dimen/text_small_size"
android:visibility="gone" />
</LinearLayout>
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/htab_toolbar"
android:layout_width="match_parent"
android:layout_height="40dp"
android:visibility="gone"
app:layout_collapseMode="pin"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/htab_tabs"
android:layout_width="match_parent"
android:layout_height="40dp"
android:layout_gravity="bottom"
android:background="#color/cpb_white"
app:layout_collapseMode="pin"
app:tabIndicatorColor="#7CC142"
app:tabSelectedTextColor="#7CC142"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:tabTextAppearance="#android:style/TextAppearance.Widget.TabWidget"
app:tabTextColor="#color/lightGrayColor" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/htab_viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
*Fragment*
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/dummyfrag_bg"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.RecyclerView
android:id="#+id/dummyfrag_scrollableview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false" />
</FrameLayout>