【移动端开发】MUI
关注
分享
扫一扫
三天不学习
学海无涯回头是岸
展开
-
uniapp h5+webapi 实现微信浏览器的自定义分享（微信JSSDK）
公众号配置第一步：配置js安全域名（微信公众平台=>公众号设置=>功能设置=>js接口安全域名）第二步：配置白名单（微信公众平台=>基本配置=>ip白名单=>查看，配置多ip，可以换行输入），如果是本地测试，可以在百度中搜索ip，获取本地公网IP地址webapi第一步：获取access_token,access_token是获取其他接口信息的钥匙，所有接口都需要调用access_tokenAccessToken.csusing System;.原创 2021-08-13 17:21:29 · 1185 阅读 · 0 评论 -
Android平台签名证书(.keystore)生成指南
Android平台打包发布apk应用，需要使用数字证书（.keystore文件）进行签名，用于表明开发者身份。Android证书的生成是自助和免费的，不需要审批或付费。可以使用JRE环境中的keytool命令生成。以下是windows平台生成证书的方法：安装JRE环境（如已有可跳过）可从Oracle官方下载jre安装包：https://www.oracle.com/technetw...原创 2019-12-23 13:02:41 · 976 阅读 · 0 评论 -
(十七)图片轮播
本节知识点图片轮播有两种 第一种无缝滚动，第二种不是无缝滚动(一)无缝滚动<!doctype html><html> <head> <meta charset="UTF-8"> <title></title> <meta name=&qu转载 2018-09-24 23:23:02 · 195 阅读 · 0 评论 -
(十八)POST 和get请求
本节知识点 实现POST 请求 实现get请求 (一) get 请求一共四个参数 第一个参数url接口地址 第二个参数发送的数据 第三个参数接受的数据 第四个不用管就是字符串json// get测试请求地址 http://xxxxxmui.get('接口地址',{ //请求接口地址 state:'index' // 参数 键 ：值 num:'...转载 2018-09-24 23:23:42 · 295 阅读 · 0 评论 -
(十九) 照相机
本节知识点调用照相机接口使用 plus.camera.getCamera(); <script> var btn1 = document.querySelector("#btn1"); btn1.addEventListener("tap", function() { var cm...转载 2018-09-24 23:24:20 · 364 阅读 · 0 评论 -
(二十)访问相册
本节知识点访问相册 分为一张和多张 plus.gallery.pick一张的情况<script> var btn1 = document.querySelector("#btn1"); var imgbox = document.querySelector("#imgbox"); btn1.addEve...转载 2018-09-24 23:24:54 · 268 阅读 · 0 评论 -
(二十一)蜂鸣提示音 和手机震动
本节知识点 蜂鸣提示音 plus.device.beep(); 手机震动 plus.device.vibrate(); 蜂鸣提示音plus.device.beep()switch ( plus.os.name ) { //判断设备类型 case "iOS": if ( plus.device.model.indexOf("iPhone") >...转载 2018-09-27 09:23:00 · 1628 阅读 · 0 评论 -
(二十二) 弹出菜单
本节知识点 弹出菜单。不用管那个按钮的位置。系统会自动的把箭头安排到你要的位置上 弹出菜单没有JS代码 全靠ID对应，类似锚点 <a href="#popover">打开弹出菜单</a> // href 定义锚点<div id="popover" class="mui-popover"> //id 对应锚点 <ul clas转载 2018-09-27 09:23:27 · 147 阅读 · 0 评论 -
(二十三) 设备信息和手机信息
本节知识点获取设备的信息设备信息plus.device.xxxplus.device.model //设备型号plus.device.vendor //设备的生产厂商plus.device.imei // IMEI 设备的国际移动设备身份码plus.device.uuid // UUID 设备的唯一标识// IMSI 设备的国际移动用户识别码var str = '';...转载 2018-09-27 09:24:43 · 1505 阅读 · 0 评论 -
(二十四) 发送短信和拨打电话和发送邮件
本节知识点 发送短信 拨打电话 发送邮件 (1) 打电话<a href="tel:10086">拨打电话</a>(2) 发送短信发短信有2种模式 第一种不需要JS直接<a href=“sms:10086">发送短信发短信 第二种模式需要JSvar msg = plus.messaging.createM...转载 2018-09-27 09:25:12 · 511 阅读 · 0 评论 -
(二十五) 本地存储 localStorge
本节知识点 plus 自带的localStorge 本地自带的localStorge plus自带的//设置plus.storage.setItem('键','值'); -> plus.storage.setItem('name','dongyixueyuan');//查询plus.storage.getItem('键'); -> var name =...转载 2018-09-27 09:25:43 · 615 阅读 · 0 评论 -
(二十六) 地理位置
本节知识点获取到地理位置 获取地理位置 监听地理位置 停止监听地理位置 (1) 获取地理位置 plus .geolocation这里没写错/*有2个参数 第一个参数表示就是成功的回调函数，第二个参数就是失败的回调函数*/plus.geolocation.getCurrentPosition(geoInfo, function(e) { alert("获...转载 2018-09-27 09:26:15 · 290 阅读 · 0 评论 -
(二十七) 获取通讯录
本节知识点获取通讯录 plus.contacts.getAddressBook<!doctype html><html> <head> <meta charset="UTF-8"> <title></title> <meta name=&quo转载 2018-09-27 09:26:42 · 747 阅读 · 0 评论 -
免费的天气接口（满足你的大部分需求）
项目中有需要抓取当地天气的需求，在网上找了很多的接口,要么是接口请求次数有限制,要么是数据不全,要么是接口失效，总之是无法很好的提供一个稳定的接口。为此很是头疼的一段时间，然后天不绝人，最终还是在网上找到些比较好用的接口，特此记录下来，方便你我他。1.通过城市名（北京/北京市）获取当前城市当前温度及未来一周天气预报 (Json数据) ：包含台湾的主要县市接口：http://wthrcdn....转载 2018-09-29 16:01:50 · 1156 阅读 · 0 评论 -
(十六) 滑动导航
本节知识点实现滑动选项卡HTML部分<div class="mui-slider"> <!--选项卡标题区--> <div class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted"> <a class="mui-co...转载 2018-09-24 23:22:33 · 248 阅读 · 0 评论 -
(十五) 遮罩
本节知识点 遮罩(蒙版) mask 在popover、侧滑菜单等界面，经常会用到蒙版遮罩；比如popover弹出后，除popover控件外的其它区域都会遮罩一层蒙版，用户点击蒙版不会触发蒙版下方的逻辑，而会关闭popover同时关闭蒙版；再比如侧滑菜单界面，菜单划出后，除侧滑菜单之外的其它区域都会遮罩一层蒙版，用户点击蒙版会关闭侧滑菜单同时关闭蒙版。 遮罩蒙版常用的操作包括：创...转载 2018-09-24 23:22:02 · 227 阅读 · 0 评论 -
(一)MUI初始化
本节学习要点页面初始化 等待页面加载完毕(一) 页面初始化界面初始化就是把一切程序设置为默认状态，把没有准备的准备好MUI把很多功能配置都集中在mui.init里面要使用某项功能只需要在mui.init中完成对应的参数配置即可。目前支持的功能包括，创建子页面，关闭页面，手势配置，预加载，下拉刷新上拉加载等1.首先页面必须要引入MUI的CSS和JS文件<link hre...转载 2018-09-23 15:49:24 · 1804 阅读 · 0 评论 -
（二）加载子页面
本节知识点实现加载子页面需求为了防止上拉加载下拉刷新出现卡顿，所以在加载子页面的时候我们采取的就是除了头部和尾部，中间的部分我们采取的就是加载子页面。重点要记住的就是下面初始化的时候传递参数父元素写的代码<script type="text/javascript"> mui.init({ subpages: [{ ...转载 2018-09-23 15:50:51 · 515 阅读 · 0 评论 -
(三)打开新的页面与等待控制条
本节知识点打开新的页面打开新的页面打开新的页面就必须要要用到mui.openwindow这个函数具体见代码mui.openWindow({ url: 'open.html', //需要打开页面的url地址 id: 'open', //需要打开页面的url页面id ...转载 2018-09-23 15:51:30 · 202 阅读 · 0 评论 -
(四)参数传递
本节知识点实现参数传递mui.plusReady(function(){ var self = plus.webview.currentWebview(); //获得当前页面的对象 var name = self.name; //name 和 age 为传递的参数的键 var age = self.age; console.log(name); ...转载 2018-09-23 15:52:09 · 126 阅读 · 0 评论 -
(五)关闭页面
本节知识点三种方式关闭页面关闭页面点击顶部导航栏的mui-action-back键能返回 右滑关闭页面，默认是关闭状态 安卓系统点击返回键第一个只要有那个类就执行返回事件右滑和点击返回需要在MUI中配置具体见代码 mui.init({ //点击包含.mui-action-back类的控件 swip...转载 2018-09-23 15:52:52 · 284 阅读 · 0 评论 -
(六)底部导航切换页面
本节知识点底部导航切换(一)底部导航切换<!doctype html><html> <head> <meta charset="UTF-8"> <title>底部导航切换页面</title> <meta name="viewpo转载 2018-09-23 15:53:22 · 1119 阅读 · 0 评论 -
（七）自定义事件
本节知识点自定义事件(了解就好了。类似H5的postmessage)自定义事件发送方代码var targetPage = plus.webview.getWebviewById('目标页面id'); mui.fire(targetPage,'shijian',{ //自定义事件参数 name:'dongyixueyuan'});接受方代码window.addEv...转载 2018-09-23 15:53:56 · 132 阅读 · 0 评论 -
(八)预加载页面
本节知识点预加载的两种方式(一)预加载第一种形式mui.init配置preloadPagesmui.init({ // 可同时加载一个或者多个界面 preloadPages:[ //加载一个界面 { url:'a.html', id:'a', styles:{},//窗口参数 extras:{},...转载 2018-09-23 15:54:31 · 836 阅读 · 0 评论 -
（九）消息框时间框和日期框
本节知识点MUI的4种提示框(1) 警告提示框一共3个参数 第一个是内容 第二个是提示，第三个是回调函数mui.alert("欢迎使用MUI警告框","Mui提示",function(){ alert("你刚关闭了警告框");})(2)消息确认框一共四个参数 第一个是内容，第二个是提示的标题，第三个是按钮上面的文字，第四个是回调函数实际情况是在右边，因为让用户去点击...转载 2018-09-23 15:55:02 · 496 阅读 · 0 评论 -
(十) 源生分享(ActionSheet)
本节知识点源生分享组件 <script> mui.plusReady(function() { var btn = document.querySelector("#btn"); //获取按钮 btn.addEventListener("tap", function() { ...转载 2018-09-23 15:55:38 · 221 阅读 · 0 评论 -
(十一)下拉刷新
本节知识点实现下拉刷新为实现下拉刷新功能，大多H5框架都是通过DIV模拟下拉回弹动画，在低端android手机上，DIV动画经常出现卡顿现象（特别是图文列表的情况）； 通过双webview解决这个DIV的拖动流畅度问题；拖动时，拖动的不是div，而是一个完整的webview（子webview），回弹动画使用原生动画；在iOS平台，H5的动画已经比较流畅，故依然使用H5方案。两个平台实现虽有差异...转载 2018-09-24 23:19:57 · 317 阅读 · 0 评论 -
(十二) 上拉加载
本节知识点四步上拉加载(一) 创建子页面具体参照第一讲mui.init({ subpages:[{ url:pullrefresh-subpage-url,//下拉刷新内容页面地址 id:pullrefresh-subpage-id,//内容页面标志 styles:{ top:subpage-top-position,//内容页面顶部位置,需根据...转载 2018-09-24 23:20:28 · 150 阅读 · 0 评论 -
(十三) 下拉刷新和上拉加载合集
本节知识点下拉刷新和上拉加载合集。第一步创建子页面mui.init({ subpages:[{ url:pullrefresh-subpage-url,//下拉刷新内容页面地址 id:pullrefresh-subpage-id,//内容页面标志 styles:{ top:subpage-top-position,//内容页面顶部位置,需根据实际...转载 2018-09-24 23:20:59 · 141 阅读 · 0 评论 -
(十四)事件
本节知识点 MUI 里面的事件 注意移动端 只能用addEventListener 事件合集 tap 单击屏幕 doubletap 双击屏幕 longtap 长按屏幕 hold 按住屏幕 release 离开屏幕 swipeleft 向左边滑动 swipeup 向上边滑动 swipedown 向下边滑动...转载 2018-09-24 23:21:37 · 163 阅读 · 0 评论 -
MUI蓝牙打印（Android）
MUI蓝牙打印（Android）使用MUI开发手机APP时使用蓝牙打印功能可能较少使用，MUI官方并为集成蓝牙打印功能，而且似乎对iPhone蓝牙打印的类库支持也不够完善。忙完一阶段后回顾下之前的工作，想想蓝牙打印功能折腾了够长时间了，写这篇文章既是自己做个总结，也希望能给遇到同样为蓝牙打印功能挣扎的人带来一点帮助。感谢以下几篇文章给予的帮助。Android 蓝牙连接 ESC/POS ...转载 2018-08-27 14:21:45 · 6303 阅读 · 4 评论