Android Demo : 悬浮窗(支持Android7.0)

标签:Android Demo 悬浮窗

作者:LightingContour

引言

在网上经常看各种教程,一直打算自己也写一篇。本来打算驻扎CSDN,不过那里的版面真的是……
之前看教程偶遇到简书,还不错,又支持Markdown,那就在这儿驻扎吧~

前一段时间实习在做悬浮窗,苦于网上的教程要么太老旧要么太简陋。还有的过于细致以至于反而让人摸不着门路。故花了些时间自己理顺下思路,写一篇Demo教程,帮助他人的同时也做一个总结。

该教程主要追求短平快,适用于新手。各种参数调配已设置到最简。教程中如有错误,还请多多包涵和指正。

简介

这里我们要做一款Android系统的悬浮窗。打开APP后悬浮窗开启,点击可以移动悬浮窗,连续点击两次按钮可以关闭悬浮窗。(这里点的比较快,退出时是点击了两下

成品展示

需get的基本知识

在假定各位已经有Android的基本了解的情况下,我们需要再扩充以下知识:

1.WindowManager

Android中我们可以使用WindowManager来生成悬浮窗。WindowManager的三个最常用方法为:

  • addView 添加View
    addView(View view, WindowManager.LayoutParams params);
    View就是要添加到windowmanager中的对象,而params是窗口的设置参数,这个我们讲到代码阶段再说。

  • removeView 移除View
    removeView(View view);
    从windowmanager中移除对象。

  • updateViewLayout刷新View
    updateViewLayout(View view, ViewGroup.LayoutParams params);
    也是两个参数,一个View一个params,参考addView。

在此Demo中,我们可以通过WindowManager来新建一个悬浮窗,悬浮窗的布局通过addView添加、悬浮窗更改位置通过updateViewLayout进行刷新、关闭悬浮窗时调用removeView,跟窗口说再见。

2.Service

作为四大组件之一,大家应该都有所了解和学习,我就不细说了。
在这里我们要以一个Service作为WindowManager的依托对象。在这里我们不使用Bind Service,这样达不到我们制作一个空游无所依的简易悬浮窗的目的。在Service的onBind方法中return null就好了。

onBind return null

当然,这里放一个郭大神的Service专讲链接,需要的请点这里
http://blog.csdn.net/guolin_blog/article/details/11952435

好了没了。Demo毕竟要越简单越好,要不看得头疼。

设计思路分析

本Demo的设计思路如下:

  1. 一个MainActivity作为App的窗口,APP在打开时启动MainAcitivity,MainActivity在确定权限等操作后转到Service并关闭自己。
  2. 一个Service作为Windowmanager的载体。在Service中我们进行悬浮窗的初始设置并开启它。
  3. WindowManager,配套一个XML文件,里面是悬浮窗的布局和里面的各种组件,本Demo中就放一个小小的ImageButton。

跟我一起动手做

  1. 我们新建一个Project,这个Project有一个MainActivity。Demo中的MainActivity就用BlackActivity。

  2. 有了MainActivity后,我们要去除掉它的XML文件,在MainActivity中仅保留以下代码

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) 
    {
        super.onCreate(savedInstanceState);
    }
}

然后,把layout文件夹中MainActivity对应的XML文件放心地删除。

  1. 创建一个Service的Java文件,在Demo中我把它取名为MainService。
    该Service的onBind直接return一个null就行了,另外一定要在Manifest文件中注册它。
注意检查是否进行了Service注册
  1. 在MainActivity中启动Service并且让MainActivity结束自己。
    注意,这里重点来了。
    在Android 6.0后,Android需要动态获取权限,要使用权限,不仅仅要在Manifest文件中定义,还要在代码中动态获取
    详细了解请看这里,有专业级介绍。
    http://blog.csdn.net/caroline_wendy/article/details/50587230
    我们就直奔主题吧
//当AndroidSDK>=23及Android版本6.0及以上时,需要获取OVERLAY_PERMISSION.
//使用canDrawOverlays用于检查,下面为其源码。其中也提醒了需要在manifest文件中添加权限.
        /**
         * Checks if the specified context can draw on top of other apps. As of API
         * level 23, an app cannot draw on top of other apps unless it declares the
         * {@link android.Manifest.permission#SYSTEM_ALERT_WINDOW} permission in its
         * manifest, <em>and</em> the user specifically grants the app this
         * capability. To prompt the user to grant this approval, the app must send an
         * intent with the action
         * {@link android.provider.Settings#ACTION_MANAGE_OVERLAY_PERMISSION}, which
         * causes the system to display a permission management screen.
         *
         */
