HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

微信分享图片,在苹果上无效怎办呀?

微信分享

同样的代码,

在安桌上是可以正常分享的!
在苹果上就分享不了!

sharewx.send( {pictures:[sd_path],extra:{scene:"WXSceneSession"}}, function(){
plus.nativeUI.alert( "分享成功!" );
}, function(e){
plus.nativeUI.alert( "分享失败!");
});

继续阅读 »

同样的代码,

在安桌上是可以正常分享的!
在苹果上就分享不了!

sharewx.send( {pictures:[sd_path],extra:{scene:"WXSceneSession"}}, function(){
plus.nativeUI.alert( "分享成功!" );
}, function(e){
plus.nativeUI.alert( "分享失败!");
});

收起阅读 »

DCloud开源项目集锦

HBuilder

https://github.com/dcloudio/casecode

https://github.com/dcloudio/casecode

苹果热更新问题,及微信分享问题!!!

今天通过了苹果审核。立即下载软件来测试热更新。

用wgt升级,提示 -1229 | HTML5+ Runtime缺少升级包manifest.json中配置的模块(这里显示了所有模块都缺少)。
同样的在安卓上是没有问题的。打开软件,关闭软件,升级几次后提示文件wgt文件不存在。再服务端把升级文件改名。再升级意处的升级成功了!

后来反复测试,IOS下!大部分时候升级都会提示 Runtime缺少升级包manifest.json中配置的模块(这里显示了所有模块都缺少)。重试的次数多了,就会提示wgt文件不存在,删了软件再重新安装也不行。只能服务端把升级包改名。运气好偶尔可以升级成功。

再碰上一问题,就是微信分享图片,在安卓上没问题,在IOS上分享不了。

继续阅读 »

今天通过了苹果审核。立即下载软件来测试热更新。

用wgt升级,提示 -1229 | HTML5+ Runtime缺少升级包manifest.json中配置的模块(这里显示了所有模块都缺少)。
同样的在安卓上是没有问题的。打开软件,关闭软件,升级几次后提示文件wgt文件不存在。再服务端把升级文件改名。再升级意处的升级成功了!

后来反复测试,IOS下!大部分时候升级都会提示 Runtime缺少升级包manifest.json中配置的模块(这里显示了所有模块都缺少)。重试的次数多了,就会提示wgt文件不存在,删了软件再重新安装也不行。只能服务端把升级包改名。运气好偶尔可以升级成功。

再碰上一问题,就是微信分享图片,在安卓上没问题,在IOS上分享不了。

收起阅读 »

Native.js示例汇总

Native.JS

官网:
http://ask.dcloud.net.cn/article/114

官网:
http://ask.dcloud.net.cn/article/114

hbuider 卡机问题 解决办法

HBuilder

8.8.0.201706142254

当前版本,我机器配置比较低。win10,系统
hb打开时间长了的话。点击左下角的状态栏,调不出开关机那个状态栏。
今天无意间安装了一下tx的安全管家,竟然不卡了。。。特此通报。
本人懒,打这么多字实属不易。就别挑剔逻辑问题了。看我的东西,主要意会。~~

继续阅读 »

HBuilder

8.8.0.201706142254

当前版本,我机器配置比较低。win10,系统
hb打开时间长了的话。点击左下角的状态栏,调不出开关机那个状态栏。
今天无意间安装了一下tx的安全管家,竟然不卡了。。。特此通报。
本人懒,打这么多字实属不易。就别挑剔逻辑问题了。看我的东西,主要意会。~~

收起阅读 »

--

外包

--

--

银联wap支付 经验

使用银联wap支付很简单
见如下代码:
银联结果返回页面

<script type="text/javascript">   
            var ws;       
            // H5 plus事件处理  
            function plusReady() {                
                ws = plus.webview.currentWebview();  
                var re_vw = plus.webview.getWebviewById("recharge.html");  
                re_vw.evalJS('yl_res("<?php echo $_POST ['orderId'];?>")');   
                ws.close();  
            }  

            if(window.plus) {  
                plusReady();  
            } else {  
                document.addEventListener("plusready", plusReady, false);  
            }             
        </script>

