Search code examples
androidandroid-support-libraryandroid-toolbarandroid-appcompat

AppCompatActionBar Won't Load Style from styles.xml


I'm attempting to implement AppCompat action bar in my Android app, but I cannot get the style to load. It simply shows the default Holo.Light actionbar instead of taking the colors/styling I define in styles.xml. I've looked at the documentation and I believe I am doing everything correctly. Can anyone tell me what I'm doing wrong?

I am basing this code on the GitHub repository LiveoNavigationBar (https://github.com/rudsonlive/Navigation-Drawer-ActionBarCompat) except I am writing this app for Android API 15+.

This is my AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="net.ie2o.appname" >

<application
    android:allowBackup="true"
    android:icon="@drawable/ic_launcher"
    android:label="@string/app_name"
    android:theme="@style/ie2oActionBarTheme" >

    <activity
        android:name=".main.ActivityMain"
        android:label="@string/app_name"
        android:exported="true">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>

    <activity
        android:name=".login.ActivityLogin"
        android:label="@string/app_name"
        android:windowSoftInputMode="adjustResize|stateVisible" >
    </activity>

    <activity
        android:name=".settings.ActivitySettings"
        android:label="@string/title_activity_settings"
        android:parentActivityName=".main.ActivityMain" >
        <meta-data
            android:name="android.support.PARENT_ACTIVITY"
            android:value=".main.ActivityMain" />
    </activity>

</application>

This is my styles.xml (within values folder, I do not have a values-v11 or values-v14 because my app is targeting API 15+)

<resources xmlns:android="http://schemas.android.com/apk/res/android">

<!--
    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.Holo.Light.DarkActionBar">
    <!-- API 14 theme customizations can go here. -->
</style>

<!-- Application theme. -->
<style name="AppTheme" parent="AppBaseTheme">
    <!-- All customizations that are NOT specific to a particular API-level can go here. -->
</style>

<style name="ie2oActionBarTheme" parent="@style/Theme.AppCompat.Light.DarkActionBar">
    <item name="actionBarStyle">@style/ie2oActionBar</item>
</style>

<style name="ie2oActionBar" parent="@style/Widget.AppCompat.ActionBar">
    <item name="titleTextStyle">@style/ie2o.TitleTextStyle</item>
    <item name="subtitleTextStyle">@style/ie2o.SubTitleTextStyle</item>
    <item name="background">@color/blue</item>
</style>

<style name="ie2o.TitleTextStyle" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Title">
    <item name="android:textColor">@color/white</item>
    <item name="android:textStyle">normal</item>
</style>

<style name="ie2o.SubTitleTextStyle" parent="@style/TextAppearance.AppCompat.Widget.ActionBar.Subtitle">
    <item name="android:textColor">@color/white</item>
    <item name="android:textStyle">normal</item>
</style>

<!-- Style user drawer -->
<style name="text_view_title_list" parent="android:Widget.TextView">
    <item name="android:layout_width">match_parent</item>
    <item name="android:layout_height">wrap_content</item>
    <item name="android:background">@drawable/drawer_bg_black_transparent</item>
    <item name="android:ellipsize">end</item>
    <item name="android:padding">4dp</item>
    <item name="android:layout_gravity">bottom</item>
</style>

</resources>

And here is my build.gradle file

apply plugin: 'com.android.application'

android {
    compileSdkVersion 21
    buildToolsVersion "21.1.1"

    defaultConfig {
        applicationId "net.ie2o.appname"
        minSdkVersion 15
        targetSdkVersion 21
        versionCode 1
        versionName "1.0"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    compile 'com.android.support:support-v4:21.0.+' // (I have tried it with and without this line, the code I referenced has this line, but the documentation does not)
    compile 'com.android.support:appcompat-v7:21.0.+'
    compile 'com.google.android.gms:play-services:6.5.87'
}

Solution

  • You have to change your style, using a Theme.AppCompat theme (Light,DartActionBar, NoActionBar..)

     <!-- Base application theme. -->
    <style name="AppBaseTheme" parent="Theme.AppCompat.Light">   
    
        <!-- colorPrimary is used for the default action bar background -->
        <item name="colorPrimary">@color/primary</item>
    
        <!-- colorPrimaryDark is used for the status bar -->
        <item name="colorPrimaryDark">@color/primary_dark</item>
    
        <!-- colorAccent is used as the default value for colorControlActivated
                 which is used to tint widgets -->
        <item name="colorAccent">@color/accent</item>
    </style>
    

    Also, if you would like to customize the text and other ui elements inside the Toolbar you can use something like this in your layout:

    <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_height="wrap_content"
            android:layout_width="match_parent"
            android:minHeight="?attr/actionBarSize"
            app:theme="@style/ActionBarThemeOverlay"
            android:background="?attr/colorPrimary" />
    

    define the theme for your toolbar:

      <style name="ActionBarThemeOverlay" parent="">
            <item name="android:textColorPrimary">#fff</item>
            <item name="colorControlNormal">#fff</item>
            <item name="colorControlHighlight">#3fff</item>
        </style>
    

    and finally in your Activity:

    Toolbar toolbar = (Toolbar) findViewByid(R.id.toolbar);
    setSupportActionBar(mActionBarToolbar);