Tuesday, December 2, 2014

Floating View

Floating View :

This tutorial is about how to create Floating View. Floating view is a view which floats over the screen and able to get all click events for it with out disturbing your background activity.

How to create Floating view
Basically view is created by extending service and added over the screen using WindowManager





Code Snippet

1. MainActivity.java

 
 public class MainActivity extends Activity {  
      public static String TAG = "ABC";  
      @Override  
      protected void onCreate(Bundle savedInstanceState) {  
           super.onCreate(savedInstanceState);  
           finish();  
      }  
      protected void onDestroy() {  
           super.onDestroy();  
           FloatingViewService.show(MainActivity.this, FloatingViewService.class, 0);  
      }  
 }  


2. FloatingView.java
Create view which you want to add over your display.
In this case "Widget Move" i.e mTextView allow us move over the display and "Start Appication" i.e mButton will implement onClickListener for button.

 public class FloatingView extends LinearLayout{  
      private TextView mTextView;  
      private Button mButton;  
      // Constructor required for in-code creation  
      public FloatingView(Context context) {  
           super(context);  
           init(context);  
      }  
      private void init(Context c) {  
           // Inflate the view from the layout resource.  
           final LayoutInflater inflater = (LayoutInflater) c  
                     .getSystemService(Context.LAYOUT_INFLATER_SERVICE);  
           inflater.inflate(R.layout.floatingview_main, this, true);  
           mTextView = (TextView) findViewWithTag("textLabel");  
           mButton = (Button)findViewWithTag("buttonOK");  
           mTextView.setBackgroundColor(Color.GREEN);  
           //hook up the event handler for the Button  
           mButton.setOnClickListener(new OnClickListener() {  
                @Override  
                public void onClick(View v) {  
                     Log.d(MainActivity.TAG, "HI");  
                }  
           });  
      }  
      // Implement this to change child views reposition logic  
      @Override  
      protected void onLayout(boolean changed, int l, int t, int r, int b) {  
           super.onLayout(changed, l, t, r, b);  
      }  
  }  



