Is There a way to make compatible toolbar in 4.0 and 5.0 android app?
I'm developing an android app and my activity extends AppCompatActivity and I'm using 'com.android.support:appcompat-v7:23.2.0', but in 4.0 versione toolbar doesn't show and actionbar is null.
I do not know how to fix without totally changing the code.
this is my toolbar code xml:
<android.support.design.widget.AppBarLayout
xmlns:compat="http://schemas.android.com/apk/res-auto"
compat:showAsAction="always"
android:layout_width="match_parent"
android:layout_height="match_parent"
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:titleTextColor="#color/maroon"
android:textColorPrimary="#color/maroon"
android:textColorSecondary="#color/maroon"
android:actionMenuTextColor="#color/maroon"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:theme="#style/ToolBarStyle"/>
</android.support.design.widget.AppBarLayout>
..activity code:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
....style code:
<!-- ToolBar -->
<style name="ToolBarStyle" parent="Theme.AppCompat">
<item name="android:textColorPrimary">#color/maroon</item>
<item name="android:textColorSecondary">#color/maroon</item>
<item name="actionMenuTextColor">#color/maroon</item>
<item name="drawerArrowStyle">#style/DrawerArrowStyle</item>
<item name="android:background">#color/tw__solid_white</item>
</style>
<style name="AppTheme_noAction" parent="#style/Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowActionBarOverlay">false</item>
<item name="windowNoTitle">true</item>
<item name="drawerArrowStyle">#style/DrawerArrowStyle</item>
</style>
Thanks.
Related
I'm trying to change the textcolor in toolbar to white but the color wont change.
Things i've tried:
1- Changing the app:theme=app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
2- trying to do it programmatically: toolbar.setTitleTextColor(0xFFFFFFFF);
3- The last one which code appears under:
Custom style: ToolBarstyle:
Res/style
<style name="ToolBarStyle" parent="Theme.AppCompat">
<item name="android:textColorPrimary">#android:color/white</item>
<item name="android:textColorSecondary">#android:color/white</item>
<item name="actionMenuTextColor">#android:color/white</item>
<item name="drawerArrowStyle">#style/DrawerArrowStyle</item>
</style>
Res/Layout
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:theme="#style/ToolBarStyle"
app:popupTheme="#style/ThemeOverlay.AppCompat"
app:layout_collapseMode="pin" />
Java file:
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
/* Toolbar */
getSupportActionBar().setTitle("Nostrils");
toolbar.setTitleTextColor(0xFFFFFFFF);
// Back icon
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
initNavigationDrawer();
}
Photo from the emulator:
https://i.imgur.com/zkp24dK.png
Change your toolbar to
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimaryDark"
app:popupTheme="#style/AppTheme.PopupOverlay"
android:id="#+id/toolbar">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="start"
android:textSize="16dp"
android:textStyle="bold"
android:maxLines="1"
android:ellipsize="end"
android:textColor="#color/white"
android:layout_marginRight="?attr/actionBarSize"
android:gravity="center"
android:id="#+id/welcome_textView"/>
</android.support.v7.widget.Toolbar>
Access this textView
Toolbar toolbar = (Toolbar) view.findViewById(R.id.toolbar);
TextView textToolHeader = (TextView) toolbar.findViewById(R.id.welcome_textView);
textToolHeader.setTextColor(getResources().getColor(R.color.your_color));
Thanks for the answer but since its part if a collapsing toolbar i added this code (and it worked):
app:collapsedTitleTextAppearance="#style/CollapsedAppBar"
app:expandedTitleTextAppearance="#style/ExpandedAppBar"
to :
<android.support.design.widget.CollapsingToolbarLayout
with:
<style name="ExpandedAppBar" parent="#android:style/TextAppearance">
<item name="android:textSize">24sp</item>
<item name="android:textColor">#android:color/white</item>
</style>
<style name="CollapsedAppBar" parent="#android:style/TextAppearance">
<item name="android:textColor">#android:color/white</item>
</style>
https://stackoverflow.com/a/25162981/4409113
Theme.AppCompat is visually the same as Theme.Holo (dark)
So, just change parent:
<style name="ToolBarStyle" parent="Theme.AppCompat">
To:
<style name="ToolBarStyle" parent="Theme.AppCompat.Light.NoActionBar">
Because you already have a Toolbar in your layout and this theme will make the color white.
For the toolbar set:
app:titleTextColor="#android:color/white"
or in your app theme set:
<item name="android:textColorPrimary">#android:color/white</item>
I am new to Android and working on my first android app. For my app I need a transparent Action Bar with a Navigation Drawer button. Everything is working fine except the color of the Action Bar. It is having blue color instead of transparent. I have tried various ways to make it transparent but its still blue. Can someone please help me out with my code:
custom_navigation_bar.xml:
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<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"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
styles.xml:
<resources>
<!-- Themes for Navigation Drawer -->
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="AppTheme.AppBarOverlay"
parent="ThemeOverlay.AppCompat.Dark.ActionBar">
<item name="android:background">#00000000</item>
</style>
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light">
<item name="android:background">#00000000</item>
</style>
</resources>
Java Code Snippet:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
//Setting Transparent Color for Action Bar
ActionBar actionBar = getSupportActionBar();
actionBar.setBackgroundDrawable(new ColorDrawable(Color.parseColor("#00000000")));
You can just set the toolbar background to transparent :
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#00000000"/>
you have one item in base theme windowActionBarOverlay set it to true and set action bar color to transparent.
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="android:textColorPrimary">#color/text_color</item>
<item name="colorPrimary">#android:color/transparent</item>
<item name="windowActionBarOverlay">true</item>
</style>
</resources>
I'm using Android Studio for programming. Target SDK is 23 and Minimum SDK is 15
I'm trying to remove the shadow between my actionbar and my sliding tab layout. But I'm not able to.
Note : The shadow is only visible in Android 5 and upper.
I have used <item name="elevation">0dp</item> and getSupportActionBar().setElevation(0);
But still it doesn't work...
My Style.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light">
<item name="elevation">0dp</item>
</style>
My Style V21
<resources>>
<style name="AppTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
</style>
My MainActivity.java onCreateCode:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setElevation(0);
....
You're missing the prefix in your style.
<item name="android:elevation">0dp</item>
That said you could also set it directly on your AppBarLayout
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:elevation="0dp"
android:theme="#style/AppTheme.AppBarOverlay">
Or what I like to do is move the SlidingTabLayout into the AppBarLayout so the shadow appears below it:
<android.support.design.widget.AppBarLayout
android:layout_height="wrap_content"
android:layout_width="match_parent"
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"
/>
<com.ccswe.SmokingLog.views.widgets.SlidingTabLayout
android:id="#+id/sliding_tabs"
android:layout_width="wrap_content"
android:layout_height="#dimen/tab_layout_height"
/>
</android.support.design.widget.AppBarLayout>
Try adding setting the elevation to 0 with the help of the support library
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp"
android:theme="#style/AppTheme.AppBarOverlay">
I'm using AppCompat for a backport of Material design on pre-Lollipop devices. Somehow, the support toolbar overlays the status bar and casts a shadow on it, as if the status bar is behind the toolbar. Tested on my Android 5.0.2 phone.
Here's the code:
Activity layout
<android.support.design.widget.CoordinatorLayout
android:id="#+id/base_root"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/base_appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/PGTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/base_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/PGTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>
Theme-v21
<style name="PGTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/base_color_2</item>
<item name="colorPrimaryDark">#color/base_color_1</item>
<item name="colorAccent">#color/base_color_2</item>
<item name="android:colorButtonNormal">#color/base_color_2</item>
<item name="android:textViewStyle">#style/PGTheme.TextView</item>
<item name="android:editTextStyle">#style/PGTheme.EditText</item>
<item name="android:buttonStyle">#style/PGTheme.Button</item>
</style>
<style name="PGTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:statusBarColor">#android:color/transparent</item>
</style>
Any idea why this happens?
In your Style remove the statusBarColor:
<item name="android:statusBarColor">#android:color/transparent</item>
So your theme would be:
<style name="PGTheme.NoActionBar">
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
</style>
Hope this helps.
I just updated android.support:appcompat lib to 22.1.1.
Toolbar is visible on a Lollipop device but not on a 4.X device.
I have even tried extending AppCompatActivity, but still no luck. If anything else is required please let me know.
Here is my project styles and base activity xml file.
styles.xml
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/primary</item>
<item name="colorPrimaryDark">#color/primarydark</item>
<item name="colorAccent">#color/primary</item>
<item name="colorControlHighlight">#color/primary</item>
<item name="drawerArrowStyle">#style/DrawerArrowStyle</item>
<item name="windowActionModeOverlay">true</item>
<item name="windowActionBarOverlay">true</item>
<item name="android:windowActionBarOverlay">true</item>
<item name="android:windowBackground">#color/activity_bg</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
activity_base.xml
<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:id="#+id/fulllayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.v7.widget.Toolbar
android:minHeight="?attr/actionBarSize"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/toolbar"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
android:background="#color/primary">
</android.support.v7.widget.Toolbar>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/container">
</FrameLayout>
</RelativeLayout>
Update :
Issue is with layout inflated in container part. it is overlapping toolbar so i have removed all views and it worked.
Thanks all...