HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

在Mac、Linux、Ubuntu终端显示Git当前所在分支

Git

git-branch
1.进入home目录
cd ~
2.用vi编辑.bashrc文件
vi .bashrc
3.将下面的代码加入到文件的最后处

function git_branch {  
   branch="`git branch 2>/dev/null | grep "^\*" | sed -e "s/^\*\ //"`"  
   if [ "${branch}" != "" ];then  
       if [ "${branch}" = "(no branch)" ];then  
           branch="(`git rev-parse --short HEAD`...)"  
       fi  
       echo " ($branch)"  
   fi  
}  

export PS1='\u@\h \[\033[01;36m\]\W\[\033[01;32m\]$(git_branch)\[\033[00m\] \$ '

注:输入i进行vi编辑,完成后按Esc按钮退出编辑 :wq 进行保存退出
4.执行命令 source ./.bashrc

  1. 完成
    Mac下面启动的shell是login shell,所以加载的配置文件是 .bash_profile,不会加载 .bashrc,如果你是Mac用户的话,需要再
    执行下面的命令,这样每次开就会才会自动生效:
    echo "[ -r ~/.bashrc ] && source ~/.bashrc" >> .bash_profile

    延伸阅读:https://www.jianshu.com/p/82783f76a868

继续阅读 »

git-branch
1.进入home目录
cd ~
2.用vi编辑.bashrc文件
vi .bashrc
3.将下面的代码加入到文件的最后处

function git_branch {  
   branch="`git branch 2>/dev/null | grep "^\*" | sed -e "s/^\*\ //"`"  
   if [ "${branch}" != "" ];then  
       if [ "${branch}" = "(no branch)" ];then  
           branch="(`git rev-parse --short HEAD`...)"  
       fi  
       echo " ($branch)"  
   fi  
}  

export PS1='\u@\h \[\033[01;36m\]\W\[\033[01;32m\]$(git_branch)\[\033[00m\] \$ '

注:输入i进行vi编辑,完成后按Esc按钮退出编辑 :wq 进行保存退出
4.执行命令 source ./.bashrc

  1. 完成
    Mac下面启动的shell是login shell,所以加载的配置文件是 .bash_profile,不会加载 .bashrc,如果你是Mac用户的话,需要再
    执行下面的命令,这样每次开就会才会自动生效:
    echo "[ -r ~/.bashrc ] && source ~/.bashrc" >> .bash_profile

    延伸阅读:https://www.jianshu.com/p/82783f76a868

收起阅读 »

调用二维码控件出现页面变形的问题

plusready之后不要直接创建控件,设置200ms的延时再进行创建,代码如下图所示
// 创建扫描控件
function startRecognize() {
if(!scan){
scan = new plus.barcode.Barcode('bcid');
scan.onmarked = onmarked;
}
}

    mui.plusReady(function(){  
        setTimeout(function(){  
        startRecognize();  
        scan.start();  
        },200);  

    });  
继续阅读 »

plusready之后不要直接创建控件,设置200ms的延时再进行创建,代码如下图所示
// 创建扫描控件
function startRecognize() {
if(!scan){
scan = new plus.barcode.Barcode('bcid');
scan.onmarked = onmarked;
}
}

    mui.plusReady(function(){  
        setTimeout(function(){  
        startRecognize();  
        scan.start();  
        },200);  

    });  
收起阅读 »

自己做的安卓APP分享代码啦。嵌入任意网址-本地HTML(无限嵌入)都完美支持-点击手机返回按钮完美返回上一页

自定义模板 源码分享

自己做的安卓APP软件,分享代码啦。点击手机返回按钮完美返回上一页
源码下载地址(都可以用的。自己测试一下哈)
https://21sqw.lanzous.com/i62kuwf
https://21sqw.lanzous.com/i62kosf

软件下载地址
https://21sqw.lanzous.com/i62kore

这是一款支持你嵌入任意网页,任意网站,任意本地HTML,都可以完美
点击手机返回按钮完美返回上一页

不信的大家可以下载软件来测试来。。点击手机返回按钮自动返回上一页。

