zoukankan      html  css  js  c++  java
  • [转]Android用悬浮按钮实现翻页效果

    原文地址 http://www.open-open.com/lib/view/open1328883424280.html

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

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

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


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

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

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

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

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

    01     // ImageView的alpha值  
    02     private int mAlpha = 0;
    03     private boolean isHide;
    04     /**
    05      * 图片渐变显示处理
    06      */
    07     private Handler mHandler = new Handler()
    08     {
    09     public void handleMessage(Message msg) {
    10         if(msg.what==1 && mAlpha<255){  
    11         //System.out.println("---"+mAlpha);                
    12         mAlpha += 50;
    13         if(mAlpha>255)
    14             mAlpha=255;
    15              leftbtn.setAlpha(mAlpha);
    16              leftbtn.invalidate();
    17              rightbtn.setAlpha(mAlpha);
    18              rightbtn.invalidate();
    19         if(!isHide && mAlpha<255)
    20             mHandler.sendEmptyMessageDelayed(1100);
    21         }else if(msg.what==0 && mAlpha>0){
    22         //System.out.println("---"+mAlpha);
    23         mAlpha -= 10;
    24         if(mAlpha<0)
    25             mAlpha=0;
    26         leftbtn.setAlpha(mAlpha);
    27         leftbtn.invalidate();
    28         rightbtn.setAlpha(mAlpha);
    29         rightbtn.invalidate();
    30         if(isHide && mAlpha>0)
    31             mHandler.sendEmptyMessageDelayed(0100);
    32         }          
    33     }
    34  
    35     };

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

    01 private void showFloatView(){
    02     isHide = false;
    03     mHandler.sendEmptyMessage(1);
    04 }
    05  
    06 private void hideFloatView(){
    07 new Thread(){
    08     public void run() {
    09     try {
    10                Thread.sleep(1500);
    11                isHide = true;
    12                mHandler.sendEmptyMessage(0);
    13          catch (Exception e) {
    14                 ;
    15          }
    16     }
    17 }.start();
    18 }

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

    01     @Override
    02  
    03     public boolean onTouchEvent(MotionEvent event) {
    04         switch (event.getAction()) {
    05             case MotionEvent.ACTION_MOVE:
    06         case MotionEvent.ACTION_DOWN:
    07         //System.out.println("========ACTION_DOWN");
    08         showFloatView();           
    09         break;
    10         case MotionEvent.ACTION_UP:
    11         //System.out.println("========ACTION_UP");
    12         hideFloatView();               
    13         break;
    14     }
    15     return true;
    16     }

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

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

    给大家展示下效果图:
    Android用悬浮按钮实现翻页效果

    下面是程序的完整代码:

    001 package com.liux.pageflipper;
    002  
    003 import android.app.Activity;
    004 import android.graphics.PixelFormat;
    005 import android.os.Bundle;
    006 import android.os.Handler;
    007 import android.os.Message;
    008 import android.view.Gravity;
    009 import android.view.MotionEvent;
    010 import android.view.View;
    011 import android.view.WindowManager;
    012 import android.view.WindowManager.LayoutParams;
    013 import android.widget.ImageView;
    014 import android.widget.ViewFlipper;
    015 /**
    016  * 悬浮按钮实现翻篇效果
    017  * <a href="http://my.oschina.net/arthor" rel="nofollow" target="_blank">@author</a> liux  http://my.oschina.net/liux
    018  * @date 2012-2-10 下午2:48:52
    019  */
    020 public class PageFlipperActivity extends Activity{
    021      
    022     private WindowManager wm=null;
    023     private WindowManager.LayoutParams wmParams=null;
    024      
    025     private ImageView leftbtn=null;
    026     private ImageView rightbtn=null;
    027      
    028     // ImageView的alpha值  
    029     private int mAlpha = 0;
    030     private boolean isHide;
    031      
    032     private ViewFlipper viewFlipper = null;
    033      
    034     @Override
    035     public void onCreate(Bundle savedInstanceState) {
    036         super.onCreate(savedInstanceState);
    037         setContentView(R.layout.main);
    038          
    039         viewFlipper = (ViewFlipper) this.findViewById(R.id.myViewFlipper);
    040          
    041         //初始化悬浮按钮
    042          initFloatView();
    043      
    044     }
    045     /**
    046      * 初始化悬浮按钮
    047      */
    048     private void initFloatView(){
    049         //获取WindowManager
    050         wm=(WindowManager)getApplicationContext().getSystemService("window");
    051         //设置LayoutParams(全局变量)相关参数
    052         wmParams = new WindowManager.LayoutParams();
    053          
    054         wmParams.type=LayoutParams.TYPE_PHONE;   //设置window type
    055         wmParams.format=PixelFormat.RGBA_8888;   //设置图片格式,效果为背景透明
    056          //设置Window flag
    057         wmParams.flags=LayoutParams.FLAG_NOT_TOUCH_MODAL
    058                                | LayoutParams.FLAG_NOT_FOCUSABLE;
    059  
    060         //以屏幕左上角为原点,设置x、y初始值
    061          wmParams.x=0;
    062         wmParams.y=0;
    063         //设置悬浮窗口长宽数据
    064          wmParams.width=50;
    065         wmParams.height=50;
    066          
    067         //创建悬浮按钮
    068          createLeftFloatView();
    069         createRightFloatView();
    070  
    071     }
    072      
    073     /**
    074      * 创建左边悬浮按钮
    075      */
    076     private void createLeftFloatView(){
    077         leftbtn=new ImageView(this);
    078         leftbtn.setImageResource(R.drawable.prev);
    079         leftbtn.setAlpha(0);
    080         leftbtn.setOnClickListener(new View.OnClickListener() {
    081                 public void onClick(View arg0) {
    082         //上一篇
    083         viewFlipper.setInAnimation(PageFlipperActivity.this, R.anim.in_leftright);
    084         viewFlipper.setOutAnimation(PageFlipperActivity.this, R.anim.out_leftright);
    085         viewFlipper.showPrevious();
    086         }
    087     });
    088         //调整悬浮窗口
    089           wmParams.gravity=Gravity.LEFT|Gravity.CENTER_VERTICAL;
    090          //显示myFloatView图像
    091           wm.addView(leftbtn, wmParams);
    092     }
    093     /**
    094      * 创建右边悬浮按钮
    095      */
    096     private void createRightFloatView(){
    097         rightbtn=new ImageView(this);
    098         rightbtn.setImageResource(R.drawable.next);
    099         rightbtn.setAlpha(0);
    100          rightbtn.setOnClickListener(new View.OnClickListener() {  
    101         public void onClick(View arg0) {
    102         //下一篇
    103         viewFlipper.setInAnimation(PageFlipperActivity.this, R.anim.in_rightleft);
    104         viewFlipper.setOutAnimation(PageFlipperActivity.this, R.anim.out_rightleft);
    105         viewFlipper.showNext();
    106         }
    107     });
    108         //调整悬浮窗口
    109           wmParams.gravity=Gravity.RIGHT|Gravity.CENTER_VERTICAL;
    110          //显示myFloatView图像
    111           wm.addView(rightbtn, wmParams);
    112     }
    113     /**
    114      * 图片渐变显示处理
    115      */
    116     private Handler mHandler = new Handler()
    117     {
    118     public void handleMessage(Message msg) {
    119  
    120                 if(msg.what==1 && mAlpha<255){  
    121         //System.out.println("---"+mAlpha);                
    122         mAlpha += 50;
    123         if(mAlpha>255)
    124                 mAlpha=255;
    125         leftbtn.setAlpha(mAlpha);
    126         leftbtn.invalidate();
    127         rightbtn.setAlpha(mAlpha);
    128         rightbtn.invalidate();
    129         if(!isHide && mAlpha<255)
    130             mHandler.sendEmptyMessageDelayed(1100);
    131         }else if(msg.what==0 && mAlpha>0){
    132         //System.out.println("---"+mAlpha);
    133         mAlpha -= 10;
    134         if(mAlpha<0)
    135             mAlpha=0;
    136         leftbtn.setAlpha(mAlpha);
    137         leftbtn.invalidate();
    138         rightbtn.setAlpha(mAlpha);
    139         rightbtn.invalidate();
    140         if(isHide && mAlpha>0)
    141             mHandler.sendEmptyMessageDelayed(0100);
    142         }          
    143     }
    144  
    145     };
    146      
    147     private void showFloatView(){
    148         isHide = false;
    149         mHandler.sendEmptyMessage(1);
    150     }
    151      
    152     private void hideFloatView(){
    153     new Thread(){
    154                 public void run() {
    155             try {
    156                  Thread.sleep(1500);
    157                  isHide = true;
    158                  mHandler.sendEmptyMessage(0);
    159             catch (Exception e) {
    160                  ;
    161             }
    162         }
    163     }.start();
    164     }
    165      
    166     @Override
    167     public boolean onTouchEvent(MotionEvent event) {
    168         switch (event.getAction()) {
    169             case MotionEvent.ACTION_MOVE:
    170         case MotionEvent.ACTION_DOWN:
    171         //System.out.println("========ACTION_DOWN");
    172         showFloatView();           
    173         break;
    174         case MotionEvent.ACTION_UP:
    175         //System.out.println("========ACTION_UP");
    176         hideFloatView();               
    177         break;
    178     }
    179     return true;
    180     }
    181  
    182     @Override
    183     public void onDestroy(){
    184         super.onDestroy();
    185         //在程序退出(Activity销毁)时销毁悬浮窗口
    186         wm.removeView(leftbtn);
    187         wm.removeView(rightbtn);
    188     }
    189 }
  • 相关阅读:
    nginx 正向代理 反向代理 负载均衡
    nginx配置文件常用基本配置指令
    92)http 和https协议入门
    tp6--nginx下pathinfo配置
    tp6省略url里的index.php
    echarts鼠标移上去显示数据
    composer 下载thinkphp6失败
    tp5写入cookie失效
    4.15 Spring Cloud理论基础
    4.14 SpringBoot理论基础
  • 原文地址:https://www.cnblogs.com/franksunny/p/2451419.html
Copyright © 2011-2022 走看看