更新记录

1.0.0（2025-03-02）

• 发布插件

平台兼容性

uni-app

uni-app x

概述

• 支持控制悬浮窗自定义显示(支持多个显示)，隐藏，修改，位置，尺寸，拖动
• 支持悬浮窗点击事件
• 支持悬浮窗显示到应用外

温馨提示 如何调用插件

  import {
  initIcon,
  showIcon,
  hideIcon,
  changeIcon,
  getResourcePath
} from "@/uni_modules/yuange-floatwindow"

初始化

let p = {
  widthRatio: this.widthRatio, //根据屏幕宽度比例，设置悬浮窗宽度
  heightRatio: this.heightRatio, //根据屏幕宽度比例，设置悬浮窗高度
  xRatio: this.xRatio, //根据屏幕宽度比例，设置悬浮窗x轴起始位置
  yRatio: this.yRatio, //根据屏幕高度比例，设置悬浮窗y轴起始位置
  moveType: this.moveType, //拖动效果，1：不可拖动、2：任意拖动、3：贴边拖动、4：回弹拖动
  slideLeftMargin: this.slideLeftMargin, //左侧贴边位置，支持负数
  slideRightMargin: this.slideRightMargin, //右侧贴边位置，支持负数
  duration: this.duration, //间隔时间ms
  tag: this.tag, //为该弹窗设置标识，以做区分，用于多个
  iconPath: getResourcePath('logo.png')  //当前工程static目录下图片路径
};
initIcon(JSON.stringify(p), {
  success(res) {
    console.log(JSON.stringify(res));
  },
  fail(err) {
    console.log(JSON.stringify(err));
  }
});

显示悬浮窗

  let p = {
  tag: this.tag
};
showIcon(JSON.stringify(p), {
  success(res) {
    //点击事件的回调也在这里 例如 {"data":"{\"action\":\"click\",\"tag\":\"default_float_window_tag\"}","code":200,"msg":"操作成功"}
    console.log(JSON.stringify(res));
  },
  fail(err) {
    console.log(JSON.stringify(err));
  }
});

隐藏悬浮窗

 let parm = {
  tag: this.tag
}
hideIcon(JSON.stringify(parm), {
  success(res) {
    console.log(JSON.stringify(res));
  },
  fail(err) {
    console.log(JSON.stringify(err));
  }
});

修改悬浮窗

//getResourcePath接口是传入项目根目录static文件夹下的图片名称
const staticPath = getResourcePath('logo.png')
console.log('static路径:', staticPath);
let parm = {
  tag: this.tag,
  iconPath: staticPath
}
changeIcon(JSON.stringify(parm), {
  success(res) {
    console.log(JSON.stringify(res));
  },
  fail(err) {
    console.log(JSON.stringify(err));
  }
});