![如果有哪里不懂得。可以私聊我。

继续阅读 »

自己做的安卓APP软件,分享代码啦。点击手机返回按钮完美返回上一页
源码下载地址(都可以用的。自己测试一下哈)
https://21sqw.lanzous.com/i62kuwf
https://21sqw.lanzous.com/i62kosf

软件下载地址
https://21sqw.lanzous.com/i62kore

这是一款支持你嵌入任意网页,任意网站,任意本地HTML,都可以完美
点击手机返回按钮完美返回上一页

不信的大家可以下载软件来测试来。。点击手机返回按钮自动返回上一页。

![如果有哪里不懂得。可以私聊我。

收起阅读 »

【文档】wap2app选项卡样式定制

选项卡 wap2app

以下修改或配置,均在 client_index.html 中进行。

选项卡文字颜色

/*选项卡文字默认颜色*/  
.tab-item {  
  color: #000000;  
}  

/*选项卡文字高亮时颜色*/  
.tab-item.active {  
  color: #FFFF00;  
}

选项卡背景

.tab-inner {  
  background-color: #0000FF;  
  box-shadow: 0 0 1px #FF0000;  
  -webkit-box-shadow: 0 0 1px #FF0000;  
}

底部选项卡是没有边框(border)的,而是使用了阴影(box-shadow)。可以根据需求,修改样式。

修改阴影的颜色

.tab-inner {  
  box-shadow: 0 0 1px #FF0000;  
  -webkit-box-shadow: 0 0 1px #FF0000;  
}

不要阴影,使用边框。

.tab-inner {  
  box-shadow: none;  
  -webkit-box-shadow: none;  
  border-top: 1px solid #0000ff;  
}

关于图标

图标是需要在初始化选项卡的时候就配置的,详细参考 http://ask.dcloud.net.cn/article/12878 中的说明。

new TabBar({  
  list: [{  
      url: "http://hello.wap2app.dcloud.io",  
      text: "首页", //本地路径,也可以是网络路径  
      iconPath: 'http://hello.wap2app.dcloud.io/img/home-outline.png',  
      selectedIconPath: 'http://hello.wap2app.dcloud.io/img/home-outline-highlight.png'  
    },  
    {  
      url: "http://hello.wap2app.dcloud.io/about.html",  
      text: "关于",  
      iconPath: 'http://hello.wap2app.dcloud.io/img/gear-outline.png',  
      selectedIconPath: 'http://hello.wap2app.dcloud.io/img/gear-outline-highlight.png'  
    }  
  ]  
});
继续阅读 »

以下修改或配置,均在 client_index.html 中进行。

选项卡文字颜色

/*选项卡文字默认颜色*/  
.tab-item {  
  color: #000000;  
}  

/*选项卡文字高亮时颜色*/  
.tab-item.active {  
  color: #FFFF00;  
}

选项卡背景

.tab-inner {  
  background-color: #0000FF;  
  box-shadow: 0 0 1px #FF0000;  
  -webkit-box-shadow: 0 0 1px #FF0000;  
}

底部选项卡是没有边框(border)的,而是使用了阴影(box-shadow)。可以根据需求,修改样式。

修改阴影的颜色

.tab-inner {  
  box-shadow: 0 0 1px #FF0000;  
  -webkit-box-shadow: 0 0 1px #FF0000;  
}

不要阴影,使用边框。

.tab-inner {  
  box-shadow: none;  
  -webkit-box-shadow: none;  
  border-top: 1px solid #0000ff;  
}

关于图标

图标是需要在初始化选项卡的时候就配置的,详细参考 http://ask.dcloud.net.cn/article/12878 中的说明。

new TabBar({  
  list: [{  
      url: "http://hello.wap2app.dcloud.io",  
      text: "首页", //本地路径,也可以是网络路径  
      iconPath: 'http://hello.wap2app.dcloud.io/img/home-outline.png',  
      selectedIconPath: 'http://hello.wap2app.dcloud.io/img/home-outline-highlight.png'  
    },  
    {  
      url: "http://hello.wap2app.dcloud.io/about.html",  
      text: "关于",  
      iconPath: 'http://hello.wap2app.dcloud.io/img/gear-outline.png',  
      selectedIconPath: 'http://hello.wap2app.dcloud.io/img/gear-outline-highlight.png'  
    }  
  ]  
});
收起阅读 »

流应用提交指南及如何通过流应用让激活用户翻倍

正式平台 流应用

流应用是一种即点即用的应用。2015年发布,是小程序/快应用等动态App行业的先行者。
流应用默认会在手机桌面创建图标,遇到权限问题会引导用户赋权。
原生App需要经历下载、安装、激活数个环节,100个下载里最终只有40个用户成功启动这个App。
也就是只有40%的激活率。
而流应用即点即用,5秒内完成直接完成下载、激活。
尤其在应用内广告场景中,过去下载安装apk的折损是甚至大于60%,此时尤其需要即点即用的流应用来提升广告效果。

所有HTML5+开发的app,包括wap2app的app,都可以自动转为流应用。
当然需要开发者自己提交和测试。

本文讲解如何在HBuilder中将5+ App、wap2app发布成流应用。

提交到测试平台

在HBuilder(注意HBuilderX暂不支持)中选择需要发布的项目工程,点击顶部菜单“发行 -> 发行为流应用”,会弹出发行界面,如下图:

点击“提交测试”,将应用资源提交到测试平台上,提交成功后,会显示测试二维码,如下图所示:

测试流应用各项业务功能

dcloud.io 下载并安装流应用App,使用流应用App扫描如上的测试二维码,验证应用的各项功能在流应用环境下是否正常。

若有平台差异,建议通过环境判断,做适当修改。

发布到正式平台

在测试平台验证流应用功能正常后,点击“发布为正式”按钮,向正式平台提交。

鉴于监管要求,流应用首次发布正式时,需在线提交一些应用信息,如下图:

信息提交完成后,还需经过平台方的人工审核,审核通过后,会自动发布到正式;开发者再次打开发行流应用菜单,会显示正式平台的二维码(快码),如下图:

若审核失败,会通过邮件通知审核失败的原因(比如用户体验不佳、涉及敏感信息等)。

注意:流应用发布正式平台前,需完成开发者的实名认证,相关流程参考DCloud开发者实名认证流程

继续阅读 »

流应用是一种即点即用的应用。2015年发布,是小程序/快应用等动态App行业的先行者。
流应用默认会在手机桌面创建图标,遇到权限问题会引导用户赋权。
原生App需要经历下载、安装、激活数个环节,100个下载里最终只有40个用户成功启动这个App。
也就是只有40%的激活率。
而流应用即点即用,5秒内完成直接完成下载、激活。
尤其在应用内广告场景中,过去下载安装apk的折损是甚至大于60%,此时尤其需要即点即用的流应用来提升广告效果。

所有HTML5+开发的app,包括wap2app的app,都可以自动转为流应用。
当然需要开发者自己提交和测试。

本文讲解如何在HBuilder中将5+ App、wap2app发布成流应用。

提交到测试平台

在HBuilder(注意HBuilderX暂不支持)中选择需要发布的项目工程,点击顶部菜单“发行 -> 发行为流应用”,会弹出发行界面,如下图:

点击“提交测试”,将应用资源提交到测试平台上,提交成功后,会显示测试二维码,如下图所示:

测试流应用各项业务功能

dcloud.io 下载并安装流应用App,使用流应用App扫描如上的测试二维码,验证应用的各项功能在流应用环境下是否正常。

若有平台差异,建议通过环境判断,做适当修改。

发布到正式平台

在测试平台验证流应用功能正常后,点击“发布为正式”按钮,向正式平台提交。

鉴于监管要求,流应用首次发布正式时,需在线提交一些应用信息,如下图:

信息提交完成后,还需经过平台方的人工审核,审核通过后,会自动发布到正式;开发者再次打开发行流应用菜单,会显示正式平台的二维码(快码),如下图:

若审核失败,会通过邮件通知审核失败的原因(比如用户体验不佳、涉及敏感信息等)。

注意:流应用发布正式平台前,需完成开发者的实名认证,相关流程参考DCloud开发者实名认证流程

收起阅读 »

打开系统应用,如日历,要打开对应的权限

日历

如下图,如果你想打开手机的内置应用,有些是需要添加权限的,之前调式都可以打开日历,打包后,都不可以打开日历,查看才发现需要添加权限,,

如下图,如果你想打开手机的内置应用,有些是需要添加权限的,之前调式都可以打开日历,打包后,都不可以打开日历,查看才发现需要添加权限,,

plus.geolocation.getCurrentPosition || plus.maps.Map.calculateDistance

5+文档中距离计算是按照百度坐标来进行计算的;而定位获取到的坐标是国测局坐标(火星坐标,比如高德地图在用),需要转换为百度
坐标;具体转换方法由于简书已发布文章就不在重复编辑了,可参考https://www.jianshu.com/p/b1e9edf61cd8

继续阅读 »

5+文档中距离计算是按照百度坐标来进行计算的;而定位获取到的坐标是国测局坐标(火星坐标,比如高德地图在用),需要转换为百度
坐标;具体转换方法由于简书已发布文章就不在重复编辑了,可参考https://www.jianshu.com/p/b1e9edf61cd8

收起阅读 »

html5如何利用百度地图快速的定位经纬度

定位 地图

定位功能(Geolocation)是HTML5的新特性,因此只有在支持HTML5的现代浏览器上运行,特别是手持设备如iphone,地理定位更加精确。首先我们要检测用户设备浏览器是否支持地理定位,如果支持则获取地理信息。注意这个特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的,所以我们在访问该应用时会提示是否允许地理定位,我们当然选择允许即可。
function getLocation(){ 
if (navigator.geolocation){ 
navigator.geolocation.getCurrentPosition(showPosition,showError); 
}else{ 
alert("浏览器不支持地理定位。"); 


上面的代码可以知道,如果用户设备支持地理定位,则运行 getCurrentPosition() 方法。如果getCurrentPosition()运行成功,则向参数showPosition中规定的函数返回一个coordinates对象,getCurrentPosition() 方法的第二个参数showError用于处理错误,它规定当获取用户位置失败时运行的函数。
我们先来看函数showError(),它规定获取用户地理位置失败时的一些错误代码处理方式:
function showError(error){ 
switch(error.code) { 
case error.PERMISSION_DENIED: 
alert("定位失败,用户拒绝请求地理定位"); 
break; 
case error.POSITION_UNAVAILABLE: 
alert("定位失败,位置信息是不可用"); 
break; 
case error.TIMEOUT: 
alert("定位失败,请求获取用户位置超时"); 
break; 
case error.UNKNOWN_ERROR: 
alert("定位失败,定位系统失效"); 
break; 


我们再来看函数showPosition(),调用coords的latitude和longitude即可获取到用户的纬度和经度。
function showPosition(position){ 
var lat = position.coords.latitude; //纬度 
var lag = position.coords.longitude; //经度 
alert('纬度:'+lat+',经度:'+lag); 

利用百度地图
function showPosition(position){ 
var latlon = position.coords.latitude+','+position.coords.longitude; 

//baidu 
var url = "<a href="http://api.map.baidu.com/geocoder/v2/?ak=C93b5178d7a8ebdb830b9b557abce78b&callback=renderReverse&location="+latlon+"&output=json&pois=0">http://api.map.baidu.com/geocoder/v2/?ak=C93b5178d7a8ebdb830b9b557abce78b&callback=renderReverse&location="+latlon+"&output=json&pois=0</a>"; 
$.ajax({ 
type: "GET", 
dataType: "jsonp", 
url: url, 
beforeSend: function(){ 
$("#baidu_geo").html('正在定位...'); 
}, 
success: function (json) { 
if(json.status==0){ 
$("#baidu_geo").html(json.result.formatted_address); 

}, 
error: function (XMLHttpRequest, textStatus, errorThrown) { 
$("#baidu_geo").html(latlon+"地址位置获取失败"); 

}); 
}); 
  好了现在大家已经知道如何利用百度地图快速定位经纬度了,如果还存在不理解的地方,可以留言咨询我们。本文由专业的微信小程序开发公司燚轩科技整理发布,如需转载请注明出处!

继续阅读 »

定位功能(Geolocation)是HTML5的新特性,因此只有在支持HTML5的现代浏览器上运行,特别是手持设备如iphone,地理定位更加精确。首先我们要检测用户设备浏览器是否支持地理定位,如果支持则获取地理信息。注意这个特性可能侵犯用户的隐私,除非用户同意,否则用户位置信息是不可用的,所以我们在访问该应用时会提示是否允许地理定位,我们当然选择允许即可。
function getLocation(){ 
if (navigator.geolocation){ 
navigator.geolocation.getCurrentPosition(showPosition,showError); 
}else{ 
alert("浏览器不支持地理定位。"); 


上面的代码可以知道,如果用户设备支持地理定位,则运行 getCurrentPosition() 方法。如果getCurrentPosition()运行成功,则向参数showPosition中规定的函数返回一个coordinates对象,getCurrentPosition() 方法的第二个参数showError用于处理错误,它规定当获取用户位置失败时运行的函数。
我们先来看函数showError(),它规定获取用户地理位置失败时的一些错误代码处理方式:
function showError(error){ 
switch(error.code) { 
case error.PERMISSION_DENIED: 
alert("定位失败,用户拒绝请求地理定位"); 
break; 
case error.POSITION_UNAVAILABLE: 
alert("定位失败,位置信息是不可用"); 
break; 
case error.TIMEOUT: 
alert("定位失败,请求获取用户位置超时"); 
break; 
case error.UNKNOWN_ERROR: 
alert("定位失败,定位系统失效"); 
break; 


我们再来看函数showPosition(),调用coords的latitude和longitude即可获取到用户的纬度和经度。
function showPosition(position){ 
var lat = position.coords.latitude; //纬度 
var lag = position.coords.longitude; //经度 
alert('纬度:'+lat+',经度:'+lag); 

利用百度地图
function showPosition(position){ 
var latlon = position.coords.latitude+','+position.coords.longitude; 

//baidu 
var url = "<a href="http://api.map.baidu.com/geocoder/v2/?ak=C93b5178d7a8ebdb830b9b557abce78b&callback=renderReverse&location="+latlon+"&output=json&pois=0">http://api.map.baidu.com/geocoder/v2/?ak=C93b5178d7a8ebdb830b9b557abce78b&callback=renderReverse&location="+latlon+"&output=json&pois=0</a>"; 
$.ajax({ 
type: "GET", 
dataType: "jsonp", 
url: url, 
beforeSend: function(){ 
$("#baidu_geo").html('正在定位...'); 
}, 
success: function (json) { 
if(json.status==0){ 
$("#baidu_geo").html(json.result.formatted_address); 

}, 
error: function (XMLHttpRequest, textStatus, errorThrown) { 
$("#baidu_geo").html(latlon+"地址位置获取失败"); 

}); 
}); 
  好了现在大家已经知道如何利用百度地图快速定位经纬度了,如果还存在不理解的地方,可以留言咨询我们。本文由专业的微信小程序开发公司燚轩科技整理发布,如需转载请注明出处!

收起阅读 »

mui.openWindow()打不开页面

开发时遇到mui.openWindow()打不开页面,看了很多资料都没有解决。比如说把代码放在mui.plusready内部执行,也不能解决问题。
在需要打开的页面中使用console.log()输出一段文本,结果控制台没有看到,说明页面并没有加载(注意:我没有使用预加载页面)。最后检查发现问题在于一个<buttom>标签,标签放在表单内部。(以下原因是我的猜想)buttom标签放在表单内部,点击的时候,页面有刷新的效果,而且有请求后台,说明这个按钮被默认处理为表单提交按钮,所以点击按钮的时候就不响应自定义点击事件。解决办法是给<button>标签添加 type="button"属性。 问题解决。

继续阅读 »

开发时遇到mui.openWindow()打不开页面,看了很多资料都没有解决。比如说把代码放在mui.plusready内部执行,也不能解决问题。
在需要打开的页面中使用console.log()输出一段文本,结果控制台没有看到,说明页面并没有加载(注意:我没有使用预加载页面)。最后检查发现问题在于一个<buttom>标签,标签放在表单内部。(以下原因是我的猜想)buttom标签放在表单内部,点击的时候,页面有刷新的效果,而且有请求后台,说明这个按钮被默认处理为表单提交按钮,所以点击按钮的时候就不响应自定义点击事件。解决办法是给<button>标签添加 type="button"属性。 问题解决。

收起阅读 »

分享一个简单的淘宝、京东,采集商品宝贝的图片例子

HTML5+

简单的淘宝、京东,采集商品宝贝的图片例子,
作用: 用于快速采集商品宝贝图片,用于发布微信朋友圈宣传推广商品,和收集商品等等.

主要是把JS 注入到,要采集图片的网站,  
appendJsFile("_www/js/mui.min.js");  
appendJsFile("_www/js/jsimg.js");  

在底部留下按键,通过 evalJS , 操作要采集的网站  

案例在下面,可以下载体验下

继续阅读 »

简单的淘宝、京东,采集商品宝贝的图片例子,
作用: 用于快速采集商品宝贝图片,用于发布微信朋友圈宣传推广商品,和收集商品等等.

主要是把JS 注入到,要采集图片的网站,  
appendJsFile("_www/js/mui.min.js");  
appendJsFile("_www/js/jsimg.js");  

在底部留下按键,通过 evalJS , 操作要采集的网站  

案例在下面,可以下载体验下

收起阅读 »

【购买】app商城B2C,核心功能完整,带支付,后台php或net都行

B2C商城(APP的)有做过的吗,核心功能完整无Bug的,
带支付功能,后台php或者.net的都行,可以代价私聊,QQ:705722325。

我相信这个系统应该有成熟的作品的,拿出来,我购买,让H5APP发扬光大,

无需售后,我们有技术团队,

当然,如果有需要公安局治安大队的阵地管控、特行检查等app的也可以联系我。

继续阅读 »

B2C商城(APP的)有做过的吗,核心功能完整无Bug的,
带支付功能,后台php或者.net的都行,可以代价私聊,QQ:705722325。

我相信这个系统应该有成熟的作品的,拿出来,我购买,让H5APP发扬光大,

无需售后,我们有技术团队,

当然,如果有需要公安局治安大队的阵地管控、特行检查等app的也可以联系我。

收起阅读 »