3.FloatingViewService.java
Service will add view over the display and will also implement onTouchListener for view so view will be free to rotate over the display.


 public class FloatingViewService extends Service {  
      public static final String ACTION_SHOW = "SHOW";  
      static Context context;  
      public static WindowManager mWindowManager;  
      public static void show(Context context, Class<? extends FloatingViewService> cls, int id) {  
           context.startService(getShowIntent(context, cls, id));  
      }  
      public static Intent getShowIntent(Context context, Class<? extends FloatingViewService> cls, int id) {  
           String action = ACTION_SHOW;  
           FloatingViewService.context = context;  
           return new Intent(context, cls).putExtra("_id", id).setAction(action);  
      }  
      @Override  
      public void onCreate() {  
           super.onCreate();  
           mWindowManager = (WindowManager) getSystemService(Context.WINDOW_SERVICE);  
      }  
      @Override  
      public int onStartCommand(Intent intent, int flags, int startId) {  
           super.onStartCommand(intent, flags, startId);  
           show(0);  
           return START_NOT_STICKY;  
      }  
      WindowManager.LayoutParams params = new WindowManager.LayoutParams(  
                WindowManager.LayoutParams.WRAP_CONTENT,  
                WindowManager.LayoutParams.WRAP_CONTENT,  
                0,  
                WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE,  
                PixelFormat.TRANSLUCENT);  
      private int width;  
      private int height;  
      public final synchronized void show(final int id) {  
           width = ((Activity) context).getWindowManager().getDefaultDisplay().getWidth();  
           height = ((Activity) context).getWindowManager().getDefaultDisplay().getHeight();  
           final FloatingView floatingView = new FloatingView(context);  
           floatingView.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));  
           floatingView.setOnTouchListener(new OnTouchListener() {  
                @Override  
                public boolean onTouch(View v, MotionEvent event) {  
                     v.performClick();  
                     //Log.d(MainActivity.TAG, "Hi");  
                     if(event.getAction() == MotionEvent.ACTION_MOVE){  
                          params = new WindowManager.LayoutParams(  
                                    WindowManager.LayoutParams.WRAP_CONTENT,  
                                    WindowManager.LayoutParams.WRAP_CONTENT,  
                                    (int)(event.getRawX())-(width/2),   
                                    (int)(event.getRawY())-(height/2),  
                                    0,  
                                    WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE,  
                                    PixelFormat.TRANSLUCENT);  
                          mWindowManager.updateViewLayout(floatingView, params);  
                          return true;  
                     }  
                     return true;  
                }  
           });  
           final Button button = new Button(context);  
           button.setText("I'm a button!");  
           button.setLayoutParams(new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));  
           button.setOnTouchListener(new OnTouchListener() {  
                @Override  
                public boolean onTouch(View v, MotionEvent event) {  
                     Log.d(MainActivity.TAG, "Hi");  
                     v.performClick();  
                     //                    if(event.getAction() == MotionEvent.ACTION_UP ){  
                     //                         final Intent sSettingsIntent = new Intent(Settings.ACTION_ACCESSIBILITY_SETTINGS);            
                     //                         sSettingsIntent.setFlags(Intent.FLAG_ACTIVITY_NEW_TASK);  
                     //                         startActivity(sSettingsIntent);  
                     //                    }  
                     if(event.getAction() == MotionEvent.ACTION_MOVE){  
                          params = new WindowManager.LayoutParams(  
                                    WindowManager.LayoutParams.WRAP_CONTENT,  
                                    WindowManager.LayoutParams.WRAP_CONTENT,  
                                    (int)(event.getRawX())-(width/2),   
                                    (int)(event.getRawY())-(height/2),  
                                    0,  
                                    WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE,  
                                    PixelFormat.TRANSLUCENT);  
                          mWindowManager.updateViewLayout(button, params);  
                          return true;  
                     }  
                     return false;  
                }  
           });  
           mWindowManager.addView(floatingView, params);  
      }  
      @Override  
      public IBinder onBind(Intent intent) {  
           return null;  
      }  
 }  


4.floatingview_main.xml



 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
   android:id="@+id/compoundText"  
   android:layout_width="wrap_content"  
   android:layout_height="wrap_content"   
   android:orientation="vertical">  
   <TextView  
     android:layout_width="match_parent"  
     android:layout_height="wrap_content"  
     android:layout_weight="1"  
     android:tag="textLabel"  
     android:text="Widget Move" />  
   <Button  
     style="?android:attr/buttonStyleSmall"  
     android:layout_width="match_parent"  
     android:layout_height="wrap_content"  
     android:layout_weight="1"  
     android:tag="buttonOK"  
     android:text="Start Application" />  
 </LinearLayout>  


5.AndroidManifest.xml


 <manifest xmlns:android="http://schemas.android.com/apk/res/android"  
   package="com.examples.activity"  
   android:versionCode="1"  
   android:versionName="1.0" >  
   <uses-sdk  
     android:minSdkVersion="16"  
     android:targetSdkVersion="21" />  
   <application  
     android:allowBackup="true"  
     android:icon="@drawable/ic_launcher"  
     android:label="@string/app_name"  
     android:theme="@style/AppTheme" >  
     <activity  
       android:name=".MainActivity"  
       android:label="@string/app_name" >  
       <intent-filter>  
         <action android:name="android.intent.action.MAIN" />  
         <category android:name="android.intent.category.LAUNCHER" />  
       </intent-filter>  
     </activity>  
     <service android:name=".FloatingViewService" >  
     </service>  
   </application>  
 </manifest>  

Thank You

If you find errors or suggestion in this tutorial please notify me.

1 comment:

  1. Excellent post, It's a really friendly article. Good Blogger,
    //naveedpc.org/

    ReplyDelete