HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

uniapp定制开发、团队开发uniAPP、小团队开发价格优惠合理

5 App开发 uni_app uniapp

APP开发
1.域名

  1. 服务器
  2. 域名ICP备案
  3. 功能需求整理
  4. 报工期价格
  5. ios开发者账号申请
  6. 安卓开发者账号申请
  7. 相对应所需的接口

APP开发
1.域名

  1. 服务器
  2. 域名ICP备案
  3. 功能需求整理
  4. 报工期价格
  5. ios开发者账号申请
  6. 安卓开发者账号申请
  7. 相对应所需的接口

阻止点击穿透 阻止冒泡 子级点击时阻止父级的事件

<view class="parent" @click="doSomeThing">
<view class="child" @click.stop="doSmall">
......
</view>
</view>

在子级元素的点击事件触发的时候加上.stop。在UNIAPP的APP开发中实测有效。

继续阅读 »

<view class="parent" @click="doSomeThing">
<view class="child" @click.stop="doSmall">
......
</view>
</view>

在子级元素的点击事件触发的时候加上.stop。在UNIAPP的APP开发中实测有效。

收起阅读 »

uni app 两种方式实现屏幕下拉,手指下滑屏幕的时候背景图片放大,缩放的效果

App 移动APP

uni app 两种方式实现屏幕下拉,手指下滑屏幕的时候背景图片放大,缩放的效果
其实核心原理都是一样,就是通过获取手指在屏幕上移动的距离来是图片放大或者缩小

1.方式一:
使用onPageScroll()来监听页面的滚动(废话少说直接上代码)


that.scroll < e.scrollTop 代表手指向上滑动 ,让this.changeBig=false(不让图片缩放)
that.scroll < e.scrollTop 表示手指向下滑动,让图片缩放

缩放class类的使用和缩放动画
缩放class类:


缩放动画:

然后手指下滑,图片放大,手指上滑还原(动画效果流畅)

2.方式二:
通过触摸屏的触发事件


触发函数:

startWhere()获取到手指开始触摸手机屏幕的位置pageY
endWhere()获取到手指在手机屏幕上移动的的位置,触发的速度很快,所以我们要获取到最后手指停住的时候的pageY
然后计算出两者直接的距离差distance,再去判断distance是否大于res.screenHeight 0.01(屏幕的高度0.01),大于这个值就会this.changeBig=true,去执行缩放动画
returnSize()手指松开后,将缩放效果结束
代码:

3.结语:
思想就是那么个思想,获取手指移动的距离,然后达到自己的要求后,让图片缩放,最后离开的试试记得还原

继续阅读 »

uni app 两种方式实现屏幕下拉,手指下滑屏幕的时候背景图片放大,缩放的效果
其实核心原理都是一样,就是通过获取手指在屏幕上移动的距离来是图片放大或者缩小

1.方式一:
使用onPageScroll()来监听页面的滚动(废话少说直接上代码)


that.scroll < e.scrollTop 代表手指向上滑动 ,让this.changeBig=false(不让图片缩放)
that.scroll < e.scrollTop 表示手指向下滑动,让图片缩放

缩放class类的使用和缩放动画
缩放class类:


缩放动画:

然后手指下滑,图片放大,手指上滑还原(动画效果流畅)

2.方式二:
通过触摸屏的触发事件


触发函数:

startWhere()获取到手指开始触摸手机屏幕的位置pageY
endWhere()获取到手指在手机屏幕上移动的的位置,触发的速度很快,所以我们要获取到最后手指停住的时候的pageY
然后计算出两者直接的距离差distance,再去判断distance是否大于res.screenHeight 0.01(屏幕的高度0.01),大于这个值就会this.changeBig=true,去执行缩放动画
returnSize()手指松开后,将缩放效果结束
代码:

3.结语:
思想就是那么个思想,获取手指移动的距离,然后达到自己的要求后,让图片缩放,最后离开的试试记得还原

收起阅读 »

第一次发帖。

每次到这种新的网站,都要测试一下云贴图。好像不支持。

每次到这种新的网站,都要测试一下云贴图。好像不支持。

自己的uniapp成功上架IOS流程以及遇到的问题,权限,IPV6,隐私权等记录

iOS

好不容易将自己的APP开发出来。

打个广告,尚云商-数字生活服务平台,可以用来发布本地信息,和 手机开店的功能。

使用HbuilderX 将uniapp打包为IOS发布包,注意使用发行版证书。

