uniapp 安卓进度条热更新

	<view class="contShengji" v-if="isShengji">
      <view class="cont tac p0d5">
        <image src="x/x/logo.png" class="w4 h4 brb50" style="margin-top: -2rem;" mode=""></image>
        <view class="cth">{{percent==0 ? 'xxx,有新版本了!' : '下载更新包,请稍后'}}</view>
        <progress :percent="percent" show-info stroke-width="6" activeColor="#3AC3E0" backgroundColor="#EBEBEB" v-if="percent!=0" />
        <view class="bcth cfff tac wb45 br4  pt0d3 pb0d3 fs0d8" style="margin:2rem auto ;" @click="toShengji()" v-else>立即升级</view>
      </view>
    </view>
   .tac{text-align:center};
   .p0d5{padding:0.5rem};
   .brb50{border-radius:50%};
   .br4{border-radius:4rem};
   	.wb45{width:45%};
   .bcth{background:#000;color:#fff}
   .contShengji{
    position: fixed;
    width: 100%;
    height: 100vh;
    background-color: rgba(0,0,0,.5);
    left: 0;
    top:0;
    z-index: 9999;
    .cont{
      position: absolute;
      width: 45%;
      left: 50%;
      top:50%;
      background-color: #fff;
      height: 8rem;
      border-radius: .4rem;
      transform: translate(-50%,-50%);
    }
  }

	 export default {
	    data() {
	      return {
	        percent: 0,
	        isShengji:false
	      };
	    },

   		getIsShengJi(){//判断版本
	      	//#ifdef APP-PLUS
	      	var _this=this;
	      	//请求接获取版本号 判断uniapp的版本号 
	      	_this.conf.http('/xxxx',{kkey:'APPVersion'},res=>{
	       	 let APPVersion= res.data.data.val
	          plus.runtime.getProperty(plus.runtime.appid, function(widgetInfo) {
	          	let newAPPVersion = Number(APPVersion.replace(/\./g, ""));
	          	let oldAPPVersion = Number(widgetInfo.version.replace(/\./g, ""));
	            if (newAPPVersion > oldAPPVersion) {
	                _this.pg.isShengji=true;
	            }
	          });
	          
	      	})
	      	//#endif
      	},
  	 toShengji(){
      	var url=xxx;//下载地址  生成的wgt
      	let Pbar= uni.downloadFile({url:url,
        success: (downloadResult) => {
      		if (downloadResult.statusCode === 200) {
      				plus.runtime.install(downloadResult.tempFilePath, {force: true},() => {
      				plus.nativeUI.showWaiting("更新成功");
      				setTimeout(() => {
      					plus.nativeUI.closeWaiting();plus.runtime.restart();}, 500);},
      						function(e) {
      							plus.nativeUI.showWaiting("安装失败");
      								setTimeout(() => {
	      								plus.nativeUI.closeWaiting();
	      								uni.switchTab({url: "/pages/index/index"})
      								}, 1000);
      							
      						});
      				}
      		},
      		fail: (e) => {
      			plus.nativeUI.closeWaiting();
      			plus.nativeUI.showWaiting("下载失败");
      				setTimeout(() => {plus.nativeUI.closeWaiting(); 
      					uni.switchTab({url: "/pages/index/index"})
      				}, 1000);
      		}
      	})
      	Pbar.onProgressUpdate((res) => {this.percent = res.progress;})
      },

然后我们开始操作
每次更新前需要把版本号改一下 然后后台也改一下 在这里插入图片描述

制作wgt包 生成的文件 在控制台进入 放到我们上面需要的下载地址就可以了
在这里插入图片描述

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Uniapp中,可以使用条纹进度条来实现一些特殊的进度条效果。关于uniapp条纹进度条的相关内容可以在引文和引文中找到。根据引文中的介绍,可以使用边框阴影和条纹等属性来自定义进度条的样式。例如,可以设置进度条为圆形、小尺寸、带有条纹效果等。在引文中,提供了一些class的说明,包括进度条样式、圆角、圆形、尺寸、条纹和动态条纹效果等。另外,在引文中,给出了一个代码示例,其中使用了cuIcon-apps和text-gray来实现条纹进度条效果。可以根据需要参考这些信息来实现uniapp条纹进度条。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* [Android条纹进度条的实现(调整view宽度仿进度条)](https://download.csdn.net/download/weixin_38744153/14024036)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] - *2* [小程序ColorUI使用简易教程](https://blog.csdn.net/u012767761/article/details/108142560)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] - *3* [color ui](https://blog.csdn.net/qinjinhua_/article/details/125849682)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 33.333333333333336%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值