app需要通知的页面

function yl_res(orderno){  
    mui.getJSON(api,{act:'recharge_result',orderno:orderno,user_phone:user_phone},function(data){  
        if(data.data.status==1){  
            mui.toast("充值成功");  
            userin("wallet.html");  
        }  
    });  
}
继续阅读 »

使用银联wap支付很简单
见如下代码:
银联结果返回页面

<script type="text/javascript">   
            var ws;       
            // H5 plus事件处理  
            function plusReady() {                
                ws = plus.webview.currentWebview();  
                var re_vw = plus.webview.getWebviewById("recharge.html");  
                re_vw.evalJS('yl_res("<?php echo $_POST ['orderId'];?>")');   
                ws.close();  
            }  

            if(window.plus) {  
                plusReady();  
            } else {  
                document.addEventListener("plusready", plusReady, false);  
            }             
        </script>

app需要通知的页面

function yl_res(orderno){  
    mui.getJSON(api,{act:'recharge_result',orderno:orderno,user_phone:user_phone},function(data){  
        if(data.data.status==1){  
            mui.toast("充值成功");  
            userin("wallet.html");  
        }  
    });  
}
收起阅读 »

修改启动页图片,手机运行没效果

mui

只有打包后 安装 才能体现启动页改变
如果只是手机调试运行 启动页确实没有改变

只有打包后 安装 才能体现启动页改变
如果只是手机调试运行 启动页确实没有改变

基于mui的区域滚动实现swiper在里面滚动的分屏效果

区域滚动 mui

