微信小程序自定义控件--toast(仿Android)

本文介绍了如何在微信小程序中创建一个自定义的Toast控件,仿照Android样式。通过复制并集成特定的文件到项目的相应目录,可以方便地在各页面使用此Toast功能。详细步骤包括将.utils/toast文件夹导入、在wxss、wxml和js文件中添加代码,以及参考源码进行使用。
摘要由CSDN通过智能技术生成

github地址:https://github.com/LinweiJ/wega_weapp

有用的话,随手给课心吧!

一.toast

1.将/utils/toast文件夹copy到根目录下的utils

2.copy以下代码 到所需page目录xxx.wxss,或者 多个页面使用,直接导入app.wxss 全局都可使用(建议)

/* 导入toast样式 */
@import "utils/toast/toast.wxss";

3.copy以下代码到所需page目录xxx.wxml

<!-- toast 提示框 -->
<include src="../../utils/toast/toast.wxml" />

4.copy以下代码到所需page目录xxx.js

/**
 * toast提示框
 */
var toast = require('../../utils/toast/toast.js');

5.使用

//全屏可点击 默认1500ms 类似android toast
toast.showToastDefault(page, toastText)
//全屏不可点击 默认 2000ms
toast.showToastWithMask(page, toastText)
//可定制 
toast.showToast(page, toastText, count, isShowMask)
//参数
page:页面
toastText:提示文字
count:显示时间
isShowMask:是否显示蒙层

6.参考

更多细节参考wega_weapp/pages/toast_demo/

7.源码

  • toast.js
// toast.js

/**
 * 显示toast 默认3000ms
 */
function showToast
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值