现在上传到appconnect都是通过Transport工具来进行上传的,非常方便。

然后在appconnect修改自己的APP信息,注意需要两种尺寸的截图。当时傻了吧唧的想买手机或者通过PS来进行弄,结果人家HbuilderX已经具备了模拟器的功能,真好。

模拟IphoneX 和 Iphon8 plus来进行6.5寸和5.5寸的截图就行了。五张图片。具体效果可以去store搜索我的应用。

满怀欣喜的上传 提交审核吧。

周六首次上传的,之后在一天后收到审核拒绝,相册权限提示不明确,好吧。然后去网上搜索模板,添加上了。

之后看到必须要弄个隐私权的政策,然后整了个隐私权,放在注册的页面上。

然后又想到版本更新问题,又添加了前端更新提示的问题。

之后又看到还需要一个IPV6的支持,这个搞了半天,通过隧道的方式来进行实现了。但是因为自己的tomcat是https,以为不支持,又弄了nginx,然后将nginx放弃掉了,tomcat重新恢复到原来的模式。

因为我是中午提交的,IPV6是下午看到的,所以要在苹果审核之前将IPV6的环境打通,所以搞到了半夜。也不知道搞定没有。搞完12点半睡觉,一点半开始inreview,三点审核通过。结果第二天早上起来 应用审核通过了。MGOD

至于如何整IPV6,上传个附件吧。可以直接在CSDN搜索这篇文章就行了。

继续阅读 »

好不容易将自己的APP开发出来。

打个广告,尚云商-数字生活服务平台,可以用来发布本地信息,和 手机开店的功能。

使用HbuilderX 将uniapp打包为IOS发布包,注意使用发行版证书。

现在上传到appconnect都是通过Transport工具来进行上传的,非常方便。

然后在appconnect修改自己的APP信息,注意需要两种尺寸的截图。当时傻了吧唧的想买手机或者通过PS来进行弄,结果人家HbuilderX已经具备了模拟器的功能,真好。

模拟IphoneX 和 Iphon8 plus来进行6.5寸和5.5寸的截图就行了。五张图片。具体效果可以去store搜索我的应用。

满怀欣喜的上传 提交审核吧。

周六首次上传的,之后在一天后收到审核拒绝,相册权限提示不明确,好吧。然后去网上搜索模板,添加上了。

之后看到必须要弄个隐私权的政策,然后整了个隐私权,放在注册的页面上。

然后又想到版本更新问题,又添加了前端更新提示的问题。

之后又看到还需要一个IPV6的支持,这个搞了半天,通过隧道的方式来进行实现了。但是因为自己的tomcat是https,以为不支持,又弄了nginx,然后将nginx放弃掉了,tomcat重新恢复到原来的模式。

因为我是中午提交的,IPV6是下午看到的,所以要在苹果审核之前将IPV6的环境打通,所以搞到了半夜。也不知道搞定没有。搞完12点半睡觉,一点半开始inreview,三点审核通过。结果第二天早上起来 应用审核通过了。MGOD

至于如何整IPV6,上传个附件吧。可以直接在CSDN搜索这篇文章就行了。

收起阅读 »

如果uni-app有一些PC的组件就好了

希望uni-app成为一个跨全端的,性能更加卓越的框架。这样就省事了。

希望uni-app成为一个跨全端的,性能更加卓越的框架。这样就省事了。

uniapp设置tabBar后,页面底部有留白。

uniapp

自己找到了原因,泪奔
manifest.json>app启动页配置>等待首页渲染完毕后再关闭Splash图,打勾解决。
应该是uniapp启动时候渲染页面的bug。

自己找到了原因,泪奔
manifest.json>app启动页配置>等待首页渲染完毕后再关闭Splash图,打勾解决。
应该是uniapp启动时候渲染页面的bug。

前后历时1个月采用uniapp开发的抽奖小程序, 可以用于聚会/公司年会抽奖, 首页还有真实奖品可以拿

可以用于聚会 /公司年会抽奖, 首页还有真实奖品可以拿, 小程序名: 抽抽好运

可以用于聚会 /公司年会抽奖, 首页还有真实奖品可以拿, 小程序名: 抽抽好运

团队如何制作电商小程序、小程序商城制作流程、都有哪些功能?

uni_app uniapp 移动APP 小程序