swiper在里面滚动效果演示地址 http://www.swiper.com.cn/demo/99-inner-scroll.html
基于mui的区域滚动组件以及滑动事件实现组件
组件css代码
/分屏切换组件CSS/
.mui-scroll-splitScreen{
position: relative;
overflow: hidden;
}
.mui-scroll-splitScreen-group{
position: relative;
width: 100%;
height: 100%;
transition: all 0.5s;
}
.mui-scroll-splitScreen .mui-scroll-wrapper{
position: relative;
height: 100%;
width: 100%;
}
.mui-scroll-splitScreen .mui-scroll-wrapper .mui-scroll{
padding-bottom: 40px;
min-height: 100%;
}
.mui-scroll-splitScreen .mui-scroll-wrapper .slide-up-msg{
text-align: center;
opacity: 0;
height: 40px;
line-height: 40px;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
.mui-scroll-splitScreen .mui-scroll-wrapper[swipeupmore=yes] .slide-up-msg{
opacity: 1;
}
.mui-scroll-splitScreen .mui-scroll-wrapper[swipeupmore=yes1] .slide-up-msg{
opacity: 1;
}
/分屏切换组件CSS/

组件JS代码
//分屏切换组件功能代码
function splitScreenSlide(Json){
var _this=this;
var el=Json.el;
var slideUpMsg=Json.slideUpMsg || '上拉显示更多';
var $group=document.querySelector(el+' .mui-scroll-splitScreen-group');
var $wrapper=document.querySelectorAll(el+' .mui-scroll-wrapper');
this.initInsideScroll=function(){
//判断每屏内容是否超出,如果超出不启用滑动两次切屏效果,直接滑动一次切屏
for(var i=0;i<$wrapper.length;i++){
var $scroll=$wrapper[i].getElementsByClassName('mui-scroll')[0];
if($scroll.clientHeight<=$wrapper[i].clientHeight){
console.log(1);
$wrapper[i].setAttribute('swipeupMore','yes1');
$wrapper[i].setAttribute('swipedownMore','yes1');
}else{
$wrapper[i].setAttribute('swipeupMore','no');
$wrapper[i].setAttribute('swipedownMore','no');
}
}
}
this.goToSlideItem=function(index){
//跳转到指定屏,从0开始
$group.style.transform='translateY(-'+index100+'%)';
_this.initInsideScroll();
}
this.restoreEl=function(){
//复原组件
$group.style.transform='translateY(0)';
_this.initInsideScroll();
}
//组件生成代码
for(var i=0;i<$wrapper.length;i++){
//添加提示
var oP=document.createElement('p');
oP.className='slide-up-msg';
if(i==$wrapper.length-1){
$wrapper[i].endWrapper=true;
oP.innerHTML='没有更多内容了!';
}else{
oP.innerHTML=slideUpMsg;
}
$wrapper[i].appendChild(oP);
//添加索引下标
$wrapper[i].index=i;
//添加监听事件
$wrapper[i].addEventListener('swipeup',function(){
var xx=mui(this).scroll();
if(xx.y<=xx.maxScrollY){
if(this.endWrapper==true){
this.setAttribute('swipeupMore','yes');
this.setAttribute('swipedownMore','no');
return false;
}
if(this.getAttribute('swipeupMore')=='yes' || this.getAttribute('swipeupMore')=='yes1'){
if(this.getAttribute('swipeupMore')!='yes1'){
this.setAttribute('swipeupMore','no');
this.setAttribute('swipedownMore','no');
}
var x=(this.index+1)
100;
$group.style.transform='translateY(-'+x+'%)';
}else{
this.setAttribute('swipeupMore','yes')
this.setAttribute('swipedownMore','no');
}
}
})
$wrapper[i].addEventListener('swipedown',function(){
var xx=mui(this).scroll();
if(xx.y>=0){
if(this.getAttribute('swipedownMore')=='yes' || this.getAttribute('swipedownMore')=='yes1'){
if(this.getAttribute('swipedownMore')!='yes1'){
this.setAttribute('swipedownMore','no');
this.setAttribute('swipeupMore','no');
}
var x=(this.index-1)*100;
$group.style.transform='translateY(-'+x+'%)';
}else{
this.setAttribute('swipedownMore','yes')
this.setAttribute('swipeupMore','no');
}
}
})
}
this.initInsideScroll();
}
使用方法 HTML代码
<div class="mui-scroll-splitScreen">
<div class="mui-scroll-splitScreen-group">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
第一屏 内容
</div>
</div>
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
第二屏 内容
</div>
</div>
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
第三屏 内容
</div>
</div>
</div>
</div>
JS初始化代码
mui.init({
gestureConfig:{
tap: true, //默认为true
doubletap: true, //默认为false
longtap: true, //默认为false
swipe: true, //默认为true
drag: true, //默认为true
hold:false,//默认为false,不监听
release:false//默认为false,不监听
}
});
mui('.mui-scroll-wrapper').scroll({
indicators:true
});
//实例化组件
var mSplitScreen=new splitScreenSlide({
el:'.mui-scroll-splitScreen'
});

附件有实例代码需要引用mui.css 和mui.js

继续阅读 »

swiper在里面滚动效果演示地址 http://www.swiper.com.cn/demo/99-inner-scroll.html
基于mui的区域滚动组件以及滑动事件实现组件
组件css代码
/分屏切换组件CSS/
.mui-scroll-splitScreen{
position: relative;
overflow: hidden;
}
.mui-scroll-splitScreen-group{
position: relative;
width: 100%;
height: 100%;
transition: all 0.5s;
}
.mui-scroll-splitScreen .mui-scroll-wrapper{
position: relative;
height: 100%;
width: 100%;
}
.mui-scroll-splitScreen .mui-scroll-wrapper .mui-scroll{
padding-bottom: 40px;
min-height: 100%;
}
.mui-scroll-splitScreen .mui-scroll-wrapper .slide-up-msg{
text-align: center;
opacity: 0;
height: 40px;
line-height: 40px;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
.mui-scroll-splitScreen .mui-scroll-wrapper[swipeupmore=yes] .slide-up-msg{
opacity: 1;
}
.mui-scroll-splitScreen .mui-scroll-wrapper[swipeupmore=yes1] .slide-up-msg{
opacity: 1;
}
/分屏切换组件CSS/

组件JS代码
//分屏切换组件功能代码
function splitScreenSlide(Json){
var _this=this;
var el=Json.el;
var slideUpMsg=Json.slideUpMsg || '上拉显示更多';
var $group=document.querySelector(el+' .mui-scroll-splitScreen-group');
var $wrapper=document.querySelectorAll(el+' .mui-scroll-wrapper');
this.initInsideScroll=function(){
//判断每屏内容是否超出,如果超出不启用滑动两次切屏效果,直接滑动一次切屏
for(var i=0;i<$wrapper.length;i++){
var $scroll=$wrapper[i].getElementsByClassName('mui-scroll')[0];
if($scroll.clientHeight<=$wrapper[i].clientHeight){
console.log(1);
$wrapper[i].setAttribute('swipeupMore','yes1');
$wrapper[i].setAttribute('swipedownMore','yes1');
}else{
$wrapper[i].setAttribute('swipeupMore','no');
$wrapper[i].setAttribute('swipedownMore','no');
}
}
}
this.goToSlideItem=function(index){
//跳转到指定屏,从0开始
$group.style.transform='translateY(-'+index100+'%)';
_this.initInsideScroll();
}
this.restoreEl=function(){
//复原组件
$group.style.transform='translateY(0)';
_this.initInsideScroll();
}
//组件生成代码
for(var i=0;i<$wrapper.length;i++){
//添加提示
var oP=document.createElement('p');
oP.className='slide-up-msg';
if(i==$wrapper.length-1){
$wrapper[i].endWrapper=true;
oP.innerHTML='没有更多内容了!';
}else{
oP.innerHTML=slideUpMsg;
}
$wrapper[i].appendChild(oP);
//添加索引下标
$wrapper[i].index=i;
//添加监听事件
$wrapper[i].addEventListener('swipeup',function(){
var xx=mui(this).scroll();
if(xx.y<=xx.maxScrollY){
if(this.endWrapper==true){
this.setAttribute('swipeupMore','yes');
this.setAttribute('swipedownMore','no');
return false;
}
if(this.getAttribute('swipeupMore')=='yes' || this.getAttribute('swipeupMore')=='yes1'){
if(this.getAttribute('swipeupMore')!='yes1'){
this.setAttribute('swipeupMore','no');
this.setAttribute('swipedownMore','no');
}
var x=(this.index+1)
100;
$group.style.transform='translateY(-'+x+'%)';
}else{
this.setAttribute('swipeupMore','yes')
this.setAttribute('swipedownMore','no');
}
}
})
$wrapper[i].addEventListener('swipedown',function(){
var xx=mui(this).scroll();
if(xx.y>=0){
if(this.getAttribute('swipedownMore')=='yes' || this.getAttribute('swipedownMore')=='yes1'){
if(this.getAttribute('swipedownMore')!='yes1'){
this.setAttribute('swipedownMore','no');
this.setAttribute('swipeupMore','no');
}
var x=(this.index-1)*100;
$group.style.transform='translateY(-'+x+'%)';
}else{
this.setAttribute('swipedownMore','yes')
this.setAttribute('swipeupMore','no');
}
}
})
}
this.initInsideScroll();
}
使用方法 HTML代码
<div class="mui-scroll-splitScreen">
<div class="mui-scroll-splitScreen-group">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
第一屏 内容
</div>
</div>
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
第二屏 内容
</div>
</div>
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
第三屏 内容
</div>
</div>
</div>
</div>
JS初始化代码
mui.init({
gestureConfig:{
tap: true, //默认为true
doubletap: true, //默认为false
longtap: true, //默认为false
swipe: true, //默认为true
drag: true, //默认为true
hold:false,//默认为false,不监听
release:false//默认为false,不监听
}
});
mui('.mui-scroll-wrapper').scroll({
indicators:true
});
//实例化组件
var mSplitScreen=new splitScreenSlide({
el:'.mui-scroll-splitScreen'
});

附件有实例代码需要引用mui.css 和mui.js

收起阅读 »

Hello MUI 项目顶部多了首页两个字

mui

解决方法:
开了原生naitive模式header,
检查manifest.json中,是否设置了plus->launchwebview->navigationbar | titleNView。
去掉黄色标识代码。

继续阅读 »

解决方法:
开了原生naitive模式header,
检查manifest.json中,是否设置了plus->launchwebview->navigationbar | titleNView。
去掉黄色标识代码。

收起阅读 »