Android Facebook Messenger Chat Head like Floating Icon

Facebook Messenger with Chat Head is a great feature and very handy.

A significant time ago facebook have launched Chat Head in it’s Messenger, but now you can seen in many application the feature of rounded chat icon on the screen which will be always on screen above all applications as shown in the screen shots . The app that provide this feature is Facebook messenger app where there is a chat icon on the screen. We can also create the chat head type window in our own app. It’s very easier than expectations. It is using just a service class in android and inflating the view in it. Following are the steps to make a draggable chat icon on the screen .

Step 1) Add Permission in manifest file

<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>

Step2) Make a class that extends the service

public class ServiceChatHead extends Service {

  private WindowManager windowManager;
  private ImageView chatImage;

  @Override public IBinder onBind(Intent intent) {
    // Not used
    return null;
  }

  @Override public void onCreate() {
    super.onCreate();

    windowManager = (WindowManager) getSystemService(WINDOW_SERVICE);

    chatImage = new ImageView(this);
    chatImage.setImageResource(R.drawable.android_head);

    WindowManager.LayoutParams params = new WindowManager.LayoutParams(
        WindowManager.LayoutParams.WRAP_CONTENT,
        WindowManager.LayoutParams.WRAP_CONTENT,
        WindowManager.LayoutParams.TYPE_PHONE,
        WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE,
        PixelFormat.TRANSLUCENT);

    params.gravity = Gravity.TOP | Gravity.LEFT;
    params.x = 0;
    params.y = 100;
  chatImage.setOnTouchListener(new View.OnTouchListener() {
  private int initialX;
  private int initialY;
  private float initialTouchX;
  private float initialTouchY;

  @Override public boolean onTouch(View v, MotionEvent event) {
    switch (event.getAction()) {
      case MotionEvent.ACTION_DOWN:
        initialX = params.x;
        initialY = params.y;
        initialTouchX = event.getRawX();
        initialTouchY = event.getRawY();
        return true;
      case MotionEvent.ACTION_UP:
        return true;
      case MotionEvent.ACTION_MOVE:
        params.x = initialX + (int) (event.getRawX() - initialTouchX);
        params.y = initialY + (int) (event.getRawY() - initialTouchY);
        windowManager.updateViewLayout(chatHead, params);
        return true;
    }
    return false;
  }
});
    windowManager.addView(chatImage, params);
  }

  @Override
  public void onDestroy() {
    super.onDestroy();
    if (chatImage != null) windowManager.removeView(chatImage);
  }
}

Step 3) Declare service in manifest file

<service android:name=".ServiceChatHead"></service>

Step4) Start the service .

startService(new Intent(context, ServiceChatHead.class));

 
 
Enjoy Coding and Share Knowledge