仿iphone快速导航悬浮球

用过iphone的朋友都知道，iPhone有个圆球辅助工具，它漂浮在你的手机屏幕(在任何APP之上)，你可以将它移动到任何地方，它叫做AssistiveTouch，本篇模拟该软件实现一个小案例，主要是实现它的界面，首先来看看实现的效果吧：

拖动小圆球：

点击弹出pop窗口：

为了让辅助工具一直悬浮在窗口之上，这里使用的机制是通过在程序初始化是，启动一个service，在service的onCreate() 函数中使用LayoutInflater来加载一个view，而这个view就是辅助球的布局文件：floatball.xml，然后对它进行onclick事件的监听，setOnClickListener监听到辅助球点击事件之后，就创建一个PopupWindow，弹出如上的菜单界面，大体的实现就是这样。

其实，实现窗口悬浮于最前面的一个重要属性是：WindowManager.LayoutParams.TYPE_PHONE

我们只要将WindowManager.LayoutParams的type属性设置为 WindowManager.LayoutParams.TYPE_PHONE就可以实现悬浮最前面。

工程目录结构：

部分代码解析：

MyApplication.java：

[html] view
plaincopyprint?

  1. package com.tyd.floatball.util;  
  2.   
  3. import android.app.Application;  
  4. import android.view.WindowManager;  
  5.   
  6. public class MyApplication extends Application {  
  7.   
  8.     private WindowManager.LayoutParams wmParams = new WindowManager.LayoutParams();  
  9.   
  10.     public WindowManager.LayoutParams getMywmParams() {  
  11.         return wmParams;  
  12.     }  
  13.       
  14. }  

MainActivity.java：

[html] view
plaincopyprint?

  1. package com.tyd.floatball.ui;  
  2.   
  3. import com.tyd.floatball.R;  
  4. import com.tyd.floatball.R.layout;  
  5. import com.tyd.floatball.service.TopFloatService;  
  6. import android.app.Activity;  
  7. import android.content.Intent;  
  8. import android.os.Bundle;  
  9.   
  10. public class MainActivity extends Activity {  
  11.     @Override  
  12.     public void onCreate(Bundle savedInstanceState) {  
  13.         super.onCreate(savedInstanceState);  
  14.         setContentView(R.layout.main);  
  15.         Intent service = new Intent();  
  16.         service.setClass(this, TopFloatService.class);  
  17.         //启动服务  
  18.         startService(service);  
  19.     }  
  20. }  

TopFloatService.java：

