Custom image instead of logo in ActionBar/ActionBarSherlock

Question

How can I change the default logo icon of an ActionBar to be a custom image? Similar as how it works on Whatsapp?

Answer 1

The ActionBar uses the android:logo attribute of your manifest, if one is provided. That lets you use separate drawable resources for the icon (Launcher) and the logo (ActionBar, among other things).

---

So you should add this tag into manifest like ..

<application
    android:logo="@drawable/custom_image"

Update :

You can use ActionBar.setLogo() for runtime. Two versions are there setLogo(int resId) and setLogo(Drawable logo).

Read Define custom Logo for ActionBar (different than Logo) in XML? which will help you to define some styles also.

Answer 2

The simplest technique is to use setIcon(R.drawable.icon_name) Similarly you can do with the Title and you can also set the date in the action bar subtitle.

ActionBar ab= getActionBar();
ab.setTitle("Aries");
ab.setSubtitle(dateFormat.format(date));
ab.setIcon(R.drawable.aries3d);

Answer 3

You need to customize the ActionBarSherlock. Include an xml called "styles_mytheme.xml" in values folder:

<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:android="http://schemas.android.com/apk/res/android">

    <style name="Theme.Styled" parent="@style/Theme.Sherlock.Light">
        <item name="actionBarStyle">@style/CustomActionBarStyle</item>
        <item name="android:actionBarStyle">@style/CustomActionBarStyle</item>
        <item name="android:actionBarItemBackground">@drawable/overflow_selector</item>
        <item name="android:itemBackground">@drawable/overflow_selector</item>
        <item name="android:actionBarWidgetTheme">@style/CustomActionOverflowDropDownText</item>
        <item name="actionBarWidgetTheme">@style/CustomTitleColorBar</item>
        <item name="android:icon">@drawable/ic_nav_home_back</item>
        <item name="android:homeAsUpIndicator">@drawable/ic_nav_back</item>
        <item name="icon">@drawable/ic_nav_home_back</item>
        <item name="dropDownListViewStyle">@style/DropDownStyles</item>
        <item name="android:dropDownListViewStyle">@style/DropDownStyles</item>
    </style>

    <style name="CustomActionBarStyle" parent="@style/Widget.Sherlock.ActionBar">

        <!-- define background for action bar (sets default for all parts of action bar - main, stacked, split) -->
        <item name="android:background">@drawable/navigation</item>
        <item name="background">@drawable/navigation</item>
        <item name="android:titleTextStyle">@style/MyTheme.ActionBar.TitleTextStyle</item>
        <item name="titleTextStyle">@style/MyTheme.ActionBar.TitleTextStyle</item>
    </style>

    <!-- Style for the color title bar -->
    <style name="CustomTitleColorBar" parent="@style/TextAppearance.Sherlock.Widget.ActionBar.Title">
        <item name="android:textColor">@color/white</item>
        <item name="android:textSize">12sp</item>
    </style>

    <style name="CustomActionOverflowDropDownText" parent="Widget">
        <item name="android:textColor">@color/white</item>
    </style>

    <style name="MyTheme.ActionBar.TitleTextStyle" parent="@style/TextAppearance.Sherlock.Widget.ActionBar.Title">
        <item name="android:textColor">@color/white</item>
    </style>

    <style name="My_Theme" parent="Theme.Sherlock">
        <item name="android:popupMenuStyle">@style/MyApp.PopupMenuStyle</item>
        <item name="popupMenuStyle">@style/MyApp.PopupMenuStyle</item>
    </style>

    <style name="MyApp.PopupMenuStyle" parent="Widget.Sherlock.ListPopupWindow">
        <item name="android:popupBackground">@drawable/navigation</item>
    </style>

    <style name="DropDownStyles" parent="Widget.Sherlock.ListView.DropDown">
        <item name="android:divider">@null</item>
        <item name="android:listSelector">@drawable/overflow_selector</item>


    </style>

</resources>

Now include this xml in the code:

setTheme(Theme.Styled);

Now change these three lines, when you change these three lines, the icon will change:

  <item name="android:icon">@drawable/ic_nav_home_back</item>
    <item name="android:homeAsUpIndicator">@drawable/ic_nav_back</item>
    <item name="icon">@drawable/ic_nav_home_back</item>

Answer 4

if(getSupportActionBar() != null) {
        getSupportActionBar().setDisplayUseLogoEnabled(true);
        getSupportActionBar().setDisplayShowHomeEnabled(true);
        getSupportActionBar().setIcon(R.drawable.add_contact);
    }