Hey folks!
Looking forward to formulating an android floating widget for your app? I'll help you out.
This content will guide you through, to create the floating widget in android apps. You will be provided with a detailed description of how to create an android floating widget. This post will be delivering a stepwise description to you. So, stay tuned till the end.
Introduction
In Mobile App Development, OMNINOS is the king! Our major goal is to fulfill the dreams of our users. We already have 500+ successful projects under our name. Our team is our pride. They hold the industrial experience and tremendous proficiency in formulating mobile apps and features such as floating widget in android.
The biggest reason for our persistent performance is from the very onset as a startup to an established name in the market of App Development and also some other features such as creating a floating widget. We have never stopped learning, our learning protocol is constant, we keep diversifying ourselves and keep learning from our omissions.
Android Floating Widget at a glance
The widget in android or the floating widget that we have been bragging about is the views that float over the screen of the device. This application is helping you to multitask. Isn't it great? Without closing the current application you can use the other applications.
So, now you can scroll through your Instagram and reply to your Facebook messages at the same time, or why not groove in some amazing music while you scroll. It makes the work extremely comfortable. That is what the android floating widget is for.
Let's make it a bit easier, you would have surely used Facebook Application, if yes then you are familiar with the floating widget in android While using the application you must have noticed a chat bubble popping up on your screen in case you receive a message. This bubble floats over your screen irrespective of whatever application you are using.
Hope you now have a complete understanding of the android floating widget.
Creating an Android Widget
Now, we'll be creating a floating widget in Android. For a better understanding of the process, I will share a floating widget android example.
Without doing much ado, let's get started!
Create a new Project
Now, let's see how to create an android floating widget.
- Firstly, begin with creating a new project in Android Studio.
- In the upcoming tab, you need to select the target Android device.
- Now, you need to select an activity, which will be the Empty Activity.
- Lastly, it's time to customize the activity.
And the initial work is done.
- In this project, we'll be needing two layouts. In the first layout, we will be creating a floating widget and the second layout is for the widget.
Start Coding
- java
package com.android_examples.floatingwidget_android_examplescom;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.net.Uri;
import android.os.Build;
import android.view.View;
import android.content.Intent;
import android.provider.Settings;
import android.widget.Button;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
public static final int SYSTEM_ALERT_WINDOW_PERMISSION = 7;
Button button ;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
button = (Button)findViewById(R.id.buttonShow);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M && !Settings.canDrawOverlays(this)) {
RuntimePermissionForUser();
}
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.M) {
startService(new Intent(MainActivity.this, FloatingWidgetShowService.class));
finish();
} else if (Settings.canDrawOverlays(MainActivity.this)) {
startService(new Intent(MainActivity.this, FloatingWidgetShowService.class));
finish();
} else {
RuntimePermissionForUser();
Toast.makeText(MainActivity.this, "System Alert Window Permission Is Required For Floating Widget.", Toast.LENGTH_LONG).show();
}
}
});
}
public void RuntimePermissionForUser() {
Intent PermissionIntent = new Intent(Settings.ACTION_MANAGE_OVERLAY_PERMISSION,
Uri.parse("package:" + getPackageName()));
startActivityForResult(PermissionIntent, SYSTEM_ALERT_WINDOW_PERMISSION);
}
}
Layout file
- xml
<?xml version="1.0" encoding="utf-8"?>
<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"
tools:context="com.android_examples.floatingwidget_android_examplescom.MainActivity"
android:layout_margin="10dp">
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="Click Here To Show Floating Widget"
android:id="@+id/buttonShow"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
- java
package com.android_examples.floatingwidget_android_examplescom;
/**
* Created by Juned on 9/15/2017.
*/
import android.app.Service;
import android.content.Intent;
import android.os.IBinder;
import android.graphics.PixelFormat;
import android.view.LayoutInflater;
import android.view.WindowManager;
import android.view.MotionEvent;
import android.view.View;
public class FloatingWidgetShowService extends Service{
WindowManager window manager;
View floating view, collapsed view, expanded view;
WindowManager.LayoutParams params ;
public FloatingWidgetShowService() {
}
@Override
public IBinder onBind(Intent intent) {
return null;
}
@Override
public void onCreate() {
super.onCreate();
floatingView = LayoutInflater.from(this).inflate(R.layout.floating_widget_layout, null);
params = new WindowManager.LayoutParams(
WindowManager.LayoutParams.WRAP_CONTENT,
WindowManager.LayoutParams.WRAP_CONTENT,
WindowManager.LayoutParams.TYPE_APPLICATION_OVERLAY,
WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE,
PixelFormat.TRANSLUCENT);
windowManager = (WindowManager) getSystemService(WINDOW_SERVICE);
windowManager.addView(floatingView, params);
expandedView = floatingView.findViewById(R.id.Layout_Expended);
collapsedView = floatingView.findViewById(R.id.Layout_Collapsed);
floatingView.findViewById(R.id.Widget_Close_Icon).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
stopSelf();
}
});
expandedView.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
collapsedView.setVisibility(View.VISIBLE);
expandedView.setVisibility(View.GONE);
}
});
floatingView.findViewById(R.id.MainParentRelativeLayout).setOnTouchListener(new View.OnTouchListener() {
int X_Axis, Y_Axis;
float TouchX, TouchY;
@Override
public boolean onTouch(View v, MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
X_Axis = params.x;
Y_Axis = params.y;
TouchX = event.getRawX();
TouchY = event.getRawY();
return true;
case MotionEvent.ACTION_UP:
collapsedView.setVisibility(View.GONE);
expandedView.setVisibility(View.VISIBLE);
return true;
case MotionEvent.ACTION_MOVE:
params.x = X_Axis + (int) (event.getRawX() - TouchX);
params.y = Y_Axis + (int) (event.getRawY() - TouchY);
windowManager.updateViewLayout(floatingView, params);
return true;
}
return false;
}
});
}
@Override
public void onDestroy() {
super.onDestroy();
if (floatingView != null) windowManager.removeView(floatingView);
}
}
- xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<RelativeLayout
android:id="@+id/MainParentRelativeLayout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:ignore="UselessParent">
<!-- This layout is the Collapsed layout -->
<RelativeLayout
android:id="@+id/Layout_Collapsed"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:visibility="visible">
<ImageView
android:id="@+id/Logo_Icon"
android:layout_width="72dp"
android:layout_height="72dp"
android:layout_marginTop="10dp"
android:src="@drawable/mobile_icon" />
<ImageView
android:id="@+id/Widget_Close_Icon"
android:layout_width="23dp"
android:layout_height="23dp"
android:layout_marginLeft="50dp"
android:src="@drawable/close_icon" />
</RelativeLayout>
<!-- This layout is expended layout-->
<LinearLayout
android:id="@+id/Layout_Expended"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#FFF3E0"
android:orientation="horizontal"
android:padding="8dp"
android:visibility="gone">
<ImageView
android:id="@+id/WebsiteLogoIcon"
android:layout_width="80dp"
android:layout_height="80dp"
android:src="@drawable/mobile_icon"
tools:ignore="ContentDescription" />
<LinearLayout
android:id="@+id/LinearLayout_2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingTop="5dp"
android:text="Android-Examples"
android:textAlignment="center"
android:textSize="23dp"
android:textColor="#000"
android:textStyle="bold" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="www.android-examples.com"
android:textAlignment="center"
android:textSize="18dp"
android:textColor="#000"
android:textStyle="bold" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</FrameLayout>
AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.android_examples.floatingwidget_android_examplescom">
<uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" />
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<service
android:name=".FloatingWidgetShowService"
android:enabled="true"
android:exported="false" />
</application>
</manifest>
Now, finally, you need to run the application.
You can see all the modifications, and find out if the widget is working properly or not.
This was a floating widget android example.
Conclusion
So this tutorial had the floating widget android example, to enhance the understanding. Omninos Solutions have been working on such projects for a very long time and has mastered this stream.
This was a detailed tutorial, hope all your doubts and questions are cleared. If in case you feel any question regarding the android floating widget is not cleared, feel free to contact us.
