floating icon like facebook chat head

How to Create Floating Icon like Facebook Messenger icon Android

All of us love Facebook messenger icon(float over the screen ). The Facebook messenger icon (floating icon) remain on top and can float anywhere on screen. You can touch it anytime, it will let you inside the current active messenger window.

It is Pretty Cool !!! It is very convenient to perform multitask on one finger touch. You can drag it to any where on screen.

Today in this post, I will show you ” How to create floating icon like Facebook Messenger App”.  Some people called it as floating widget. Also in this project When you click on floating icon it will show a chat window ,where you can type a message.

Floating Icon- 3 Important Point

Facebook chat head(Messenger icon) or Generally say it floating icon is nothing but a floating view. In your android app, you have to define the app permission – android.permission.SYSTEM_ALERT_WINDOW . This permission let you drag your app icon over other app or Home screen.

Second important thing is icon can be click any time, so you have to create a service that can monitor click event on floating icon.

I have used the background service to add the floating widget into the view hierarchy of the current screen. So, this floating view is always on top of application windows.

Third thing is, to drag floating icon across the screen I am using OnTouchListener() to listen to drag events and change the position of the chat has in the screen.

1) Create Floating View Layout
2) Create activity_main.xml
3) Create floating service
4) Add Permission in Manifest file
5) Check run time Permission
6) Run code on device

Login & Download source code


50 day android course


Create Floating View Layout

Create a new project in android studio, My project name is “FloatingWidget”. On res folder create new xml layout file name as “floatingview.xml”.

Collapsed view

The floating widget will remain collapsed when the view is launched. When the user clicks on this view, an expanded view will open.

Expanded View

On this view, I put a EditText to type message. You can create any type of form in this expanded view. Like you can put shortcut of different apps or can create google search bar etc.


Create activity_main.xml

In main layout file I am using a button to launch floating icon. I real project you need to do auto service launch when new notification come for your app. To do this you have to use Broadcast Receiver.


Create floating Service

Now I am going to create service that will keep care about floating icon. create new java file name as FloatingService.java There is three part of this service-

  1. Create Container view
  2. Create onclick listener on Expanded view items
  3. Create onTouch listener for drag and launch view

Create Container view

First I am going to create a view that will hold floating icon. In this java file I am going to define primary location of the floating icon which is top left corner of device screen. Inside onCreate() method I am using WindowManager to define location of icon.

There is an Important Flag

WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE| WindowManager.LayoutParams.FLAG_ALT_FOCUSABLE_IM

I have created this project to demonstrate floating icon so when you click on edittext in expanded view, it will not show keypad to type word on it. You have to use WindowManager.LayoutParams.FLAG_LOCAL_FOCUS_MODE with some other configuration.

Create onclick listener on Expanded view items

In this part I define onClick Listener on editText and close button. You know about how to set onClick() on item so I am not going to explain it here.

Create onTouch listener for drag and launch view

Now its time to define where you floating icon will go with your finger movement. To get the finger movement attach onTouchListener on view.

Complete FloatingService.java file


Add Permission in AndroidManifest.xml

The last step of this project is adding floating view by starting the FloatingViewService. First you have to define permission on AndroidManifest.xml file
android.permission.SYSTEM_ALERT_WINDOW permission. For android version <= API22, this permission is granted by default. But for the android versions running API > 22, we need to check for the permission runtime. Also define FloatingServer.java file as service in manifest file.

Add Run time Permission


Run Code

Now run this code in real device. Your floating icon is ready to use. If you have any problem on execution of code, leave comment below.

Do you know how to create parallax animation on android? if no, read my this post

You can learn android App development with me in 50 Days. I am going to start online course where I will teach you both Basic and Advance Android App Development.

50 day android course


Posted in andorid.

kamal bunkar

I Am Post Graduation (M.Tech. C.S.E) from VNIT, Nagpur. I Have Published Two Research Paper On International Journal. My Apps on Google Play Store- Sanyukt Parivar(Mp Police ), NOTOtag- Digital Chhindwara, The Tubby-VoiceRecognizer & More.
Contact me at kamal.bunkar@blueappsoftware.in


  1. I love your blog.. very nice colors & theme. Did you create this
    website yourself or did you hire someone to do it for you?
    Plz respond as I’m looking to create my own blog and would like to find
    out where u got this from. appreciate it

  2. Pretty great post. I just stumbled upon your weblog and wanted to say
    that I’ve truly loved browsing your blog posts.
    In any case I’ll be subscribing for your feed and I hope you write once more very soon!

  3. Hi there! This post could not be written any better!
    Reading through this post reminds me of my good old room mate!
    He always kept talking about this. I will forward this article to him.
    Fairly certain he will have a good read. Thank you for sharing!

  4. Hi there! Quick question that’s totally off topic.
    Do you know how to make your site mobile friendly?
    My weblog looks weird when browsing from my iphone4.
    I’m trying to find a template or plugin that might
    be able to fix this issue. If you have any recommendations, please share.
    Thank you!

  5. This is really attention-grabbing, You are an overly skilled blogger.
    I have joined your feed and look forward to in the hunt
    for extra of your great post. Also, I have shared your site in my social networks

  6. I’m really enjoying the theme/design of your blog.

    Do you ever run into any browser compatibility issues?

    A few of my blog audience have complained about my site not
    working correctly in Explorer but looks great in Chrome.
    Do you have any solutions to help fix this issue?

  7. I was recommended this web site by my cousin. I’m
    not sure whether this post is written by him as no one else
    know such detailed about my problem. You are wonderful!


  8. Hey I know this is off topic but I was wondering if you knew of any widgets I could add to my blog that automatically tweet my newest twitter updates.
    I’ve been looking for a plug-in like this for quite some time and was hoping maybe you would have some experience with something like this.
    Please let me know if you run into anything. I truly enjoy reading your
    blog and I look forward to your new updates.

  9. Having read this I thought it was very informative. I appreciate you finding the time and
    energy to put this short article together. I once again find myself personally spending a lot of time both reading and posting comments.
    But so what, it was still worthwhile!

  10. hi! may i know is your code complete? because i run the program and does nothing, i have download the given source code.

    • Yes this code is working…You have to create file on php server to store FCM key into your database for future use. First check on your android studio log whether FCM token is printing OR not. If it is printing in log than send token to your web server.

  11. Good day! I could have sworn I’ve been to
    this website before but after going through
    a few of the articles I realized it’s new to me.

    Nonetheless, I’m certainly delighted I found it and I’ll be book-marking it and checking back regularly!

  12. Spot on with this write-up, I absolutely feel this website needs much more attention. I’ll probably be returning to read
    through more, thanks for the info!

  13. Hey very cool website!! Man .. Excellent ..
    Amazing .. I will bookmark your site and take the feeds additionally?
    I am glad to search out numerous useful info here
    in the submit, we need work out more strategies
    on this regard, thanks for sharing. . . . . .

  14. Pingback: ExoPlayer Android Example- Best Alternative of VideoView By Kamal

  15. Pingback: Simplest way to get WordPress Post in Android App- REST API

  16. I just like the helpful information you supply to your articles.

    I’ll bookmark your blog and test once more here frequently.
    I’m fairly sure I will learn many new stuff proper here!
    Good luck for the following!

Comments are closed.