[html] view
plaincopyprint?

  1. package com.tyd.floatball.service;  
  2.   
  3. import android.app.Service;  
  4. import android.content.Intent;  
  5. import android.graphics.PixelFormat;  
  6. import android.graphics.Rect;  
  7. import android.graphics.drawable.BitmapDrawable;  
  8. import android.os.IBinder;  
  9. import android.util.DisplayMetrics;  
  10. import android.view.Gravity;  
  11. import android.view.KeyEvent;  
  12. import android.view.LayoutInflater;  
  13. import android.view.MotionEvent;  
  14. import android.view.View;  
  15. import android.view.View.OnClickListener;  
  16. import android.view.View.OnKeyListener;  
  17. import android.view.View.OnTouchListener;  
  18. import android.view.WindowManager;  
  19. import android.widget.Button;  
  20. import android.widget.LinearLayout;  
  21. import android.widget.PopupWindow;  
  22. import android.widget.RelativeLayout;  
  23. import android.widget.Toast;  
  24. import com.tyd.floatball.R;  
  25. import com.tyd.floatball.util.MyApplication;  
  26.   
  27. public class TopFloatService extends Service implements OnClickListener,OnKeyListener{  
  28.     WindowManager wm = null;  
  29.     WindowManager.LayoutParams ballWmParams = null;  
  30.     private View ballView;  
  31.     private View menuView;  
  32.     private float mTouchStartX;  
  33.     private float mTouchStartY;  
  34.     private float x;  
  35.     private float y;  
  36.     private RelativeLayout menuLayout;  
  37.     private Button floatImage;  
  38.     private PopupWindow pop;  
  39.     private RelativeLayout menuTop;  
  40.     private boolean ismoving = false;  
  41.       
  42.     @Override  
  43.     public void onCreate() {  
  44.         super.onCreate();  
  45.         //加载辅助球布局  
  46.         ballView = LayoutInflater.from(this).inflate(R.layout.floatball, null);  
  47.         floatImage = (Button)ballView.findViewById(R.id.float_image);  
  48.         setUpFloatMenuView();  
  49.         createView();  
  50.     }  
  51.       
  52.     /**  
  53.      * 窗口菜单初始化  
  54.      */  
  55.     private void setUpFloatMenuView(){  
  56.         menuView = LayoutInflater.from(this).inflate(R.layout.floatmenu, null);  
  57.         menuLayout = (RelativeLayout)menuView.findViewById(R.id.menu);  
  58.         menuTop = (RelativeLayout)menuView.findViewById(R.id.lay_main);  
  59.         menuLayout.setOnClickListener(this);  
  60.         menuLayout.setOnKeyListener(this);  
  61.         menuTop.setOnClickListener(this);  
  62.     }  
  63.   
  64.     /**  
  65.      * 通过MyApplication创建view，并初始化显示参数  
  66.      */  
  67.     private void createView() {  
  68.         wm = (WindowManager) getApplicationContext().getSystemService("window");  
  69.         ballWmParams =  ((MyApplication) getApplication()).getMywmParams();  
  70.         ballWmParams.type = WindowManager.LayoutParams.TYPE_PHONE;  
  71.         ballWmParams.flags |= WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE;  
  72.         ballWmParams.gravity = Gravity.LEFT | Gravity.TOP;  
  73.         ballWmParams.x = 0;  
  74.         ballWmParams.y = 0;  
  75.         ballWmParams.width = WindowManager.LayoutParams.WRAP_CONTENT;  
  76.         ballWmParams.height = WindowManager.LayoutParams.WRAP_CONTENT;  
  77.         ballWmParams.format = PixelFormat.RGBA_8888;  
  78.         //添加显示层  
  79.         wm.addView(ballView, ballWmParams);  
  80.         //注册触碰事件监听器  
  81.         floatImage.setOnTouchListener(new OnTouchListener() {  
  82.             public boolean onTouch(View v, MotionEvent event) {  
  83.                 x = event.getRawX();  
  84.                 y = event.getRawY();   
  85.                 switch (event.getAction()) {  
  86.                 case MotionEvent.ACTION_DOWN:  
  87.                     ismoving = false;  
  88.                     mTouchStartX = (int)event.getX();  
  89.                     mTouchStartY = (int)event.getY();  
  90.                     break;  
  91.                 case MotionEvent.ACTION_MOVE:  
  92.                     ismoving = true;  
  93.                     updateViewPosition();  
  94.                     break;  
  95.                 case MotionEvent.ACTION_UP:  
  96.                     mTouchStartX = mTouchStartY = 0;  
  97.                     break;  
  98.                 }  
  99.                 //如果拖动则返回false，否则返回true  
  100.                 if(ismoving == false){  
  101.                     return false;  
  102.                 }else{  
  103.                     return true;  
  104.                 }  
  105.             }  
  106.   
  107.         });  
  108.         //注册点击事件监听器  
  109.         floatImage.setOnClickListener(new View.OnClickListener() {  
  110.             @Override  
  111.             public void onClick(View v) {  
  112.                 DisplayMetrics dm = getResources().getDisplayMetrics();  
  113.                 pop = new PopupWindow(menuView, dm.widthPixels, dm.heightPixels);  
  114.                 pop.showAtLocation(ballView, Gravity.CENTER, 0, 0);  
  115.                 pop.update();  
  116.             }  
  117.         });  
  118.     }  
  119.       
  120.     /**  
  121.      * 更新view的显示位置  
  122.      */  
  123.     private void updateViewPosition() {  
  124.         ballWmParams.x = (int) (x - mTouchStartX);  
  125.         ballWmParams.y = (int) (y - mTouchStartY);  
  126.         wm.updateViewLayout(ballView, ballWmParams);  
  127.     }  
  128.   
  129.     @Override  
  130.     public IBinder onBind(Intent intent) {  
  131.         return null;  
  132.     }  
  133.   
  134.     @Override  
  135.     public void onClick(View v) {  
  136.         switch (v.getId()) {  
  137.         case R.id.lay_main:  
  138.             Toast.makeText(getApplicationContext(), "111", 1000).show();  
  139.             break;  
  140.   
  141.         default:  
  142.             if(pop!=null && pop.isShowing()){  
  143.                 pop.dismiss();  
  144.             }  
  145.             break;  
  146.         }  
  147.           
  148.     }  
  149.   
  150.     @Override  
  151.     public boolean onKey(View v, int keyCode, KeyEvent event) {  
  152.         Toast.makeText(getApplicationContext(), "keyCode:"+keyCode, 1000).show();  
  153.         switch (keyCode) {  
  154.         case KeyEvent.KEYCODE_HOME:  
  155.             pop.dismiss();  
  156.             break;  
  157.         default:  
  158.             break;  
  159.         }  
  160.         return true;  
  161.     }  
  162.       
  163. }  

