今天给大家分享下自己用悬浮按钮点击实现翻页效果的例子。

首先,一个按钮要实现悬浮,就要用到系统顶级窗口相关的WindowManager,WindowManager.LayoutParams。那么在AndroidManifest.xml中添加权限:

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

然后,我们要对WindowManager,WindowManager.LayoutParams的相关属性进行下设置:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
private WindowManager wm=null;
private WindowManager.LayoutParams wmParams=null;
 
private void initFloatView(){
    //获取WindowManager
    wm=(WindowManager)getApplicationContext().getSystemService("window");
    //设置LayoutParams(全局变量)相关参数
     wmParams = new WindowManager.LayoutParams();
         
    wmParams.type=LayoutParams.TYPE_PHONE;   //设置window type
    wmParams.format=PixelFormat.RGBA_8888;   //设置图片格式,效果为背景透明
     //设置Window flag
    wmParams.flags=LayoutParams.FLAG_NOT_TOUCH_MODAL
                     | LayoutParams.FLAG_NOT_FOCUSABLE;
 
    //以屏幕左上角为原点,设置x、y初始值
     wmParams.x=0;
    wmParams.y=0;
    //设置悬浮窗口长宽数据
     wmParams.width=50;
    wmParams.height=50;
}

通过WindowManager的addView方法创建的View可以实现悬浮窗口效果!因此,我们需要为屏幕创建2个悬浮按钮了。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
    /**
    * 创建左边悬浮按钮
    */
    private void createLeftFloatView(){
        leftbtn=new ImageView(this);
        leftbtn.setImageResource(R.drawable.prev);
        leftbtn.setAlpha(0);
        leftbtn.setOnClickListener(new View.OnClickListener() {
        public void onClick(View arg0) {
            //上一篇
        }
    });
        //调整悬浮窗口
        wmParams.gravity=Gravity.LEFT|Gravity.CENTER_VERTICAL;
        //显示myFloatView图像
        wm.addView(leftbtn, wmParams);
    }
    /**
    * 创建右边悬浮按钮
    */
    private void createRightFloatView(){
        rightbtn=new ImageView(this);
        rightbtn.setImageResource(R.drawable.next);
        rightbtn.setAlpha(0);
        rightbtn.setOnClickListener(new View.OnClickListener() {   
        public void onClick(View arg0) {
            //下一篇
        }
    });
        //调整悬浮窗口
        wmParams.gravity=Gravity.RIGHT|Gravity.CENTER_VERTICAL;
        //显示myFloatView图像
        wm.addView(rightbtn, wmParams);
    }

我把图片的Alpha值设置为0,是因为不想让悬浮按钮一开始就展现出来;我想通过对屏幕的触摸来实现悬浮按钮的渐变显示和渐变隐藏。那么我们还要对图片的渐变效果进行下处理:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
    // ImageView的alpha值  
    private int mAlpha = 0;
    private boolean isHide;
    /**
     * 图片渐变显示处理
     */
    private Handler mHandler = new Handler()
    {
    public void handleMessage(Message msg) {
        if(msg.what==1 && mAlpha<255){  
        //System.out.println("---"+mAlpha);                
        mAlpha += 50;
        if(mAlpha>255)
            mAlpha=255;
             leftbtn.setAlpha(mAlpha);
             leftbtn.invalidate();
             rightbtn.setAlpha(mAlpha);
             rightbtn.invalidate();
        if(!isHide && mAlpha<255)
            mHandler.sendEmptyMessageDelayed(1, 100);
        }else if(msg.what==0 && mAlpha>0){
        //System.out.println("---"+mAlpha);
        mAlpha -= 10;
        if(mAlpha<0)
            mAlpha=0;
        leftbtn.setAlpha(mAlpha);
        leftbtn.invalidate();
        rightbtn.setAlpha(mAlpha);
        rightbtn.invalidate();
        if(isHide && mAlpha>0)
            mHandler.sendEmptyMessageDelayed(0, 100);
        }          
    }
    };