if (Build.VERSION.SDK_INT >= 23) {
            if (Settings.canDrawOverlays(MainActivity.this)) {
                Intent intent = new Intent(MainActivity.this, MainService.class);
                Toast.makeText(MainActivity.this,"已开启Toucher",Toast.LENGTH_SHORT).show();
                startService(intent);
                finish();
            } else {
                //若没有权限,提示获取.
                Intent intent = new Intent(Settings.ACTION_MANAGE_OVERLAY_PERMISSION);
                Toast.makeText(MainActivity.this,"需要取得权限以使用悬浮窗",Toast.LENGTH_SHORT).show();
                startActivity(intent);
            }
        } else {
            //SDK在23以下,不用管.
            Intent intent = new Intent(MainActivity.this, MainService.class);
            startService(intent);
            finish();
        }
}

上面的代码是要写的动态权限检测,同时在Manifest文件中还要添加对应权限,我粘贴的源码中也提示我们了。
我们需要两个权限,一个ALERT_WINDOW,一个OVERLAY_WINDOW

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

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.lightingcontour.toucher">

    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
    <uses-permission android:name="android.permission.SYSTEM_OVERLAY_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=".MainService"/>
    </application>

</manifest>

好了这里Manifest文件和MainActivity就定型了,下一步。

  1. 设置layout
    这里我就不细说了,我就放了一个ImageButton上去,布局大小设置为了300*300,贴了个自己的背景。
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="300dp"
    android:layout_height="300dp"
    android:background="@drawable/background">

    <ImageButton
        android:id="@+id/imageButton1"
        android:layout_width="30dp"
        android:layout_height="30dp"
        android:background="@android:drawable/btn_star_big_on"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        tools:layout_constraintBottom_creator="1"
        tools:layout_constraintLeft_creator="1"
        tools:layout_constraintRight_creator="1"
        tools:layout_constraintTop_creator="1" />

</android.support.constraint.ConstraintLayout>
  1. 最后一个重点来了。这里我们要开始码我们的Service了
  • 第零步:
    添加以下的全局变量,以便之后的赋值:
//Log用的TAG
private static final String TAG = "MainService";

    //要引用的布局文件.
    ConstraintLayout toucherLayout;
    //布局参数.
    WindowManager.LayoutParams params;
    //实例化的WindowManager.
    WindowManager windowManager;

    ImageButton imageButton1;

    //状态栏高度.(接下来会用到)
    int statusBarHeight = -1;
  • 第一步:在onCreate函数中生成悬浮窗
@Override
    public void onCreate()
    {
        super.onCreate();
        Log.i(TAG,"MainService Created");
        //OnCreate中来生成悬浮窗.
        createToucher();
    }

下面的代码分解开实在是太耗费排版,故我在代码中已经做了简要的注释说明。更多的小细节附在代码后。

private void createToucher()
    {
        //赋值WindowManager&LayoutParam.
        params = new WindowManager.LayoutParams();
        windowManager = (WindowManager) getApplication().getSystemService(Context.WINDOW_SERVICE);
        //设置type.系统提示型窗口,一般都在应用程序窗口之上.
        params.type = WindowManager.LayoutParams.TYPE_SYSTEM_ALERT;
        //设置效果为背景透明.
        params.format = PixelFormat.RGBA_8888;
        //设置flags.不可聚焦及不可使用按钮对悬浮窗进行操控.
        params.flags = WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE;

        //设置窗口初始停靠位置.
        params.gravity = Gravity.LEFT | Gravity.TOP;
        params.x = 0;
        params.y = 0;

        //设置悬浮窗口长宽数据.
        //注意,这里的width和height均使用px而非dp.这里我偷了个懒
        //如果你想完全对应布局设置,需要先获取到机器的dpi
        //px与dp的换算为px = dp * (dpi / 160).
        params.width = 300;
        params.height = 300;

        LayoutInflater inflater = LayoutInflater.from(getApplication());
        //获取浮动窗口视图所在布局.
        toucherLayout = (ConstraintLayout) inflater.inflate(R.layout.toucherlayout,null);
        //添加toucherlayout
        windowManager.addView(toucherLayout,params);

        Log.i(TAG,"toucherlayout-->left:" + toucherLayout.getLeft());
        Log.i(TAG,"toucherlayout-->right:" + toucherLayout.getRight());
        Log.i(TAG,"toucherlayout-->top:" + toucherLayout.getTop());
        Log.i(TAG,"toucherlayout-->bottom:" + toucherLayout.getBottom());

        //主动计算出当前View的宽高信息.
        toucherLayout.measure(View.MeasureSpec.UNSPECIFIED,View.MeasureSpec.UNSPECIFIED);

        //用于检测状态栏高度.
        int resourceId = getResources().getIdentifier("status_bar_height","dimen","android");
        if (resourceId > 0)
        {
            statusBarHeight = getResources().getDimensionPixelSize(resourceId);
        }
        Log.i(TAG,"状态栏高度为:" + statusBarHeight);

        //浮动窗口按钮.
        imageButton1 = (ImageButton) toucherLayout.findViewById(R.id.imageButton1);

        //其他代码...
   }