辅助球的布局文件 floatball.xml：

[html] view
plaincopyprint?

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="wrap_content"  
  5.     android:orientation="vertical"  
  6.     android:layout_gravity="center_vertical">  
  7.       
  8.     <Button  
  9.         android:id="@+id/float_image"  
  10.         android:layout_width="50dp"  
  11.         android:layout_height="50dp"  
  12.         android:background="@drawable/selector_btn_assistive"   
  13.         />  
  14.   
  15. </FrameLayout>  

窗口菜单的布局文件floatmenu.xml：

[html] view
plaincopyprint?

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:id="@+id/menu"  
  4.     android:layout_width="fill_parent"  
  5.     android:layout_height="fill_parent"  
  6.     android:background="@drawable/transparent" >  
  7.   
  8.     <LinearLayout  
  9.         android:layout_width="@dimen/size_dialog"  
  10.         android:layout_height="@dimen/size_dialog"  
  11.         android:layout_centerInParent="true"  
  12.         android:background="@drawable/shape_background_assistivetouch"  
  13.         android:orientation="vertical" >  
  14.   
  15.         <RelativeLayout  
  16.             android:id="@+id/lay_main"  
  17.             android:layout_width="fill_parent"  
  18.             android:layout_height="fill_parent"  
  19.             android:orientation="vertical"  
  20.             android:padding="4.0px"  
  21.             android:visibility="visible" >  
  22.   
  23.             <TextView  
  24.                 android:id="@+id/btn_apps"  
  25.                 style="@style/Icon"  
  26.                 android:layout_centerInParent="true"  
  27.                 android:drawableTop="@drawable/selector_ic_apps"  
  28.                 android:text="@string/apps" />  
  29.   
  30.             <TextView  
  31.                 android:id="@+id/btn_home_screen"  
  32.                 style="@style/Icon"  
  33.                 android:layout_alignParentBottom="true"  
  34.                 android:layout_centerHorizontal="true"  
  35.                 android:drawableTop="@drawable/selector_ic_home"  
  36.                 android:text="@string/home_screen" />  
  37.   
  38.             <TextView  
  39.                 android:id="@+id/btn_setting"  
  40.                 style="@style/Icon"  
  41.                 android:layout_alignParentRight="true"  
  42.                 android:layout_centerVertical="true"  
  43.                 android:drawableTop="@drawable/selector_ic_phone"  
  44.                 android:text="@string/setting" />  
  45.   
  46.             <TextView  
  47.                 android:id="@+id/btn_lock_screen"  
  48.                 style="@style/Icon"  
  49.                 android:layout_centerHorizontal="true"  
  50.                 android:drawableTop="@drawable/selector_ic_power_down"  
  51.                 android:text="@string/lock_screen" />  
  52.   
  53.             <TextView  
  54.                 android:id="@+id/btn_favor"  
  55.                 style="@style/Icon"  
  56.                 android:layout_alignParentLeft="true"  
  57.                 android:layout_centerVertical="true"  
  58.                 android:drawableTop="@drawable/selector_ic_star"  
  59.                 android:text="@string/favor" />  
  60.         </RelativeLayout>  
  61.     </LinearLayout>  
  62.   
  63. </RelativeLayout>  

AndroidManifest.xml：

[html] view
plaincopyprint?

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <manifest xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     package="com.tyd.floatball"  
  4.     android:versionCode="1"  
  5.     android:versionName="1.0" >  
  6.     <uses-sdk android:minSdkVersion="14" />  
  7.   
  8.     <application  
  9.         android:icon="@drawable/ic_launcher"  
  10.         android:label="@string/app_name"   
  11.         android:name=".util.MyApplication">  
  12.         <activity  
  13.             android:label="@string/app_name"  
  14.             android:name=".ui.MainActivity" >  
  15.             <intent-filter >  
  16.                 <action android:name="android.intent.action.MAIN" />  
  17.   
  18.                 <category android:name="android.intent.category.LAUNCHER" />  
  19.             </intent-filter>  
  20.         </activity>  
  21.         <service   
  22.                 android:name=".service.TopFloatService"    
  23.                 android:enabled="true"  
  24.                 android:exported="true"  
  25.             />  
  26.     </application>  
  27.       
  28.     <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" />  
  29.     <uses-permission android:name="android.permission.DISABLE_KEYGUARD"/>  
  30. </manifest>  

该实例我已经将源码整理打包，进行了上传，下面是资源的下载地址：

http://download.csdn.net/detail/wulianghuan/5364129

