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

首先,一个按钮要实现悬浮,就要用到系统顶级窗口相关的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. linux,Centos,bash: service: command not found

    很简单,这个问题是这样的,su 或者 su root:的话只是将当前身份转为root,用户shell并没有改变.所以有些系统命令不能使用. su -或者su -l或者su -l root,可以完全的将 ...

  2. find和findstr

    find与findstr 例“ 在文件中搜索字符串. 1.findstr . 2.txt 或 Findstr "." 2.txt 从文件2.txt中查找任意字符,不包括空字符或空行 ...

  3. VS2010中的调试技巧

    作者: scottgu 这是我的博客中关于VS 2010和.NET 4发布系列的第二十六篇文章. 今天的博文将介绍Visual Studio中的一些实用调试技巧.这是受我朋友Scott Cate (他 ...

  4. 在ASP.NET MVC中实现基于URL的权限控制

    本示例演示了在ASP.NET MVC中进行基于URL的权限控制,由于是基于URL进行控制的,所以只能精确到页.这种权限控制的优点是可以在已有的项目上改动极少的代码来增加权限控制功能,和项目本身的耦合度 ...

  5. Oracle10g数据类型

    1.     字符类型 数据类型 长度 说明 CHAR(n BYTE/CHAR) 默认1字节,n值最大为2000 末尾填充空格以达到指定长度,超过最大长度报错.默认指定长度为字节数,字符长度可以从1字 ...

  6. C#学习:集合、迭代、泛型(1)

    一.System.Collections名称空间下几个接口表征着集合的功能: 1.IEnumerable:表征着迭代功能 public interface IEnumerable { IEnumera ...

  7. Java和C++的区别

    这是一个Java语言和C++语言之间的比较. 目录 [隐藏]  1 设计目标 2 语言特性 2.1 语法 2.2 语义 2.3 资源管理 2.4 库 2.5 运行时 2.6 模板 vs. 泛型 2.7 ...

  8. 洛谷P1294 高手去散步

    洛谷1294 高手去散步 题目背景 高手最近谈恋爱了.不过是单相思.“即使是单相思,也是完整的爱情”,高手从未放弃对它的追求.今天,这个阳光明媚的早晨,太阳从西边缓缓升起.于是它找到高手,希望在晨读开 ...

  9. node系列1

    NodeJS基础 JS是脚本语言,脚本语言都需要一个解析器才能运行,NodeJS就是一个解析器.nodejs.org 打开终端,键入node进入命令交互模式,可以输入一条代码语句后立即执行并显示结果 ...

  10. 无法连接 mysql

    ==================================================================================================== ...