简要说明
1.Params的各种设置是在做什么:
大家大略看完上面的代码后应该会明白,我们设置了params的各种值,再让它成为我们要生成的悬浮窗的参数集。
这里我简要说明就好了,细节请看这里
http://www.jianshu.com/p/95ceb0a2ed27

  • type 它用于表示悬浮窗的类型。类型太多太多,这里我们可以使用SYSTEM_ALERT,它覆盖在所有应用的最上方,符合我们的需求。附上源码。其实我试过TYPE_PHONE也是可以的。
/**
 * Window type: system window, such as low power alert. These windows
 * are always on top of application windows.
 * In multiuser systems shows only on the owning user's window.
 */
  • format 用于设置显示的格式。RGBA_8888是透明型,也是我们最常用到的了。
  • flags 这是很重要的一个设置。FLAG_NOT_FOCUSABLE设置了不可聚焦,代码中注释好了的。同时我们经常用的还有FLAG_WATCH_OUTSIDE_TOUCH,这个设置可以让悬浮窗接收到外部点击事件,如果你想在之后做小悬浮窗点击变大,再点击悬浮窗之外又变回小悬浮窗。这个可以用到。多个FLAG的话可以用|来连接,如
    params.flags = FLAG_NOT_FOCUSABLE | FLAG_WATCH_OUTSIDE_TOUCH
  • gravity 用于设置窗口的初始停靠位置。我们设置的是让它初始在最左&最上方生成,后面两句是定义这里的xy值都为0。
  • width&height用于设置悬浮窗口的大小,建议设置成和布局一样大最好。小于布局会把里面的组件进行挤压。
  1. 为什么要测试状态栏高度:
    这位作者告诉了我们。
    http://blog.csdn.net/a_running_wolf/article/details/50477965
    简而言之就是应用区域!=屏幕区域。这里得到状态栏宽度用于在之后更新悬浮窗时计算偏移量。
  • 第二步 图片按钮设置了连续点击两下退出悬浮窗。关闭Service使用stopSelf()方法。
imageButton1.setOnClickListener(new View.OnClickListener() {
            long[] hints = new long[2];
            @Override
            public void onClick(View v) {
                Log.i(TAG,"点击了");
                System.arraycopy(hints,1,hints,0,hints.length -1);
                hints[hints.length -1] = SystemClock.uptimeMillis();
                if (SystemClock.uptimeMillis() - hints[0] >= 700)
                {
                    Log.i(TAG,"要执行");
                    Toast.makeText(MainService.this,"连续点击两次以退出",Toast.LENGTH_SHORT).show();
                }else
                {
                    Log.i(TAG,"即将关闭");
                    stopSelf();
                }
            }
        });
  • 第三步 给图片按钮设置OnTouchListener,让悬浮窗可以拖动。
imageButton1.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                //ImageButton我放在了布局中心,布局一共300dp
                params.x = (int) event.getRawX() - 150;
                //这就是状态栏偏移量用的地方
                params.y = (int) event.getRawY() - 150 - statusBarHeight;
                windowManager.updateViewLayout(toucherLayout,params);
                return false;
            }
        });
  • 第四步 OnDestroy时销毁WindowManager
 @Override
    public void onDestroy()
    {
        //用imageButton检查悬浮窗还在不在,这里可以不要。优化悬浮窗时要用到。
        if (imageButton1 != null)
        {
            windowManager.removeView(toucherLayout);
        }
        super.onDestroy();
    }

当当当当,悬浮窗编写完毕啦,可以AVD上跑起来试试了。

结语

这里的悬浮窗Demo比较简单,适合新手。剩下的美化什么的就由各位自己去发掘了。
另外这里有个小问题,在华为手机上Toast一直没法显示出来,其他机型都可以。奇特的华为。如果有解决方案欢迎评论在下方。

源码在GitHub,地址https://github.com/LightingContour/Toucher
如有疑问或纰漏,欢迎询问指正

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,761评论 5 460
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,953评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,998评论 0 320
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,248评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,130评论 4 356
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,145评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,550评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,236评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,510评论 1 291
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,601评论 2 310
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,376评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,247评论 3 313
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,613评论 3 299
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,911评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,191评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,532评论 2 342
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,739评论 2 335

推荐阅读更多精彩内容