我们再用2个方法分别来控制悬浮按钮的显示、隐藏:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
private void showFloatView(){
    isHide = false;
    mHandler.sendEmptyMessage(1);
}
 
private void hideFloatView(){
new Thread(){
    public void run() {
    try {
               Thread.sleep(1500);
               isHide = true;
               mHandler.sendEmptyMessage(0);
         } catch (Exception e) {
                ;
         }
    }
}.start();
}

这里为了不让悬浮按钮显示后,马上就开始隐藏。我使用了一个线程,先暂停1.5秒钟,再开始渐变隐藏。
接下来,我要重写Activity的onTouchEvent触屏事件,代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_MOVE:
        case MotionEvent.ACTION_DOWN:
        //System.out.println("========ACTION_DOWN");
        showFloatView();           
        break;
        case MotionEvent.ACTION_UP:
        //System.out.println("========ACTION_UP");
        hideFloatView();               
        break;
    }
    return true;
    }

最后,要在Activity销毁时销毁悬浮按钮,不然悬浮按钮会一直悬浮在那。因此,我们要再重写Activity的onDestroy()方法,并调用WindowManager的removeView()方法来移除悬浮按钮。

1
2
3
4
5
6
7
    @Override
    public void onDestroy(){
        super.onDestroy();
        //在程序退出(Activity销毁)时销毁悬浮窗口
        wm.removeView(leftbtn);
        wm.removeView(rightbtn);
    }

给大家展示下效果图:

下面是程序的完整代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
package com.liux.pageflipper;
 
import android.app.Activity;
import android.graphics.PixelFormat;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.view.Gravity;
import android.view.MotionEvent;
import android.view.View;
import android.view.WindowManager;
import android.view.WindowManager.LayoutParams;
import android.widget.ImageView;
import android.widget.ViewFlipper;
/**
 * 悬浮按钮实现翻篇效果
 * <a href="http://my.oschina.net/arthor" target="_blank" rel="nofollow">@author</a> liux  http://my.oschina.net/liux
 * @date 2012-2-10 下午2:48:52
 */
public class PageFlipperActivity extends Activity{
     
    private WindowManager wm=null;
    private WindowManager.LayoutParams wmParams=null;
     
    private ImageView leftbtn=null;
    private ImageView rightbtn=null;
     
    // ImageView的alpha值  
    private int mAlpha = 0;
    private boolean isHide;
     
    private ViewFlipper viewFlipper = null;
     
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
         
        viewFlipper = (ViewFlipper) this.findViewById(R.id.myViewFlipper);
         