如何制作电商小程序、小程序商城制作流程、都有哪些功能?
电商小程序定制开发流程:
1.小程序认证费用;

  1. 需求沟通
  2. 明确需求,报价工期
  3. 确定合同,支付费用
  4. UI设计图确认
  5. 前端切图,编写代码
  6. 后台搭建
  7. 上线前测试;
  8. 安排上线时间,整理上线
    电商小程序基础功能:
    1.会员功能
  9. 商铺管理
  10. 线上支付
  11. 商品管理
  12. 订单管理
  13. 物流管理
  14. 促销管理等。
继续阅读 »

如何制作电商小程序、小程序商城制作流程、都有哪些功能?
电商小程序定制开发流程:
1.小程序认证费用;

  1. 需求沟通
  2. 明确需求,报价工期
  3. 确定合同,支付费用
  4. UI设计图确认
  5. 前端切图,编写代码
  6. 后台搭建
  7. 上线前测试;
  8. 安排上线时间,整理上线
    电商小程序基础功能:
    1.会员功能
  9. 商铺管理
  10. 线上支付
  11. 商品管理
  12. 订单管理
  13. 物流管理
  14. 促销管理等。
收起阅读 »

使用nativejs刷新安卓Media Store

Native.JS

使用场景

当保存图片、音视频等至自定义目录(非系统相册)下时,系统相册中并不能立即看到,此时需要手动刷新Media Store

原理

发送 ACTION_MEDIA_SCANNER_SCAN_FILE 广播

此方法仅对单个文件有效,多个文件需要调用多次

安卓原生写法

val filename = "Your_Created_Image_File_Path"  
val contentUri = Uri.fromFile(File(filename))  
val mediaScanIntent = Intent(Intent.ACTION_MEDIA_SCANNER_SCAN_FILE,contentUri)  
sendBroadcast(mediaScanIntent)

nativejs写法

function refreshMediaStore (filename) {  
    const File = plus.android.newObject('java.io.File', filename)  
    const Uri = plus.android.invoke('android.net.Uri', 'fromFile', File)  
    const Intent = plus.android.importClass('android.content.Intent')  
    const mediaScanIntent = new Intent(Intent.ACTION_MEDIA_SCANNER_SCAN_FILE, Uri)  

    const main = plus.android.runtimeMainActivity()  
    main.sendBroadcast(mediaScanIntent)  
}

注意

filename 应是以 Environment.getExternalStorageDirectory() 的返回值开头,也就是扩展卡的根路径

const Environment = plus.android.importClass('android.os.Environment')  
const root = plus.android.invoke(Environment.getExternalStorageDirectory(), 'getAbsolutePath')

参考

继续阅读 »

使用场景

当保存图片、音视频等至自定义目录(非系统相册)下时,系统相册中并不能立即看到,此时需要手动刷新Media Store

原理

发送 ACTION_MEDIA_SCANNER_SCAN_FILE 广播

此方法仅对单个文件有效,多个文件需要调用多次

安卓原生写法

val filename = "Your_Created_Image_File_Path"  
val contentUri = Uri.fromFile(File(filename))  
val mediaScanIntent = Intent(Intent.ACTION_MEDIA_SCANNER_SCAN_FILE,contentUri)  
sendBroadcast(mediaScanIntent)

nativejs写法

function refreshMediaStore (filename) {  
    const File = plus.android.newObject('java.io.File', filename)  
    const Uri = plus.android.invoke('android.net.Uri', 'fromFile', File)  
    const Intent = plus.android.importClass('android.content.Intent')  
    const mediaScanIntent = new Intent(Intent.ACTION_MEDIA_SCANNER_SCAN_FILE, Uri)  

    const main = plus.android.runtimeMainActivity()  
    main.sendBroadcast(mediaScanIntent)  
}

注意

filename 应是以 Environment.getExternalStorageDirectory() 的返回值开头,也就是扩展卡的根路径

const Environment = plus.android.importClass('android.os.Environment')  
const root = plus.android.invoke(Environment.getExternalStorageDirectory(), 'getAbsolutePath')

参考

收起阅读 »

推荐小册课程《Uniapp 从入门到进阶》

uniapp 教程 uniapp

推荐小册课程《Uniapp 从入门到进阶

带你一天上手uniapp,五十行代码实现一个简易粗暴Koa.js,玩转docker部署

Uniapp 从入门到进阶

继续阅读 »

推荐小册课程《Uniapp 从入门到进阶

带你一天上手uniapp,五十行代码实现一个简易粗暴Koa.js,玩转docker部署

Uniapp 从入门到进阶

收起阅读 »