This question already has answers here:
How do I change the android actionbar title and icon
(17 answers)
Closed 7 years ago.
Here's my styles.xml file.
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary4</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark4</item>
<item name="colorAccent">#color/colorAccent2</item>
<item name="android:fontFamily">fonts/HelveticaNeue-Light.ttf</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" />
<style name="AppTheme.Widget" />
<style name="AppTheme.Widget.TextView" parent="android:Widget.Holo.Light.TextView">
<item name="android:fontFamily">fonts/HelveticaNeue-Light.ttf</item>
</style>
</resources>
And this is the layout file that contains the toolbar.
<?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=".HomeActivity">
<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" />
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_home" />
</android.support.design.widget.CoordinatorLayout>
So, The toolbar is using the AppTheme.PopOverlay theme which is defined in the styles.xml file.
Currently the title on the toolbar is set as the default app name, and I wanted to change the title, so I already tried to include the <item name="android:text">#string/customtitle</item> attribute in the AppTheme.PopOverlay theme. It didn't work.
Now started to wonder, how is the title defined by default as the app name, and how I can change it.
Added
What I want to find out fundamentally from this question is, how the title is set by default with the app name in the toolbar even though it is not defined in any parts of the XML files, AndroidManifest.xml or in the codes.
You can change the title in two ways:
Programmatically (in your Activity):
setTitle("Title");
XML (in your Manifest):
<activity android:name=".SomeClass" android:label="Title" />
To change the font of the actionbar you can consider this post: How to Set a Custom Font in the ActionBar Title?
You can change title by this code
setTitle("Your Tittle");
You can do it by:
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.setTitle("Hi!");
Related
I'm trying to set up my toolbar with white text and white dots menu, white popup and black text inside the popup, and trasparent background.
I'm also get it, but the popup is black and the test inside it's white. How could I change it?
That's my code:
styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- 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.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar"/>
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
menu.xml
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.example.bacci.testapp.MainActivity">
<item
android:id="#+id/action_settings"
android:title="Info"
android:orderInCategory="100"
app:showAsAction="never" />
mainActivity.xml
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?attr/actionBarSize"
android:theme="#style/AppTheme.AppBarOverlay"
android:popupTheme="#style/AppTheme.PopupOverlay"
>
</android.support.v7.widget.Toolbar>
And the MainActivity class:
Toolbar toolbar = findViewById(R.id.toolbar);
toolbar.setTitle("RateMe.ai");
setSupportActionBar(toolbar);
Actually the toolbar is trasparent, the text and the menu icon is white, but the popup where I have the option is black with white text. I want it white with black text.
Here a picture of the actual situation
I recently added a CoordinatorLayout to my Application. How do i remove blue box, which is showing below the other toolbar. I already tried to remove the appbar layout and the navigation view, but they did not result in any changes.
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.example.recyclerviewtutorial.ChatListActivity">
<android.support.design.widget.CoordinatorLayout
android:id="#+id/layout_main"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="0dp">
<android.support.v7.widget.Toolbar
android:id="#+id/my_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/rv_chats"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="#dimen/fab_margin"
app:srcCompat="#drawable/ic_info_black_24dp"/>
</android.support.design.widget.CoordinatorLayout>
<android.support.design.widget.NavigationView
android:id="#+id/navigation"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
/>
</LinearLayout>
Edit Styles.xml was added.
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- 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" />
</resources>
Just some random text to meet the posting requirements
Edit Problem is solved ty
I added an ID to the AppBarLayout
android:id="#+id/appbar_nav"
and disabled it in the onCreate Method of the Activity.
AppBarLayout mAppBarLayout = findViewById(R.id.appbar_nav);
mAppBarLayout.setVisibility(View.GONE);
Set this theme to your styles.xml file.
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
You can do this in style.xml
<style name="AppTheme.NoActionBar">
<!-- <item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>-->
<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowDrawsSystemBarBackgrounds">true</item>
<item name="android:navigationBarColor">#android:color/transparent</item>
<item name="android:windowTranslucentNavigation">true</item>
</style>
and give this style to activity in manifest like,
<activity
android:name=".MainActivity"
android:theme="#style/AppTheme.NoActionBar"
android:label="#string/app_name">
</activity>
EXTRA :
if you want transparent status bar than add java code like,
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
Window w = getWindow(); // in Activity's onCreate() for instance
w.setFlags(WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS, WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS);
}
setContentView(R.layout.activity_login);
}
You should set below theme as your application theme or as an Activity theme
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
I am developing application which have multi screen support. I have completed all remain layout as per device size but I am unable to increase Actionbar/Toolbar size for same. its looking small in 10inch tablet. How can I increase size of toolbar text ?
My Style XML is like below
<resources>
<!--
Base application theme, dependent on API level. This theme is replaced
by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
-->
<style name="AppBaseTheme" parent="android:Theme.Light">
</style>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- 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.FullScreen" parent="noActionBar">
<item name="android:windowFullscreen">true</item>
</style>
<style name="noActionBar" parent="Theme.AppCompat.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
<style name="OptionDialog" parent="Theme.AppCompat.Dialog.Alert">
<item name="colorAccent">#C5CAE9</item>
<item name="android:background">#3F51B5</item>
<item name="android:textColor">?android:attr/textColorPrimaryInverseDisableOnly</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />
<style name="SelectableItemTheme">
<item name="colorControlHighlight">#888888</item>
</style>
<style name="SelectableItemBackground">
<item name="android:theme">#style/SelectableItemTheme</item>
<item name="android:background">?attr/selectableItemBackground</item>
</style>
<style name="HomeTabTextStyle"
parent="TextAppearance.Design.Tab">
<item name="android:textSize">35sp</item>
<item name="android:textStyle">bold</item>
</style>
<!-- Action Bar Style -->
and my layout xml which including toolbar is like below
<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="110dp"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
app:tabTextAppearance="#style/HomeTabTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.design.widget.AppBarLayout>
My Java Code is like below
setContentView(R.layout.activity_home);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
setTitle("My App Name");
Toolbar is like any other layout; that means you can add elements inside it like this:
<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">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="25sp"
android:textColor="#color/colorText"
android:gravity="center|center_horizontal"
android:text="#string/title_activity_my_activity"/>
</android.support.v7.widget.Toolbar>
This will change the title size of your toolbar title; as you wish.
I hope this helps you achieve your goal! Good luck.
UPDATE
If you want to manually set the activity title, you can set an id for the text view like this:
<TextView
android:id="#+id/title_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="25sp"
android:textColor="#color/colorText"
android:gravity="center|center_horizontal"
android:text="#string/title_activity_my_activity"/>
Then like usual,
TextView title = (TextView) toolbar.findViewById(R.id.title_text);
title.setText("New Title");
I hope this helps!
My app is working perfectly but I have this problem that my toolbar button colour changes in version 21-22 to black.Here is the example how it looks normal:
And here is the problematic part on 21-22:
Here is my Toolbar and my style:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="AppTheme.Base">
</style>
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/white</item>
<item name="android:windowTranslucentStatus">true</item>
</style>
<style name="CustomToolBarTheme" parent="ThemeOverlay.AppCompat.Light">
<item name="android:textColorPrimary">#color/white</item>
<item name="android:textColorSecondary">#color/white</item>
<item name="colorAccent">#color/white</item>
<item name="android:windowTranslucentStatus">true</item>
</style>
<style name="Toolbar.TitleText" parent="TextAppearance.Widget.AppCompat.Toolbar.Title">
<item name="android:textSize">18sp</item>
</style>
</resources>
The toolbar:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar 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="wrap_content"
android:background="#color/colorPrimary"
android:paddingTop="#dimen/app_bar_top_padding"
app:theme="#style/CustomToolBarTheme">
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:maxLines="1"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:textSize="19dp" />
</android.support.v7.widget.Toolbar>
I have tried to change the colour with SpannableString but it's not working.
Have you tried <item name="colorControlNormal">#color/colorwhatever</item> in your styles? (It should be in ToolBar text style)
I found the answer,it's in the toolbar just add the theme and the popupTheme like in my code and it will work.And you don't need that style andy more:
<android.support.v7.widget.Toolbar 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="wrap_content"
android:background="#color/colorPrimary"
android:paddingTop="#dimen/app_bar_top_padding"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
I need all the icons and text in the toolbar to be light, and the overflow menu, the spinner, and the drawer (not shown in image) to all have a light backgrounds and dark text. (Using the android themes)
Why is only the overflow doing it how I'd like, but the drawer (not shown) and the spinner staying dark?
Any ideas help! (even though I feel I've tried everything)
Must be IDENTICAL to this
styles.xml
<resources>
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#color/teal500</item>
<item name="colorPrimaryDark">#color/teal700</item>
<item name="colorAccent">#color/accent</item>
<item name="windowActionBar">false</item>
<item name="actionBarWidgetTheme">#style/Theme.AppCompat.Light</item>
</style>
</resources>
toolbar.xml
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
...
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>