How to add imageview on right hand side of action bar?

Question

I want to add image view on action bar right hand side.I tried to do that but i couldn't. Can anyone help me?

This is my image view xml

 <ImageView
        android:id="@+id/imageView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:src="@drawable/adnace_search_i" />

This is the image of action bar that i want to create.

enter image description here

Use custom actionbar layout . see http://www.vogella.com/tutorials/AndroidActionBar/article.html — keshav, Jan 17 '14 at 05:59
[check this][1] and use linear layout with weightsum. like [this answer][2] [1]: http://stackoverflow.com/a/16029214/1168654 [2]: http://stackoverflow.com/a/4517358/1168654 — Dhaval Parmar, Jan 17 '14 at 06:13

score 63 · Accepted Answer · edited Jul 23 '21 at 18:05

63

try this...

ActionBar actionBar = getActionBar();
actionBar.setDisplayOptions(actionBar.getDisplayOptions()
        | ActionBar.DISPLAY_SHOW_CUSTOM);
ImageView imageView = new ImageView(actionBar.getThemedContext());
imageView.setScaleType(ImageView.ScaleType.CENTER);
imageView.setImageResource(R.drawable.adnace_search_i);
ActionBar.LayoutParams layoutParams = new ActionBar.LayoutParams(
        ActionBar.LayoutParams.WRAP_CONTENT,
        ActionBar.LayoutParams.WRAP_CONTENT, Gravity.RIGHT
                | Gravity.CENTER_VERTICAL);
layoutParams.rightMargin = 40;
imageView.setLayoutParams(layoutParams);
actionBar.setCustomView(imageView);

edited Jul 23 '21 at 18:05

Shubham Suryavanshi

533
9
14

answered Jan 17 '14 at 06:07

Gopal Gopi

11,101
1
30
43

Thanks @Gopal, It's works.Do you know how to change the action bar background color to this image color. I mean #160203. for the application i used notitleBar theme and for this application i used app Theme Light.Do you have any idea? – anuruddhika Jan 17 '14 at 06:22
@anuruddhika use actionBar.setBackgroundDrawable(new ColorDrawable(0xFF160203));... – Gopal Gopi Jan 17 '14 at 06:26
It was changed. Thanks lot for your help.I'm new to android.I learnt new things. Thanks. – anuruddhika Jan 17 '14 at 06:30
1

hi how to show the imageview in right hand side edge(i.e) after the search icon and make click event for it? – Manikandan Jun 06 '14 at 10:28
@GopalGopi how to get click event ? – Maveňツ Mar 30 '15 at 06:48
@Gopal Gopi Can you please describe it for multiple image ? How can we implement it for multiple image on action bar. – Teekam Oct 01 '16 at 08:52

score 26 · Answer 2 · edited Jul 24 '21 at 15:48

Use

ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayShowCustomEnabled(true);

LayoutInflater inflator = (LayoutInflater) this .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View v = inflator.inflate(R.layout.custom_imageview, null);

actionBar.setCustomView(v);

Code for Custom ImageView

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/layout">
    
    <ImageView
        android:id="@+id/imageView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:src="@drawable/adnace_search_i" />
</RelativeLayout>

Use onClickListener method of android. You can use ((ImageView)your_root_view).findViewById(R.id.imageview4).setOnClickListener(...); — Mandar Kakade, Jan 15 '16 at 09:44

score 10 · Answer 3 · edited Oct 07 '15 at 09:38

You don't need an ImageView for this. Using a new item using Icon for your image will be the smartest solution.

Add this item to your menu.xml:

<item
    android:title="@string/action_scanner"
    android:orderInCategory="79"
    android:icon="@drawable/adnace_search_i"
    android:showAsAction="ifRoom|withText" />

Instantiate the menu in onCreateOptionsMenu and implement it in onOptionsItemSelected.

score 4 · Answer 4 · answered Oct 13 '15 at 21:13

Add this line to the menu.xml in the res/menu/menu.xml

<menu xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:yourapp="http://schemas.android.com/apk/res-auto" >
 <!-- Search, should appear as action button -->
 <item android:id="@+id/action_search"
      android:icon="@drawable/ic_action_search"
      android:title="@string/action_search"
      yourapp:showAsAction="ifRoom"  />
 ...
 </menu>

You can see more actionBar property over android developer tutorials

score 1 · Answer 5 · edited Jul 24 '21 at 15:46

Use this layout. I just used that on API 28

<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">

        <RelativeLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">

            <ImageView
                android:layout_width="24dp"
                android:layout_height="24dp"
                android:onClick="makeToast"
                android:layout_alignParentEnd="true"
                android:src="@drawable/ic_flag" />
        </RelativeLayout>
    </android.support.v7.widget.Toolbar>

How to add imageview on right hand side of action bar?

5 Answers5

Linked