时间： 2024-03-15 02:41:59

仿iphone快速导航悬浮球的相关文章

Photoshop实例教程:绘制iphone风格导航菜单

本教程学习如何用Photoshop打造专属于你自己的iphone风格导航菜单,主要用到了图层样式来完成的,下面让我们一起来学习吧. 先看效果图. 新建文档450x450像素,背景填充#32363c,新建图层画一个白色矩形. 把不透明度改为6%,类似下图效果. 新建图层,前景色#5b6573在顶部再画一个矩形. 复制6层,改变颜色,1.2.7同一颜色,3为红色,其它为白色. [1] [2]  下一页

div+css实现仿猪八戒首页导航菜单效果

本文实例讲述了div+css实现仿猪八戒首页导航菜单效果.分享给大家供大家参考.具体如下: 这是一款仿猪八戒2010年首页的网页导航菜单,蓝色风格,非常漂亮大气.简洁专业,在此推荐给大家.菜单上有一个标记,指引当前的位置,也是本菜单的亮点.用CSS究竟是如何实现的呢?那么就请一起看代码吧. 先来看看运行效果截图: 具体代码如下: 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h

在IE9中如何启用快速导航选项卡功能

在IE8中,打开多个选项卡时,选项卡栏最左侧会出现一个"快速导航选项卡",如下图所示,但升级到IE9后却发现没有该选项卡了,按快捷键"Ctrl + Q"也没有反应. 这是由于 Windows 7 任务栏上的缩略图预览能够很好地实现快速导航的功能,所以IE9的"快速导航"功能被隐藏了起来.以使界面更简洁,也为网页内容留下更多展示空间. IE8浏览器中的"快速导航选项卡"按钮 更简洁的IE9操作栏 不过,如果总是打开很多选项卡,超

如何在IE9中恢复“快速导航选项卡”的功能

具体的描述:IE8中,"快速导航",指的是"快速导航选项卡",在打开多个"选项卡"的时候,位于"选项卡栏"最左侧就会出现这个"快速导航选项卡". 单击之后的效果: 同样也可以通过" Ctrl + Q "的快捷键来实现该功能. 再来看看IE9: IE9界面上看不到快速导航的启动按钮,而且通过" Ctrl + Q "的快捷键也无法启动. 这时我们可以打开IE9的"

Win8系统下IE10如何启用快速导航

  1.启动 IE 浏览器,在工具栏中单击"工具",再单击"Internet 选项;(若未找到菜单栏,可单击键盘的 ALT 键).如下图所示: 2.在"常规"标签页找到选项卡,单击"选项卡".如下图所示: 3.选中"启用快速导航选项卡",单击"确定"即可.如下图所示: 4.重新启动 IE 浏览器,打开多个选项卡,按下"Ctrl + Q"组合键,导航界面如下图所示呈现眼前.如下图

Android编程仿Iphone拖动相片特效Gallery的简单应用示例_Android

本文实例讲述了Android编程仿Iphone拖动相片特效Gallery的简单应用.分享给大家供大家参考,具体如下: Step 1:准备图片素材. 将icon2,icon3,icon4,icon5,icon6五张图片导入res/drawable里加上icon.png本身一共有6张图片. Step 2:新建Android工程,命名为GalleryDemo. Step 3:设计UI,修改main.xml代码如下: <?xml version="1.0" encoding="

asp.net母版页如何仿淘宝导航与搜索

问题描述 asp.net母版页如何仿淘宝导航与搜索 ## 用母版页完成以下效果 下图圈圈内容**** 解决方案 母版页和一般网页也没有区别,插入你的代码,以及放入placeholder放你的内容页就可以了

【实战HTML5与CSS3 第二篇】绚丽的快速导航！

原文 http://www.cnblogs.com/yexiaochai/archive/2013/05/01/3051632.html 目录 [实战HTML5与CSS3 第一篇]初探水深,美丽的导航,绚丽的图片爆炸!! [实战HTML5与CSS3 第二篇]绚丽的快速导航! [实战HTML5与CSS3 第三篇]我第一个HTML5网页诞生了(提供源码) 前言 今天9点就起来了,因为下午出去有个聚会,所以就早点起来进行,否则这个进度有点吃紧啊,昨天初略的完成了导航以及爆炸的图片,这里来回顾下: 1

Android仿Iphone通知角标的实现(二)

MainActivity如下: package cc.testtipmessage1; import android.os.Bundle; import android.widget.ImageView; import android.app.Activity; import android.graphics.Bitmap; import android.graphics.Canvas; import android.graphics.Bitmap.Config; import android.