After declaring .NoActionBar in the theme, as well as putting the toolbar in the layout, my toolbar does not show. What I end up getting is exactly what you'd expect when declaring no action bar -- no action bar. Here is the layout:
activity_home.xml:
<include
layout="#layout/app_bar_home"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_home"
app:menu="#menu/activity_home_drawer"/>
app_bar_home.xml
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_home"/>
In your activity you have to initialize your toolbar(if you've not done it)
Toolbar toolbar = (Toolbar)findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
Related
i am using collapsing toolbar with toolbar only here my purpose
is to use default parallex feature for toolbar,but the problem i am facing that back arrow and title in expanded form overlapping each other i tried to set expandedtitlegravity to bottom didn't work either
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="140dp"
android:background="#color/white"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:fitsSystemWindows="true"
app:collapsedTitleTextAppearance="#style/SavedCollapsedAppBar"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginEnd="20dp"
app:expandedTitleMarginStart="20dp"
app:expandedTitleTextAppearance="#style/SavedExpandedAppBar"
app:layout_scrollFlags="scroll|exitUntilCollapsed|enterAlways">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/white"
android:fontFamily="sans-serif-medium"
android:theme="#style/SavedToolbarColoredBackArrow"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme"
app:titleTextAppearance="#style/SavedCollapsedAppBar"
app:titleTextColor="#color/black" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
It's seems like, the problem is with the Toolbar.
set app:contentInsetStart in Toolbar i.e.
<android.support.v7.widget.Toolbar
...
app:contentInsetStart="72dp"
It may solve the problem.
I'm trying to make collapsing title to center by app:collapsedTitleGravity="center" in CollapsingToolbarLayout but actually title not center. I saw suspicious unnamed-view between title and up button
Is it issue form design support lib?
Is there any way to overcome this?
I saw a person who occured like me in here.
Here is screen shot
This is suspicious unnamed-view
Here is activity_main
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".ui.profile.detail.ProfileDetailActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/abl_profile"
android:layout_width="match_parent"
android:layout_height="200dp"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/ctl_profile"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="?attr/colorPrimary"
android:layout_marginTop="52dp"
app:expandedTitleMarginStart="16dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap"
app:collapsedTitleGravity="center_horizontal">
<android.support.v7.widget.AppCompatImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:src="#mipmap/ic_launcher"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_profile" />
</android.support.design.widget.CoordinatorLayout>
In MainActivity.java
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
style.xml is
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"/>
This will resolve the issue.
android:contentInsetStart="0dp"
android:contentInsetLeft="0dp"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
There is padding reserved so that your title is not next to toolbar icon.
There is an attribute expandedTitleGravity that you can use with the CollapsingToolbarLayout to center the expanded title text. Add this to your CollapsingToolbarLayout
app:expandedTitleGravity="bottom|center_horizontal"
I am using an app theme for my application where action bar flag is true for that theme. And all of my activity are showing the same action bar.
How can I use CollapsingToolbarLayout for any specific activity instead of using main app theme action bar?
I have added below code in my activity class:
final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
CollapsingToolbarLayout collapsingToolbar =
(CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
collapsingToolbar.setTitle(cheeseName);
And this is my layout:
<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"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp">
<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" />
</android.support.design.widget.CollapsingToolbarLayout>
But it's not working, My activity always showing the app theme action bar.
Try this,
xml file
<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="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:src="#drawable/your_image"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:popupTheme="#style/ThemeOverlay.AppCompat.Dark"
android:title="Collapsing Toolbar"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
try this: in your xml layout...
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="218dp"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<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|enterAlways|enterAlwaysCollapsed">
<ImageView
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/google_thumb"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.7" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
//this is the layout that you want under collapsing toolbar
<include layout="#layout/content_scrolling" />
</android.support.design.widget.CoordinatorLayout>
In your Activity
public class Toolbar_activity extends AppCompatActivity {
CollapsingToolbarLayout collapsingToolbar;
Toolbar toolbar;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.your_layout);
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
collapsingToolbar = (CollapsingToolbarLayout) findViewById(R.id.toolbar_layout);
collapsingToolbar.setTitle("TITLE");
}
}
then in your manifest:
<activity
android:name=".Toolbar_activity"
android:label="#string/app_name"
android:screenOrientation="portrait"
android:theme="#style/AppTheme.NoActionBar"></activity>
#0xAliHn,
Its because your not applying any theme to CollapsingToolbarLayout
just create a custome theme that you want and apply it to your AppBarLayout
other wise it will inherit the same theme that you have used inside your Androidmenifest.xml
If you use CollapsingToolbarLayout, you need set Toolbar inside it as action bar. you can work around for this situation, hide your action bar(in this case main toolbar) you use for all activity. After that use your code above
final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
Sorry if I don't understand what do you want correctly.
you should set the new theme in mainifest like this
<activity android:name=".your activity" android:theme="xxxx"></activity>
I want to use the hamburger menu and tabs below. Actually I use the CoordinatorLayout for the hamburger menu and the AppbarLayout (with a toolbar and the Tablayout) for the tabs. Both parts work - but when I combine them, I can't see the hamburger button- but the menu is there, I can swipe it (the bar is there too, but without the button and the activity title).
thats my main xml-file
<include
layout="#layout/app_bar_hamburger" />
<include
layout="#layout/app_bar_tabs"/>
<android.support.design.widget.NavigationView
android:id="#+id/nav_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:fitsSystemWindows="true"
app:headerLayout="#layout/nav_header_hamburger"
app:menu="#menu/activity_hamburger_drawer" />
</android.support.v4.widget.DrawerLayout>
the app_bar_hamburger:
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar_hamburger"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_hamburger" />
and the app_bar_tabs
<android.support.design.widget.AppBarLayout
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_tabs"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed"
app:tabGravity="fill"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
Try this:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); // use whatever id you have for your toolbar
setSupportActionBar(toolbar);
getSupportActionBar().setHomeButtonEnabled(true);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_drawer);
getSupportActionBar().setTitle("title");
EDIT: The problem is happening because you have multiple AppBarLayout and Toolbar in the same layout. Don't include layout="#layout/app_bar_hamburger" in your main.xml. Only include `layout="#layout/app_bar_tabs". And it should all work fine.
I have been having a problem with the App Bar in the new Material Design Support Library. My issue is that the CollapsingToolbarLayout is at a different elevation than that of the top part of the Toolbar. Here is my XML code for the layout:
<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:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:fitsSystemWindows="true"
android:elevation="25dp">
<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"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp"
android:fitsSystemWindows="true">
<com.example.example.widgets.CustomImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax"/>
<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" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/scroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.CardView
...>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
.../>
<TextView
.../>
</LinearLayout>
</android.support.v7.widget.CardView>
</FrameLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
... />
Here is my onCreate Java code for the Activiy:
#Override protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_write);
setSupportActionBar((Toolbar) findViewById(R.id.toolbar));
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setTitle("App Name");
collapsingToolbarLayout = (CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
collapsingToolbarLayout.setTitle("Title");
collapsingToolbarLayout.setExpandedTitleTextAppearance(R.style.LargeText);
}
Finally, here is a screenshot of my problem:
Again the issue is the bottom half of the bar (The collapsing part) not being at the same elevation. Any advice on how to fix this would be great!
Thanks!
EDIT:
Here is my updated activity image:
All content except the title is now gone
I think the theme you're applying to this Activity already has an ActionBar. Use NoActionBar themes if you want to use ToolBar and want to set it as an ActionBar.
When you use a CollapsingToolbar you don't have to set up the title in the ActionBar, it's only setted in CollapsingToolbar
//This one is not needed
//getSupportActionBar().setTitle("App Name");
collapsingToolbar.setTitle("App Name");