Android实现自由拖动并显示文字的悬浮框

项目中需要实现一个状态显示的悬浮框,要求可以设置两种模式:拖动模式和不可拖动模式。

实现效果图如下:

实现步骤:

1.首先要设置该悬浮框的基本属性:

/**
  * 显示弹出框
  *
  * @param context
  */
 @SuppressWarnings("WrongConstant")
 public static void showPopupWindow(final Context context, String showtxt) {
  if (isShown) {
   return;
  }
  isShown = true;
  // 获取WindowManager
  mWindowManager = (WindowManager) context
    .getSystemService(Context.WINDOW_SERVICE);
  mView = setUpView(context, showtxt);

  params = new WindowManager.LayoutParams();
  // 类型,系统提示以及它总是出现在应用程序窗口之上。
  params.type = WindowManager.LayoutParams.TYPE_SYSTEM_ALERT |
    WindowManager.LayoutParams.TYPE_SYSTEM_OVERLAY;

  // 设置flag
  int flags = canTouchFlags;

  // | WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE;
  // 如果设置了WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE,弹出的View收不到Back键的事件
  params.flags = flags;
  // 不设置这个弹出框的透明遮罩显示为黑色
  params.format = PixelFormat.TRANSLUCENT;
  // FLAG_NOT_TOUCH_MODAL不阻塞事件传递到后面的窗口
  // 设置 FLAG_NOT_FOCUSABLE 悬浮窗口较小时,后面的应用图标由不可长按变为可长按
  // 不设置这个flag的话,home页的划屏会有问题
  params.width = LayoutParams.WRAP_CONTENT;
  params.height = LayoutParams.WRAP_CONTENT;
  params.gravity = Gravity.TOP;
  mWindowManager.addView(mView, params);
}

比较重要的点是要注意设置flags,我这里提供了两种flags以供切换:

private static int canTouchFlags = WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE
   | WindowManager.LayoutParams.FLAG_NOT_TOUCH_MODAL;

 private static int notTouchFlags = WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE|
   WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE;

第一种是可触摸不可聚焦模式,第二种是不可触摸不可聚焦模式。其他的flags可以从api中查阅。

2.设置悬浮框的拖动监听事件:

