I am adding a feature that resembles, Facebook Messenger 'ChatHeads', or Musixmatch lyrics feature.
I have a service
that creates a floating notification
bubble (like Messenger chathead). I am inflating a layout and adding that view
to the window manager
.
final WindowManager.LayoutParams params = new WindowManager.LayoutParams(
900,
1400,
WindowManager.LayoutParams.TYPE_PHONE,
WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE,
PixelFormat.TRANSLUCENT);
LayoutInflater inflater = (LayoutInflater) this.getSystemService( this.LAYOUT_INFLATER_SERVICE );
mView = inflater.inflate(R.layout.floating, null);
windowManager.addView(mView, params);
This is the layout file :
<RelativeLayout
android:id="@+id/outerRelativeLayout"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/transparent"
android:animateLayoutChanges="true" >
<ImageButton
android:id="@+id/imagebutton"
android:layout_width="50dp"
android:layout_height="50dp"
android:background="@drawable/shape_circular"
android:src="@drawable/launcher"
android:layout_marginLeft="16dp"
android:layout_marginTop="16dp"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:paddingBottom="8dp"
android:paddingLeft="8dp"
android:paddingTop="8dp"
android:paddingRight="8dp"
android:foregroundGravity="center_vertical|center_horizontal"/>
<RelativeLayout
android:id="@+id/innerRelativeLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="@+id/imagebutton"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="8dp"
android:layout_alignParentBottom="true"
android:background="@drawable/shape_reound_edges_black">
<Button
android:id="@+id/button"
android:layout_width="match_parent"
android:layout_height="50dp"
android:text="CONTINUE"
android:textSize="12sp"
android:textColor="#FFFFFF"
android:background="@drawable/shape_round_edges"
android:layout_marginLeft="8dp"
android:layout_marginBottom="8dp"
android:layout_marginRight="8dp"
android:layout_alignParentBottom="true"/>
<VideoView
android:id="@+id/videoView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentTop="true"
android:layout_above="@+id/button"
android:layout_marginTop="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginBottom="8dp"
android:background="@drawable/shape_round_edges"/>
</RelativeLayout>
The imagebutton
in the layout acts as the floating notification button
.
I've added an OnTouchListener
to the imagebutton
that helps me move this layout
. Also when I click on the button, the innerRelativeLayout's
visibility
is set to GONE
. But the root relative layout
remains and so the imagebutton
cannot be moved much. How do I achieve complete movement for the floating imagebutton
.
Code for OnTouchListener
:
chatHead.setOnTouchListener(new View.OnTouchListener() {
private int initialX;
private int initialY;
private float initialTouchX;
private float initialTouchY;
@Override public boolean onTouch(View v, MotionEvent event) {
if (gestureDetector.onTouchEvent(event)) {
if (isLayoutVisible) {
mInnerLayout.setVisibility(View.GONE);
isLayoutVisible = false;
} else {
mInnerLayout.setVisibility(View.VISIBLE);
isLayoutVisible = true;
}
return true;
} else {
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(mView, params);
return true;
}
}
return false;
}
});
Thanks in advance!