        //初始化悬浮按钮
         initFloatView();
     
    }
    /**
     * 初始化悬浮按钮
     */
    private void initFloatView(){
        //获取WindowManager
        wm=(WindowManager)getApplicationContext().getSystemService("window");
        //设置LayoutParams(全局变量)相关参数
        wmParams = new WindowManager.LayoutParams();
         
        wmParams.type=LayoutParams.TYPE_PHONE;   //设置window type
        wmParams.format=PixelFormat.RGBA_8888;   //设置图片格式,效果为背景透明
         //设置Window flag
        wmParams.flags=LayoutParams.FLAG_NOT_TOUCH_MODAL
                               | LayoutParams.FLAG_NOT_FOCUSABLE;
 
        //以屏幕左上角为原点,设置x、y初始值
         wmParams.x=0;
        wmParams.y=0;
        //设置悬浮窗口长宽数据
         wmParams.width=50;
        wmParams.height=50;
         
        //创建悬浮按钮
         createLeftFloatView();
        createRightFloatView();
    }
     
    /**
     * 创建左边悬浮按钮
     */
    private void createLeftFloatView(){
        leftbtn=new ImageView(this);
        leftbtn.setImageResource(R.drawable.prev);
        leftbtn.setAlpha(0);
        leftbtn.setOnClickListener(new View.OnClickListener() {
                public void onClick(View arg0) {
        //上一篇
        viewFlipper.setInAnimation(PageFlipperActivity.this, R.anim.in_leftright);
        viewFlipper.setOutAnimation(PageFlipperActivity.this, R.anim.out_leftright);
        viewFlipper.showPrevious();
        }
    });
        //调整悬浮窗口
          wmParams.gravity=Gravity.LEFT|Gravity.CENTER_VERTICAL;
         //显示myFloatView图像
          wm.addView(leftbtn, wmParams);
    }
    /**
     * 创建右边悬浮按钮
     */
    private void createRightFloatView(){
        rightbtn=new ImageView(this);
        rightbtn.setImageResource(R.drawable.next);
        rightbtn.setAlpha(0);
         rightbtn.setOnClickListener(new View.OnClickListener() {  
        public void onClick(View arg0) {
        //下一篇
        viewFlipper.setInAnimation(PageFlipperActivity.this, R.anim.in_rightleft);
        viewFlipper.setOutAnimation(PageFlipperActivity.this, R.anim.out_rightleft);
        viewFlipper.showNext();
        }
    });
        //调整悬浮窗口
          wmParams.gravity=Gravity.RIGHT|Gravity.CENTER_VERTICAL;
         //显示myFloatView图像
          wm.addView(rightbtn, wmParams);
    }
    /**
     * 图片渐变显示处理
     */
    private Handler mHandler = new Handler()
    {
    public void handleMessage(Message msg) {
                if(msg.what==1 && mAlpha<255){  
        //System.out.println("---"+mAlpha);                
        mAlpha += 50;
        if(mAlpha>255)
                mAlpha=255;
        leftbtn.setAlpha(mAlpha);
        leftbtn.invalidate();
        rightbtn.setAlpha(mAlpha);
        rightbtn.invalidate();
        if(!isHide && mAlpha<255)
            mHandler.sendEmptyMessageDelayed(1, 100);
        }else if(msg.what==0 && mAlpha>0){
        //System.out.println("---"+mAlpha);
        mAlpha -= 10;
        if(mAlpha<0)
            mAlpha=0;
        leftbtn.setAlpha(mAlpha);
        leftbtn.invalidate();
        rightbtn.setAlpha(mAlpha);
        rightbtn.invalidate();
        if(isHide && mAlpha>0)
            mHandler.sendEmptyMessageDelayed(0, 100);
        }          
    }
    };
     
    private void showFloatView(){
        isHide = false;
        mHandler.sendEmptyMessage(1);
    }
     
    private void hideFloatView(){
    new Thread(){
                public void run() {
            try {
                 Thread.sleep(1500);
                 isHide = true;
                 mHandler.sendEmptyMessage(0);
            } catch (Exception e) {
                 ;
            }
        }
    }.start();
    }
     
    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_MOVE:
        case MotionEvent.ACTION_DOWN:
        //System.out.println("========ACTION_DOWN");
        showFloatView();           
        break;
        case MotionEvent.ACTION_UP:
        //System.out.println("========ACTION_UP");
        hideFloatView();               
        break;
    }
    return true;
    }
 
    @Override
    public void onDestroy(){
        super.onDestroy();
        //在程序退出(Activity销毁)时销毁悬浮窗口
        wm.removeView(leftbtn);
        wm.removeView(rightbtn);
    }
}

附上源码http://www.oschina.net/code/snippet_157182_8608