private static View setUpView(final Context context, String showtxt) {
  View view = LayoutInflater.from(context).inflate(R.layout.layout_popwindow,
    null);

  TextView showTv = (TextView) view.findViewById(R.id.tv_showinpop);
  showTv.setText(showtxt);

  rl_drag_showinpop = (RelativeLayout) view.findViewById(R.id.rl_drag_showinpop);
  rl_drag_showinpop.setOnTouchListener(new View.OnTouchListener() {
   private float lastX; //上一次位置的X.Y坐标
   private float lastY;
   private float nowX; //当前移动位置的X.Y坐标
   private float nowY;
   private float tranX; //悬浮窗移动位置的相对值
   private float tranY;

   @Override
   public boolean onTouch(View v, MotionEvent event) {
    boolean ret = false;
    switch (event.getAction()) {
     case MotionEvent.ACTION_DOWN:

      // 获取按下时的X,Y坐标
      lastX = event.getRawX();
      lastY = event.getRawY();
      ret = true;

      break;
     case MotionEvent.ACTION_MOVE:
      // 获取移动时的X,Y坐标
      nowX = event.getRawX();
      nowY = event.getRawY();
      // 计算XY坐标偏移量
      tranX = nowX - lastX;
      tranY = nowY - lastY;
      params.x += tranX;
      params.y += tranY;

      //更新悬浮窗位置
      mWindowManager.updateViewLayout(mView, params);
      //记录当前坐标作为下一次计算的上一次移动的位置坐标
      lastX = nowX;
      lastY = nowY;

      break;
     case MotionEvent.ACTION_UP:
      break;
    }
    return ret;
   }
});

这里要在down的时候记录坐标,move事件中使用修改params坐标进行移动。

3.设置悬浮框文字属性:

public static void setShowTxt(String txt) {
  try {
   TextView showTv = (TextView) mView.findViewById(R.id.tv_showinpop);
   showTv.setText(txt);
   mWindowManager.updateViewLayout(mView, params);
  }catch (Exception e){
   Log.d(TAG, "setShowTxt: 更新悬浮框错误");
   e.printStackTrace();
   if(e.getMessage().contains("not attached to window manager")){
    mWindowManager.addView(mView, params);
   }
  }
}

4.更新悬浮框图片显示:

public static void setShowImg(Bitmap bitmap) {
  try {
   ImageView showImg = (ImageView) mView.findViewById(R.id.iv_showinpop);
   showImg.setImageBitmap(bitmap);
   mWindowManager.updateViewLayout(mView, params);
  }catch (Exception e){
   Log.d(TAG, "setShowTxt: 更新悬浮框错误");
   e.printStackTrace();
   if(e.getMessage().contains("not attached to window manager")){
    mWindowManager.addView(mView, params);
   }
  }
 }

介绍完毕,整个类都封装好了,代码如下:

/**
 * 悬浮窗工具类
 * created by Pumpkin at 17/3/28
 */
public class WindowsUitlity {
 private static String TAG = WindowsUitlity.class.getSimpleName();
 private static WindowManager mWindowManager = null;
 private static WindowManager.LayoutParams params;
 public static Boolean isShown = false;
 private static View mView = null;

 /**
  * 显示弹出框
  *
  * @param context
  */
 @SuppressWarnings("WrongConstant")
 public static void showPopupWindow(final Context context, String showtxt) {
  if (isShown) {
   return;
  }
  isShown = true;
  // 获取WindowManager
  mWindowManager = (WindowManager) context
    .getSystemService(Context.WINDOW_SERVICE);
  mView = setUpView(context, showtxt);

  params = new WindowManager.LayoutParams();
  // 类型,系统提示以及它总是出现在应用程序窗口之上。
  params.type = WindowManager.LayoutParams.TYPE_SYSTEM_ALERT |
    WindowManager.LayoutParams.TYPE_SYSTEM_OVERLAY;

  // 设置flag
  int flags = canTouchFlags;

  // | WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE;
  // 如果设置了WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE,弹出的View收不到Back键的事件
  params.flags = flags;
  // 不设置这个弹出框的透明遮罩显示为黑色
  params.format = PixelFormat.TRANSLUCENT;
  // FLAG_NOT_TOUCH_MODAL不阻塞事件传递到后面的窗口
  // 设置 FLAG_NOT_FOCUSABLE 悬浮窗口较小时,后面的应用图标由不可长按变为可长按
  // 不设置这个flag的话,home页的划屏会有问题
  params.width = LayoutParams.WRAP_CONTENT;
  params.height = LayoutParams.WRAP_CONTENT;
  params.gravity = Gravity.TOP;
  mWindowManager.addView(mView, params);
 }

 private static int canTouchFlags = WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE
   | WindowManager.LayoutParams.FLAG_NOT_TOUCH_MODAL;

 private static int notTouchFlags = WindowManager.LayoutParams.FLAG_NOT_FOCUSABLE|
   WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE;

 /**
  * 设置是否可响应点击事件
  *
  * @param isTouchable
  */
 public static void setTouchable(boolean isTouchable) {
  if (isTouchable) {
   params.flags = canTouchFlags;
  } else {
   params.flags = notTouchFlags;
  }
  mWindowManager.updateViewLayout(mView, params);

 }

 /**
  * 隐藏弹出框
  */
 public static void hidePopupWindow() {
  if (isShown && null != mView) {
   mWindowManager.removeView(mView);
   isShown = false;
  }
 }

 public static void setShowTxt(String txt) {
  try {
   TextView showTv = (TextView) mView.findViewById(R.id.tv_showinpop);
   showTv.setText(txt);
   mWindowManager.updateViewLayout(mView, params);
  }catch (Exception e){
   Log.d(TAG, "setShowTxt: 更新悬浮框错误");
   e.printStackTrace();
   if(e.getMessage().contains("not attached to window manager")){
    mWindowManager.addView(mView, params);
   }
  }
 }

 public static void setShowImg(Bitmap bitmap) {
  try {
   ImageView showImg = (ImageView) mView.findViewById(R.id.iv_showinpop);
   showImg.setImageBitmap(bitmap);
   mWindowManager.updateViewLayout(mView, params);
  }catch (Exception e){
   Log.d(TAG, "setShowTxt: 更新悬浮框错误");
   e.printStackTrace();
   if(e.getMessage().contains("not attached to window manager")){
    mWindowManager.addView(mView, params);
   }
  }
 }

 static RelativeLayout rl_drag_showinpop;

 private static View setUpView(final Context context, String showtxt) {
  View view = LayoutInflater.from(context).inflate(R.layout.layout_popwindow,
    null);

  TextView showTv = (TextView) view.findViewById(R.id.tv_showinpop);
  showTv.setText(showtxt);

  rl_drag_showinpop = (RelativeLayout) view.findViewById(R.id.rl_drag_showinpop);
  rl_drag_showinpop.setOnTouchListener(new View.OnTouchListener() {
   private float lastX; //上一次位置的X.Y坐标
   private float lastY;
   private float nowX; //当前移动位置的X.Y坐标
   private float nowY;
   private float tranX; //悬浮窗移动位置的相对值
   private float tranY;

   @Override
   public boolean onTouch(View v, MotionEvent event) {
    boolean ret = false;
    switch (event.getAction()) {
     case MotionEvent.ACTION_DOWN:

      // 获取按下时的X,Y坐标
      lastX = event.getRawX();
      lastY = event.getRawY();
      ret = true;

      break;
     case MotionEvent.ACTION_MOVE:
      // 获取移动时的X,Y坐标
      nowX = event.getRawX();
      nowY = event.getRawY();
      // 计算XY坐标偏移量
      tranX = nowX - lastX;
      tranY = nowY - lastY;
      params.x += tranX;
      params.y += tranY;

      //更新悬浮窗位置
      mWindowManager.updateViewLayout(mView, params);
      //记录当前坐标作为下一次计算的上一次移动的位置坐标
      lastX = nowX;
      lastY = nowY;

      break;
     case MotionEvent.ACTION_UP:
      break;
    }
    return ret;
   }
  });

  return view;
 }
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • Android实现通话最小化悬浮框效果

    大家在使用主流的视频软件以及直播软件的时候,经常会看到打开视频最小化以后,不是直接关闭,而是在屏幕右下角一个小窗口的样子,本次小编就给大家带来的是用Android实现在视频或者语音通话的时候,最小化也是出现一个悬浮框的效果. 关于音视频通话过程中最小化成悬浮框这个功能的实现,网络上类似的文章很多,但是好像还没看到解释的较为清晰的,这里因为项目需要实现了这样的一个功能,今天我把它记录下来,一方面为了以后用到便于自己查阅,一方面也给有需要的人提供一个思路,让大家少走弯路.这里我也是参考了些有关And

  • Android实现全局悬浮框

    本文实例为大家分享了Android实现全局悬浮框的具体代码,供大家参考,具体内容如下 效果图: 代码实现: Androidmanifest.xml添加弹框权限 <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW" /> 自定义悬浮窗类FloatWindow.java public class FloatWindow implements View.OnTouchListener { pr

  • Android实现自由拖动并显示文字的悬浮框

    项目中需要实现一个状态显示的悬浮框,要求可以设置两种模式:拖动模式和不可拖动模式. 实现效果图如下: 实现步骤: 1.首先要设置该悬浮框的基本属性: /** * 显示弹出框 * * @param context */ @SuppressWarnings("WrongConstant") public static void showPopupWindow(final Context context, String showtxt) { if (isShown) { return; }

  • Vue实现鼠标经过文字显示悬浮框效果的示例代码

    需求 在所做的Vue项目中,需要在鼠标移动文字框的时候显示一些详细信息.最终实现的效果如下: 鼠标经过button的时候,可以在光标附近显示出一个悬浮框,显示框里面显示时间和值的信息,鼠标移出button元素的时候,这个显示框会消失. 分析 涉及到鼠标的移动事件. 鼠标事件有下面这几种: 1.onclick(鼠标点击事件) box.onclick = function(e){ console.log(e) } 2.onmousedown(鼠标按下事件) box.onmousedown = fun

  • vue实现鼠标经过显示悬浮框效果

    本文实例为大家分享了vue实现鼠标经过显示悬浮框效果的具体代码,供大家参考,具体内容如下 项目架构采用vue-cli脚手架搭建的webpack项目 实现的效果如下: 鼠标经过button 右边显示出一个悬浮框 鼠标移出buttom元素 悬浮框隐藏 并且悬浮框可以随着鼠标的移动而改变位置 全部代码如下: <template>   <div class="hello">     <div id="focus_toolTip" class=&

  • Android实现GridView中的item自由拖动效果

    之前的工作中,需要实现一个功能就是GridView中的item可以自由拖动, 思考了一下,其实实现起来不是很困难,主要工作就是交换节点,以及拖动时的移动效果,下面讲讲具体的实现: 首先声明一个BaseAdapter: package com.dafasoft.dragablegridview; import android.content.Context; import android.view.LayoutInflater; import android.view.View; import a

  • Android编程开发实现TextView显示表情图像和文字的方法

    本文实例讲述了Android编程开发实现TextView显示表情图像和文字的方法.分享给大家供大家参考,具体如下: 从这个案例中我们可以学到当我们美化图片美化界面的时候可以在某一区域输入图片和文字混搭信息,第三张图片按比例缩小,第四张图像有超链接 布局文件 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.andro

  • Android 自定义控件实现显示文字的功能

    Android 自定义控件实现显示文字的功能 自定义控件-–逐个显示文字 ONE Goal ,ONE Passion ! 前言: 今天要实现的效果时.让我们的文字一个一个显示出来.上效果图吧: 实现原理: 1,拿到要显示的文字. 2,计算文字显示的速率 字体显示的速度 v = 总的字体长度 / 总的显示时间 3,将文字根据速率显示到控件上. 自定义View: public class printTextView extends TextView { /** * 字体显示出来的时间 */ priv

  • Android的ImageButton当显示Drawable图片时就不显示文字

    很多人对 Android提供的ImageButton有个疑问,当显示Drawable图片时就不会再显示文字了,其实解决的方法有三种: 第一种:就是图片中就写入文字,但是这样解决会增加程序体积,同时硬编码方式会影响多国语言的发布. 第二种:解决方法很简单,通过分析可以看到ImageButton的 layout,我们可以直接直接继承,添加一个TextView,对齐方式为右侧即可实现ImageButton支持文字右侧显示. 第三种:更简洁效率的方法:使用Button ,然后设定Button 的 and

  • Android TextView中文本点击文字跳转 (代码简单)

    在web页面中,有a标签的超链接实现跳转,同样在Android当中,用TextView控件来显示文字,实现它的事件来跳转. 用过微博Android手机端的朋友的都知道微博正文有时有一些高亮显示的文本,如话题.提到的人等等,当点击这些文本时会跳到另外一个页面(即另一个activity),下面就要来模仿微博的这个功能 点击#hello# 点击@人 一.新建一个名为WeiboContentTest的工程 二.在布局文件中添加一个textview 三.在mainactivity中创建该textview

  • Android仿京东首页轮播文字效果

    京东客户端的轮播文字效果: 本次要实现的只是后面滚动的文字(前面的用ImageView或者TextView实现即可),看一下实现的效果 实现思路 上图只是一个大概的思路,要实现还需要完善更多的细节,下面会一步步的来实现这个效果: 1.封装数据源:从图上可以看到,轮播的文字是分为两个部分的,暂且把它们分别叫做前缀和内容,而且实际的使用过程中点击轮播图肯定是需要跳转页面的,而且大部分应该是WebView,不妨我们就设置点击时候需要获取的内容就是一个链接,那么数据源的结构就很明了了 创建ADEnity

  • C# WinForm实现窗体上控件自由拖动功能示例

    本文实例讲述了C# WinForm实现窗体上控件自由拖动功能.分享给大家供大家参考,具体如下: 说明:首先在窗体上放一个PictrueBox控件,命名为pb1,拖动完整代码如下: using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; using System.Drawing; using System.Linq; using System.Text; usin

随机推荐