mui-app混合app、插件开发
文章平均质量分 78
专注写bug
你知道的越多,你不知道的也越多!
展开
-
MUI——聊天窗口
文章目录前言聊天布局分析页面布局消息展示和消息输入框,发送按钮布局完整页面布局和逻辑分析注意事项获取详细库前言前段时间使用MUI做了个APP,客户提出想法,能否增加一个可以聊天的功能,用来保证工单系统中所有参与角色的交流。好的,安排!聊天布局分析需要实现一个可供聊天的窗口,需要优先分析其布局的构成。参考QQ或者微信的聊天群,大致可以看出具有以下的共通点:1、群聊窗口需要有信息展示窗口。2、自己发送的消息显示在右边,别人发送的聊天消息显示在左边。3、需要有一个触发软键盘的输入框,和一个发送原创 2022-01-17 20:32:50 · 1830 阅读 · 0 评论 -
MUI——记一个numbox的使用和bug
文章目录前言页面布局bug复现解决方式结果前言再mui框架中,提供有numbox 数字输入框的另类方式。官网文档连接如下所示:https://dev.dcloud.net.cn/mui/ui/#numbox但再使用中,却发现了一个不优雅的bug!页面布局先定义一个num box的界面布局:<div class="mui-input-row" id="deadlineDiv" > <label>工单期限</label> <div class="原创 2022-01-11 21:51:24 · 541 阅读 · 0 评论 -
JS——appendChild()和insertBefore()插入新节点区别
文章目录前言appendChild(newchild)insertBefore(newchild, refchild)参考资料前言在html中,如果需要动态的插入数据标签(li、a等),则需要使用到标题所示的appendChild()或insertBefore()来实现。这两种方法都具有插入新元素至指定的容器中的功能,但他们却有很大的区别。appendChild(newchild)appendChild()的字面意思append和child,从起名中可以看出,插入元素的位置为末尾。向当前节点的原创 2022-01-05 16:12:49 · 1973 阅读 · 0 评论 -
MUI——做一个列表下拉后标题提供双击回到顶部的效果
文章目录首页显示项界面滚动监听双击回到顶部实现首页显示项<header class="mui-bar mui-bar-nav" id="backToTop"> <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a> <h1 class="mui-title" id="headerText">锁资源选择</h1></header>原创 2021-11-30 18:21:19 · 640 阅读 · 0 评论 -
Android BLE蓝牙踩坑总结
文章目录简介题外话问题集锦一、扫描问题1、扫描不到设备2、有时候刚开始扫描还正常,过段时间扫描不到设备?3、为什么有些手机退到后台扫描不到设备二、连接问题1、为什么同时多个设备连接时经常连接不成功?2、为什么有时候连接成功了,但是发现不了服务及特征值,进而影响数据的接收和发送。3、为什么连接成功后,过不一会又断开了?4、最大连接数问题5、连接api的使用问题6、为什么连接总是报133、19之类的非0异常三、数据发送问题1、为什么连接成功了,发送数据总是失败?2、为什么要分包发送简介自从Android-B转载 2021-11-19 16:36:32 · 3249 阅读 · 0 评论 -
MUI——Android BLE插件之Notify
文章目录回顾notify通信注意回顾需要参考学习BLE通信的可以看看之前的博客:使用Android插件形式进行BLE开发(读写)微信小程序——Ble之notify通信微信小程序开发----BLE蓝牙通信(读写)notify通信扫描、连接、开启服务等操作,和之前的使用Android插件形式进行BLE开发(读写)保持一致。再开启通信服务成功之后,需要在此处开启notify数据监听操作。当监听开启成功,则需要在gatt回执中的onCharacteristicChanged获取数据变化监听。开启n原创 2021-08-23 16:01:14 · 848 阅读 · 0 评论 -
MUI——二维码正反码识别(jsQR)
文章目录前言jsQR简介Demo测试效果前言公司一次意外操作,把二维码打印弄成了一个黑底白字的图,然鹅官方的plus.barcode.scan扫不出来,网上查了下,发现是此时的二维码是反码。给DCloud官方提了建议,也没回,客户催的急,这段时间重点研究了下反码。上篇博客,就自己写了个简单的算法,将反码二维码转换成正码。但操作太过复杂。有兴趣的可以看看上篇博客地址:MUI——图片反码转换并保存本地或相册中在GitHub闲逛,看见了个工具类jsQR.js,可以一行代码动态识别正反码。jsQR简介原创 2021-04-22 22:20:44 · 1516 阅读 · 1 评论 -
MUI——前端拉取摄像头并截屏
文章目录转载出处使用mui开发关于前置和后置摄像头问题转载出处HTML5+JavaScript调用摄像头拍照或者摄像使用mui开发毕竟上述是网页版的,在部分MUI基座上并不适用,做了相应修改,总体代码如下所示:<!doctype html><html> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" content=转载 2021-04-22 21:12:29 · 377 阅读 · 0 评论 -
MUI——图片反码转换并保存本地或相册中
文章目录前言使用到的技术代码案例测试效果前言最开始发现,css样式中有一个标签,可以实现图片的反码转换。filter: invert(100%);可以反色转换,但却发现再MUI中,修改标签的属性,却并未变更。document.getElementById("img").style.invertSelection ="invert(100%)"; //无效后来考虑使用canvas画布技术。使用到的技术canvas 画布plus.gallery.pick 相册获取图片plus.nativeO原创 2021-04-19 20:21:17 · 412 阅读 · 0 评论 -
MUI框架app开发中下拉刷新经验之谈
做项目遇到了下拉刷新执行不了,但上拉加载时却可以,楼主使用的是android手机,遇到问题时懵逼,问题解决后,唉,不详多说,只想说dcloud坑爹唉。废话不多说,找问题找了半天,结果才发现一个致命的问题!android手机的下拉刷新需要 父子html文件嵌套!! 对,你没听错,就是嵌套!!!本小白就不上代码了,源码你们可以在HBuilder中新建app项目选择mui范例去找,可以直原创 2018-01-16 00:29:46 · 900 阅读 · 0 评论 -
MUI——下拉刷新上拉加载
前言WEB界面,针对多个页面的数据请求显示,一般都采取分页查询显示的操作。在APP中,也有类似的分页操作,其中使用最多的就是下拉刷新和上拉加载。下拉刷新在官方文档中,列举了嵌套webview或者单webview的方式实现下拉刷新操作。但是配置起来相对有点繁琐,需要配置页面加载时的部分效果初始化配置等。下面讲述另外一种配置方式实现下拉刷新的同等效果。// 页面加载,无需配置额外的mui.init();var self;mui.plusReady(function() { self = plu原创 2020-12-17 16:59:21 · 663 阅读 · 0 评论 -
MUI——混合APP开发之离线打包
打包前的准备1、android-sdk-windows Android环境2、Eclipse创建android项目使用eclipse创建Android项目,其他博客上有相关概述。创建html保存文件在assets/apps中,创建一个新的文件夹名称(可以随意定义),此处名称为chancelock。在assets/apps/chance路径下创建一个新的文件夹www,注意此名称不能改变。在assets/apps/chancelock/www下保存mui-html文件信息。修改mani原创 2020-12-02 15:19:44 · 863 阅读 · 3 评论 -
mui 弹窗返回无效问题和解决
场景点击按钮后,返回上一页。代码mui.alert("6666!", '温馨提示', '确定', function() { mui.back();}, 'div');此时,弹窗会出现。但点击确定后,工作台中会出现如下问题:问题解决这种问题算MUI框架本身的一种异常机制。可以采取如下代码逻辑实现返回操作:mui.alert("6666!", '温馨提示', '确定', function() { plus.webview.currentWebview().close();}, 'div原创 2020-09-24 17:56:43 · 778 阅读 · 0 评论 -
MUI——使用Android插件形式进行BLE开发
一、BLE是什么BLE是低功耗蓝牙。二、Android开发BLE前的准备Eclipse或者其他编辑器Android-SDK@1.9.9.56749_20181226-1Android手机一部BLE设备一个(无需配对的设备)三、基本概念通用属性配置文件 (GATT)GATT 配置文件是一种通用规范,内容针对在 BLE 链路上发送和接收称为“属性”的简短数据片段。目前所有低功耗应用配置文件均以 GATT 为基础。服务Service服务是一个特征对象的集合,通常UUID为16字节原创 2020-06-10 13:13:05 · 1268 阅读 · 5 评论 -
mui混合开发——比较软件版本
一、说明1、app版本号由4块数字组成。2、比较版本号,若新版本号比当前版本号高,则提示需要升级操作。二、案例//比较版本大小,如果新版本大于获取到的版本,则返回true function compareVersion(newVersion, oldVersion) { //如果未获取到正确的version值 返回false if (!newVersion || !...原创 2019-11-27 15:35:38 · 333 阅读 · 0 评论 -
MUI混合app开发——点击地图获取点击处的经纬度信息
一、写代码前的准备本次实例,采取高德地图的api辅助完成。前往高德地图开发中心申请获取定位key。二、demo<!doctype html><html> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" con...原创 2019-11-12 17:10:34 · 489 阅读 · 0 评论 -
mui混合开发——扫描二维码和识别本地二维码图片
一、权限调取 H5+ 扫描和识别本地图片信息需要权限。"permissions": { "Camera": {}, "Gallery": { "description": "系统相册" },}二、参考资料和api识别本地图片二维码扫描识别三、实现demo<!doctype html><html> <head> <me...原创 2019-11-08 15:30:16 · 1087 阅读 · 4 评论 -
MUI混合开发——使用picker做日期时间选择
一、需要用到的组件界面引用<link href="../css/mui.min.css" rel="stylesheet" /><link rel="stylesheet" type="text/css" href="../css/mui.picker.all.css" /><link rel="stylesheet" type="text/css"...原创 2019-10-22 11:26:47 · 1192 阅读 · 0 评论 -
mui混合开发——获取input type="data"的value值
一、视图布局<input type="date" id="startTime" value="" style="background-color: #F7F7F7;"></input>二、获取value如果此时选择信息后,直接采取jquery的val()获取数据,此时绝对是空的!!如何解决呢?三、jquery获取value为空的解决方式doc...原创 2019-10-17 16:31:07 · 1305 阅读 · 0 评论 -
mui混合开发——扫描二维码和条形码
方式一:.mask { height: 100%; width: 100%; position: absolute; top: 44px; /*background: rgba(0, 0, 0, 0.5);*/ background-color: #000000; } body { margin: 0; /*...原创 2019-12-02 14:26:26 · 1519 阅读 · 0 评论 -
mui框架中H5+获取经纬度信息详解
plus.geolocation.getCurrentPosition(function(p){ alert('Geolocation\nLatitude:' + p.coords.latitude + '\nLongitude:' + p.coords.longitude + '\nAltitude:' + p.coords.altitude); console.log('Geoloca...原创 2018-06-21 11:36:53 · 2561 阅读 · 0 评论 -
细数mui框架走过的坑
一、mui.alert()、mui.confirm()等弹窗系列mui会根据ua判断,弹出原生对话框还是h5绘制的对话框,在基座中默认会弹出原生对话框,可以配置type属性,使得弹出h5模式对话框两者区别:1.原生对话框可以跨webview,2.h5对话框样式统一而且可以修改对话框属性或样式这是mui开发文档ui部分中对dialog的一句描述,其实不难理解,在离线打包app后,如果你使用mui.a...原创 2018-06-21 22:22:24 · 4830 阅读 · 0 评论 -
MUI框架Android混合开发地图模块
最近做地图模块,感觉踩了无数个坑,不过总算琢磨出来了。最开始使用的是mui框架默认的百度地图,唉,那叫自己给自己挖坑,Hubuilder在线模拟可以正常显示地图信息,并能设置地图中心点等,但在离线打包,各种空指针,琢磨一天,郁闷。空指针问题不算什么,至少算bug,可以解,但特么我用gps定位,百度地图偏差显示达到1KM,这个就过分了啊!!!!!不抱怨了,自己已跳出百度地图的坑,找到了替代方法。说完...原创 2018-06-08 18:17:28 · 2562 阅读 · 2 评论 -
再读MUI混合插件开发文档
说实话,官方的文档很难看懂,在经历了几个项目的插件开发后,对插件开发有了个人的理解,同时也深感mui框架开发人员的不易,废话不多说,mui混合插件开发传送通道! 对于开发文档,相信很多人看了之后都觉得头大,我也不例外,可能还不如你们,我当时看评论区,看见很多牛人说看完照敲一遍,基本就会了,楼主我坐在电脑面前,看文档3天才撸出来一个简单的事例出来,惭愧!...原创 2018-06-29 22:18:26 · 2795 阅读 · 0 评论 -
mui框架之经纬度信息获取回调
plus.geolocation.getCurrentPosition(function(p) { console.log('Geolocation\nLatitude:' + p.coords.latitude + '\nLongitude:' + p.coords.longitude + '\nAltitude:' + p.coords.altitude); }...原创 2018-06-29 22:31:42 · 936 阅读 · 0 评论 -
mui混合开发————获取手机经纬度信息
mui框架针对手机获取经纬度信息,其实做的可以,华为荣耀系列手机以及小米手机可以正常通过plus.geolocation.getCurrentPosition进行获取经纬度信息,但对于其他类型手机Android版本为5.1的则会存在不兼容的情况,导致调用上面的代码直接进入失败回调。针对不同手机型号和系统版本,本宝宝做了个插件,测试还行,但手上机型不多,还请大家广提建议,现在上代码package c...原创 2018-06-19 12:03:06 · 2015 阅读 · 5 评论 -
混合开发--查找文件插件开发
package com.linkpower.smartlockdemo.jctest.files;import java.io.File;import java.io.FileInputStream;import java.io.FileNotFoundException;import java.io.IOException;import java.io.InputStream;i...原创 2018-07-03 18:22:15 · 293 阅读 · 0 评论 -
MUI-APP开发之mui框架封装获取文件方式
<!doctype html><html> <head> <meta charset="UTF-8"> <title></title> <meta name="viewport" content="width=device-width,initial-scale原创 2018-07-03 18:27:18 · 5824 阅读 · 2 评论 -
最近团队用h5+做了一个app,需要使用java做原生插件,现在分享下经验
这篇博客是我之前写的,现在看来没啥好的知识点,帮助不了大家,于今天进行内容更改。接下来我将对于我做的app之中,插件的制作做一个说明和讲解吧,大家先看,有问题记得通知我哦,免得我一错再错。第一步,查看官方插件开发实例,下载相关工具文件和进行环境的准备,跳转连接。第二步,官方的不好理解,看我的另外一篇博客吧,虽然只写了异步回调的,《再读mui混合插件开发文档》。第三步,相关实例:缓存...原创 2018-01-16 00:10:27 · 4512 阅读 · 1 评论 -
MUI混合app开发---switches开关点击状态的变更(jquery和mui两种方式的实现)
一、switches在mui框架中的使用二、样式布局的实现<div class="mui-content-padded"> <ul class="mui-table-view"> <li class="mui-table-view-cell"> <span></span> <d...原创 2019-04-28 16:57:53 · 628 阅读 · 0 评论 -
mui混合开发——双击header头回至顶部
一、页面header布局<header class="mui-bar mui-bar-nav" id="backToTop"> <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a> <h1 class="mui-title" >列表</h1&g...原创 2019-09-30 11:29:03 · 298 阅读 · 0 评论 -
MUI混合开发——更新下载app时,系统状态栏显示下载进度
一、最开始的想法本来最开始公司使用mui制作的app,没有系统状态栏显示下载进度的,后来突发奇想想要实现像qq等app下载更新或消息提示等在系统状态栏显示的效果,特意去研究了下。在H5+plus api中没有发现存在有设置系统通知栏的支持,于是采取android开发的方式,实现功能。大致功能描述: 大致就是这种操作啦,下面像大家展示插件开发的方式实现上述功能。二、系统通...原创 2019-10-09 15:51:22 · 2925 阅读 · 10 评论 -
MUI混合开发——输入法软键盘“确认”监听
一、创建一个输入框<div class="mui-content" style="margin-top: 5px;"> <div class="mui-input-row mui-search mui-plus-visible" id="searchDiv"> <input id="search" type="search" class="mui-inpu...原创 2019-10-10 11:40:37 · 722 阅读 · 0 评论 -
app清理缓存,此方法适用于mui框架开发app人员参考,使用的是插件开发
app清理缓存,此方法适用于mui框架开发app人员参考,使用的是插件开发,之前采取mui框架自带的清理缓存方式,计算到的缓存大小永远都是0,今天测试发现不行,毕竟在android系统设置中有缓存的显示。废话不多说,直接说规则。看我的代码的需要大家会使用插件混合开发,对插件开发不熟悉的可以看我之前的博客!首先时插件js文件document.addEventListener("plusready",...原创 2018-04-16 23:02:41 · 2799 阅读 · 0 评论