Android用悬浮按钮实现翻页效果的更多相关文章

  1. Android 实现书籍翻页效果----升级篇

    自从之前发布了<Android 实现书籍翻页效果----完结篇 >之后,收到了很多朋友给我留言,前段时间由于事情较多,博客写得太匆忙很多细节地方没有描述清楚.所以不少人对其中的地方有不少不 ...

  2. Android 滑动效果高级篇(七)—— 华丽翻页效果

    By 何明桂(http://blog.csdn.net/hmg25) 转载请注明出处 之前看到像ipad上的ibook的模拟书籍翻页的特效感觉很炫,在android上也有像laputa和ireader ...

  3. Android平台中的三种翻页效果机器实现原理

    本文给开发者集中展现了Android平台中的三种翻页效果机器实现原理,希望能够对开发者有实际的帮助价值! 第一种翻页效果如下:     实现原理: 当前手指触摸点为a,则 a点坐标为(ax,ay), ...

  4. Android 实现书籍翻页效果----完结篇

    By 何明桂(http://blog.csdn.net/hmg25) 转载请注明出处 之前由于种种琐事,暂停了这个翻页效果的实现,终于在这周末完成了大部分功能,但是这里只是给出了一个基本的雏形,没有添 ...

  5. android之实现上下左右翻页效果

    如果实现上下或者左右翻页效果,我们借助下这个开源项目:https://github.com/openaphid/android-flip Aphid FlipView是一个能够实现Flipboard翻 ...

  6. webapp应用--模拟电子书翻页效果

    前言: 现在移动互联网发展火热,手机上网的用户越来越多,甚至大有超过pc访问的趋势.所以,用web程序做出仿原生效果的移动应用,也变得越来越流行了.这种程序也就是我们常说的单页应用程序,它也有一个英文 ...

  7. (旧)子数涵数·PS ——翻页效果

    一.首先在网络上下载一张图片,作为素材.这是我下载的素材,至于为什么选择这张照片呢,当然不是因为自己的一些羞羞的念头啦. 二.打开Photoshop,我使用的版本是CS3(因为CS3所占的磁盘空间较小 ...

  8. Activity切换动画(overridePendingTransition)-翻页效果

    Activity的切换动画指的是从一个activity跳转到另外一个activity时的动画.{它包括两个部分:一部分是第一个activity退出时的动画:另外一部分时第二个activity进入时的动 ...

  9. ViewPager实现滑动翻页效果

    实现ViewPager的滑动翻页效果可以使用ViewPager的setPageTransformer方法,如下: import android.content.Context; import andr ...

随机推荐

  1. codeforces Mafia

    /* * Mafia.cpp * * Created on: 2013-10-12 * Author: wangzhu */ /** * 每个人都想玩若干场,求至少需要玩几场才可以满足大家的需求. * ...

  2. [codility]Grocery-store

    http://codility.com/demo/take-sample-test/hydrogenium2013 用Dijkstra求最短路径,同时和D[i]比较判断是不是能到.用了优先队列优化,复 ...

  3. *[codility]ArrayInversionCount

    http://codility.com/demo/take-sample-test/arrayinversioncount 求逆序对数,归并排序并记录逆序次数. // you can also use ...

  4. [jobdu]二进制中1的个数

    做法是n&(n-1).据说还有变态的查表法:http://www.cnblogs.com/graphics/archive/2010/06/21/1752421.html.最后,居然必须用sc ...

  5. Windows 内核(WRK)编译

    引子 WRK 是微软于 2006 年针对教育和学术界开放的 Windows 内核的部分源码, WRK(Windows Research Kernel)也就是 Windows 研究内核, 在 WRK 中 ...

  6. 批量生成卡号密码的php程序

    <?php header('Content-Type:text/html; charset=utf-8'); function MakeCard() { set_time_limit(0); / ...

  7. linux如何安装jdk

    一.安装 创建安装目录,在/usr/java下建立安装路径,并将文件考到该路径下: # mkdir /usr/java 1.jdk-6u11-linux-i586.bin 这个是自解压的文件,在lin ...

  8. Server.MapPath()目录详解

    最近在做相关的开发,碰到了Server.MapPath(),顺便来温习一下 Server.MapPath()获取网站的目录详解  ./当前目录 /网站主目录 ../上层目录 ~/网站虚拟目录 如果当前 ...

  9. nginx 健康检查和负载均衡机制分析

    nginx 是优秀的反向代理服务器,这里主要讲它的健康检查和负载均衡机制,以及这种机制带来的问题.所谓健康检查,就是当后端出现问题(具体什么叫出现问题,依赖 于具体实现,各个实现定义不一样),不再往这 ...

  10. 【原】Scala学习资料

    Scala是基于JVM的一种通用函数式也是面向对象编程语言,能和Java.C#等主流的编程语言无缝融合. 下面给大家推荐一些Scala的学习资料,序号靠前的重要性比较高. 1.Scala初学指南 (1 ...