CollapsingToolbarLayout title have a strange top margin but only when it is collapsed and only when inside a fragment.
Prior to the 25.0.0 version of Design Support Library everything worked fine.
Video: https://www.youtube.com/watch?v=7WUrFhmvs_Q&feature=youtu.be
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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="256dp"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:src="#drawable/image_placeholder"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"/>
</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">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="16dp"
android:text="Lorem ipsum dolor sit amet enim ..."
android:textSize="20sp"/>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
Fragment :
public class TestFragment extends Fragment {
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
super.onCreateView(inflater, container, savedInstanceState);
View view = inflater.inflate(R.layout.test_fragment, container, false);
return view;
}
#Override
#CallSuper
public void onViewCreated(View view, Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
CollapsingToolbarLayout toolbarLayout = (CollapsingToolbarLayout) view.findViewById(R.id.collapsing_toolbar_layout);
toolbarLayout.setTitle("Lorem Ipsum");
}
}
Any ideas?
I have the same issue right now, but it's because I'm hosting it inside a FrameLayout and LinearLayout and they aren't calling their children's "OnApplyWindowInsets" methods.
Even when fixing that I still get the issue.
But for you, try to only have android:fitsSystemWindows="true" on your CoordinatorLayout, not the rest. I think what you're seeing is a double insets because you have it on almost all your controls.
Related
i am working on a android project where i have to implement collapsing toolbar with tabs . Tabs should contain a normal Relative layout which has 4 textview.
I am successfully able to implement the collapsing toolbar but the problem is when ever i try to scroll upwards holding the tabs i have implemented collapse toolbar is not working. On the same tabs if i use a list view or Grid layout its working fine when i scroll. If i try to use Normal layout's such as Linear or Relative layout i am not able to scroll. is there any way i can fix this without list or grid layout?
below is my code for xml:
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
style="#style/MyStyle"
android:layout_width="match_parent"
app:tabIndicatorColor="#F21757"
app:tabSelectedTextColor="#F21757"
android:layout_height="?actionBarSize"
app:tabTextColor="#android:color/white"
app:layout_anchor="#+id/MyAppbar"
app:layout_anchorGravity="bottom"
android:layout_gravity="bottom"
app:tabGravity="fill"
app:tabMode="scrollable"
android:background="#171C20" />
<android.support.design.widget.AppBarLayout
android:id="#+id/MyAppbar"
android:layout_width="match_parent"
android:layout_height="256dp"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
>
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapse_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="#000000"
android:fitsSystemWindows="true">
<ImageView
android:id="#+id/bgheader"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#drawable/load"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax"
/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?actionBarSize"
app:layout_collapseMode="pin"
/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewPager"
android:paddingBottom="20dp"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
Try this
Step 1. main_activity.xml
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context="com.ncrypted.demoapplications.MainActivity">
<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/collapsingToolBar_hotel_details"
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">
<ImageView
android:id="#+id/img_hotel_details"
android:layout_width="match_parent"
android:layout_height="300dp"
android:contentDescription="#string/strong_image_of_andorid"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:src="#mipmap/ic_launcher"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolBar_hotel_detail"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:theme="#style/ThemeOverlay.AppCompat.Light"
app:layout_scrollFlags="scroll|enterAlways">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_collapseMode="pin"
app:tabGravity="fill"
app:tabMode="fixed" />
</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.v4.view.ViewPager>
Step:2 Create fragments activity
- FragmentActivity1
fragment1.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"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="com.ncrypted.demoapplications.FragmentActivity1">
<!-- TODO: Update blank fragment layout -->
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/hello_blank_fragment1" />
FragmentActivity.java
public class FragmentActivity1 extends Fragment {
public FragmentActivity1()
{
// Required empty public constructor
}
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState)
{
// Inflate the layout for this fragment
return inflater.inflate(R.layout.fragment_fragment_activity1, container, false);
}
}
Step:3 take two other Fragment 2,3 and write code as above
Step:4 MainActivity.java
public class MainActivity extends AppCompatActivity {
private ViewPager pager;
private TabLayout tabLayout;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolBar_hotel_detail);
setSupportActionBar(toolbar);
ViewCompat.setTransitionName(findViewById(R.id.app_bar_layout), "Extra Image");
CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout)
findViewById(R.id.collapsingToolBar_hotel_details); collapsingToolbarLayout.setContentScrimColor(ContextCompat.getColor(getApplicationContext(), R.color.colorPrimary));
collapsingToolbarLayout.setTitle("Collaps");
pager = (ViewPager) findViewById(R.id.viewPager);
ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
adapter.addFragment(new FragmentActivity1());
adapter.addFragment(new FragmentActivity2());
adapter.addFragment(new FragmentActivity3());
pager.setAdapter(adapter);
tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(pager);
tabLayout.getTabAt(0).setText("Tab1");
tabLayout.getTabAt(1).setText("Tab2");
tabLayout.getTabAt(2).setText("Tab3");
}
class ViewPagerAdapter extends FragmentPagerAdapter {
private final List<Fragment> mFragmentList = 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) {
mFragmentList.add(fragment);
}
}
}
I have a viewpager inside in a activity. This activity launch three fragements (not tabbed), as created three different class extends fragment. It is working fine with horizontal scrolling in between fragment.
Now I want to use collapsingToolbar with separate image display in fragment.
Activity - having viewpager, Fragment1 XML having collapsingToolbar, Fragement1 also have 'content_launch.xml' Fragement1 class - toolbar added but while fetching (CollapsingToolbar object it is returning null.
Activity XML as below :
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" tools:context=".activity.LaunchActivity">
<android.support.v4.view.ViewPager
android:id="#+id/launchpager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1" app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</LinearLayout>
Activity Class to launch viewpager
ViewPager viewPager = (ViewPager) findViewById(R.id.launchpager);
viewPager.setAdapter(new LaunchAdapter(getSupportFragmentManager
(),getApplicationContext()));
Fragement1 XML
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/quote_coordinator"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:background="#android:color/white"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="#dimen/detail_backdrop_height"
android:id="#+id/quote_appbar"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/quote_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:expandedTitleTextAppearance="#android:color/transparent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:id="#+id/quote_backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode ="parallax"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center_horizontal" android:orientation="vertical">
<TextView android:id="#+id/quote_main_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/main_title"
android:textColor="#android:color/white"
android:textSize="#dimen/main_title"/>
<TextView android:id="#+id/quote_sub_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/main_sub_title"
android:textColor="#android:color/white"
android:textSize="#dimen/main_sub_title"/>
</LinearLayout>
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/quote_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_quote"/>
</android.support.design.widget.CoordinatorLayout>
Fragment1 Class:
public void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Toolbar quoteToolbar = (Toolbar) getActivity().findViewById(R.id.quote_toolbar);
((AppCompatActivity) getActivity()).setSupportActionBar(quoteToolbar);
final CollapsingToolbarLayout collapsingToolbar = (CollapsingToolbarLayout) getActivity().findViewById(R.id.quote_collapsing_toolbar);
}
collapsingToolbar object returned as null, not able to find any suggestions, can someone suggest possible way to get object..
First thing: you should not use onCreate to initialize view elements in fragment, you should use onCreateView instead. Second one you don't use getActivity() context.
So instead of this code:
public void onCreate(#Nullable Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Toolbar quoteToolbar = (Toolbar) getActivity().findViewById(R.id.quote_toolbar);
((AppCompatActivity) getActivity()).setSupportActionBar(quoteToolbar);
final CollapsingToolbarLayout collapsingToolbar = (CollapsingToolbarLayout) getActivity().findViewById(R.id.quote_collapsing_toolbar);
}
use this:
#Override
public View onCreateView(LayoutInflater inflater, #Nullable ViewGroup container,
#Nullable Bundle savedInstanceState) {
// inflate your layout.
View view = inflater.inflate(R.layout.yourlayout, container, false);
Toolbar quoteToolbar = (Toolbar) view.findViewById(R.id.quote_toolbar);
((AppCompatActivity) view).setSupportActionBar(quoteToolbar);
final CollapsingToolbarLayout collapsingToolbar = (CollapsingToolbarLayout) view.findViewById(R.id.quote_collapsing_toolbar);
return view
}
Best regards and happy new year! :)
I am new to android and have little time to do an assignment, so I figured out I will use "Templates" like Master/Detail Flow to speed up my work. Maybe it wasn't the best decision, since I needed ages to understand given code and even now I still don't understand everything... But now it's too late to start from a scratch.
I have a list of recipes, when a recipe is clicked I can see details (done with the Master/Detail-Template). A recipe has a list of ingredients and a string with description how to prepare it. I wrote a custom adapter to show the list of ingredients in the details fragment and it didn't work at first. The reason was that the ListView I used was placed in the NestedScrollView in the "recipe_detail_activity.xml". This, as I found out, can not work, because both of them have scrolling mechanisms. I tried to replace NestedScrollView with a LinearLayout, as I thought it's only a simple container, but then the ingredients list is rendered at the top of the screen (instead of where the NestedScrollView once was) and the description is not rendered at all.
The way it works now: RecipeDetailActivity.java registers a fragment with recipe_detail_activity.xml as container and RecipeDetailFragment inflates recipe_detail.xml, which contains a ListView for ingredients and a TextView for the description.
I know, I'm obviously lacking of knowladge and should start with easy things, but my professor is pretty demanding... I would be very glad if someone could give me a hint.
recipe_activity_detail.xml:
<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.kalina.kochapp.RecipeDetailActivity"
tools:ignore="MergeRootFrame">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="#dimen/app_bar_height"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:toolbarId="#+id/toolbar">
<android.support.v7.widget.Toolbar
android:id="#+id/detail_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" >
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|start"
android:layout_margin="#dimen/fab_margin"
app:layout_anchor="#+id/recipe_detail_container"
app:layout_anchorGravity="top|end"
app:srcCompat="#android:drawable/stat_notify_chat" />
</android.support.design.widget.CoordinatorLayout>
recipe_detail.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"
android:orientation="vertical">
<ListView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/lv_recipe_ingredients"
style="?android:attr/textAppearanceLarge"
android:padding="16dp"
tools:context="com.kalina.kochapp.RecipeDetailFragment"/>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/recipe_instructions"
style="?android:attr/textAppearanceLarge"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="16dp"
android:textIsSelectable="true"
tools:context="com.kalina.kochapp.RecipeDetailFragment" />
</LinearLayout>
RecipeDetailActivity.java:
protected void onCreate(Bundle savedInstanceState) {
[...]
if (savedInstanceState == null) {
// Create the detail fragment and add it to the activity
// using a fragment transaction.
Bundle arguments = new Bundle();
arguments.putString(RecipeDetailFragment.ARG_ITEM_ID,
getIntent().getStringExtra(RecipeDetailFragment.ARG_ITEM_ID));
RecipeDetailFragment fragment = new RecipeDetailFragment();
fragment.setArguments(arguments);
getSupportFragmentManager().beginTransaction()
.add(R.id.recipe_detail_container, fragment)
.commit();
}
}
RecipeDetailFragment.java:
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.recipe_detail, container, false);
// Show the dummy content as text in a TextView.
if (mItem != null) {
((TextView) rootView.findViewById(R.id.recipe_instructions)).setText(mItem.instructions);
}
return rootView;
}
#Override
public void onViewCreated(View view, #Nullable Bundle savedInstanceState) {
super.onViewCreated(view, savedInstanceState);
ingredients = (ListView)getView().findViewById(R.id.lv_recipe_ingredients);
IngredientsListAdapter ila = new IngredientsListAdapter(this.getContext(), mItem.ingredients);
ingredients.setAdapter(ila);
}
Ok, I fixed it by adding "android:fillViewport="true"" to my NestedScrollView. This way I can use a regular ListView inside of it. I don't know whether this solution is fancy, but it works.
I want gone toolbar Menu when collapsed appBarlayout, but I don't know how can it.
My code is here:
public class MainFragment extends BaseFragment implements Toolbar.OnMenuItemClickListener ...
#Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_main, container, false);
...
}
#Override
public int getMenu() {
return R.menu.search;
}
XML codes :
<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.sepandar.xengine.fragment.MainFragment">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsingToolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/transparent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimaryDark"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<com.sepandar.xengine.views.XTabLayout
android:id="#+id/xTab"
android:layout_width="match_parent"
android:layout_height="200dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
app:tabMode="scrollable"/>
<com.api.common.widget.MyToolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ToolBarStyle"/>
</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"
android:layout_below="#+id/xTab"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
<com.nt.googleplaysearch.views.SearchView
android:id="#+id/search"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="invisible"
app:layout_collapseMode="pin"/>
</android.support.design.widget.CoordinatorLayout>
I want when Collapsed appBarLayout, gone public int getMenu(), and when expand show this public int getMenu().
How can I it?
Use AppBarLayout.OnOffsetChangedListener to get appbar status {expand/collapse},
Then hide appbar menu on offset value change.
use this app:layout_scrollFlags="scroll|enterAlways" insted of app:layout_scrollFlags="scroll|exitUntilCollapsed" in MyToolbar it was work with RecyclerView or NestedScrollView as second element in CoordinatorLayout
wrap your ViewPager in NestedScrollView
I am in a process of changing home activity to include tabs. I use https://github.com/saulmm/CoordinatorExamples as a source. For unknown reason I do not see the tabs in my AppBarLayout. I can see the Fragment content but tab headers are not displayed at all. I use appcompat-v7:23.3.0.
Shortened layout:
<android.support.design.widget.CoordinatorLayout
<android.support.design.widget.AppBarLayout
<android.support.design.widget.CollapsingToolbarLayout
<ImageView ..
<android.support.v7.widget.Toolbar ..
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/main.tabs"
android:layout_width="fill_parent"
android:layout_height="?attr/actionBarSize"
app:tabSelectedTextColor="?android:attr/textColorPrimaryInverse"
app:tabIndicatorColor="?android:attr/textColorPrimaryInverse"
app:tabIndicatorHeight="4dp" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/dashboard.viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
Activity:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_dashboard);
CollapsingToolbarLayout collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.main_collapsing);
collapsingToolbarLayout.setTitle(getString(R.string.app_name));
ViewPager viewPager = (ViewPager) findViewById(R.id.dashboard_viewpager);
viewPager.setAdapter(new TabsAdapter(getSupportFragmentManager()));
TabLayout tabLayout = (TabLayout) findViewById(R.id.main_tabs);
tabLayout.setupWithViewPager(viewPager);
}
class TabsAdapter extends FragmentPagerAdapter {
public TabsAdapter(FragmentManager fm) {
super(fm);
}
public int getCount() {
return 1;
}
public Fragment getItem(int i) {
switch(i) {
case 0: return DashboardHomeFragment.newInstance();
}
return null;
}
public CharSequence getPageTitle(int position) {
return "Home";
}
}
Fragment:
public class DashboardHomeFragment extends Fragment implements View.OnClickListener {
public View onCreateView(LayoutInflater inflater, #Nullable ViewGroup container, #Nullable Bundle savedInstanceState) {
return inflater.inflate(R.layout.fragment_dashboard_home, container, false);
}
public void onActivityCreated(#Nullable Bundle state) {
log.debug("onActivityCreated()");
super.onActivityCreated(state);
}
and its layout:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Hry"
android:textAppearance="#style/TextAppearance.Header"
android:paddingRight="8dp"
android:paddingLeft="8dp"
style="#style/TextComponent.ItemRow"/>
<TextView
android:id="#+id/main.button.puzzle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Najdi výsledek"
android:textAppearance="#style/TextAppearance.Item"
android:drawableRight="#drawable/ic_arrow_forward_24dp"
style="#style/TextComponent.ItemRow.Selectable"/>
There is a second problem but I will post it in separate question linked to this question.
Update:
It was caused by CoordinatorLayout misconfiguration. I changed:
android:layout_height="150dp"
to
android:layout_height="wrap_content"
and the tabs appeared suddenly.
According to the guidelines of Android and the material design, it is correct to use the coordinatorLayout.
The appBarLayout should be max 256dp and inside we find the toolbar and the views that you need.
If you want the views collapsing insert into collapsingToolbarLayout.
If you want the toolbar expandable will be inserted inside the collapsingToolbarLayout.
The tabLayout often is insert into appBarLayout but out collapsingToolbarLayout.
The sum of views height is equals at appBarLayout height (or use wrap_content for appBarLayout).
This is an example of expandable toolbar with tabLayout, in this case appBarLayout has a fixed height but you can use wrap_content.
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="256dp"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="202dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="#color/your_color"
android:fitsSystemWindows="true">
<--Your views-->
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:gravity="top"
app:titleMarginTop="13dp"
android:minHeight="?attr/actionBarSize"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:layout_collapseMode="pin"
/>
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
android:background="#color/your_color"
app:tabSelectedTextColor="#color/your_color"
app:tabTextColor="#color/your_color"
app:tabIndicatorColor="#color/your_color"
app:tabMode="fixed"
app:tabGravity="fill"
/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
</android.support.design.widget.CoordinatorLayout>