「小程序JAVA实战」小程序的横向视频和页面拦截(59)
转自;https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxudehengxiangshipinheyemianlanjie58/
在手机拍摄视频的时候,存在2个情况,手机横这和手机竖着。如果是横着的情况下,我们竖着拿手机观看模式,包括抖音,快手,他们的解决方案都是上下出现黑色变宽,对视频进行等比例压缩。老铁我也参考这个来完成。另外如果用户为登录的情况下,想进入我的需要登录才可以,这个也需要页面通过缓存中获取用户信息来进行控制。源码:https://github.com/limingios/wxProgram.git 中No.15
详情页面横竖屏的控制
如果视频的宽度大于高度,video的填充模式就修改为正常的情况。不进行填充
var videoUtils = require('../../utils/videoUtils.js')
const app = getApp()
Page({
data: {
cover:'cover',
videoContext:"",
videoInfo:{},
videId:'',
src:''
},
showSearch:function(){
wx.navigateTo({
url: '../videoSearch/videoSearch',
})
},
onLoad:function(params){
var me = this;
me.videoContext = wx.createVideoContext('myVideo', me);
var videoInfo = JSON.parse(params.videoInfo);
var videoWidth = videoInfo.videoWidth;
var videoHeight = videoInfo.videoHeight;
var cover = 'cover';
if (videoWidth > videoHeight){
cover = '';
}
me.setData({
videId: videoInfo.id,
src: app.serverUrl + videoInfo.videoPath,
videoInfo: videoInfo,
cover: cover
})
},
showIndex:function(){
wx.redirectTo({
url: '../index/index',
})
},
onShow:function(){
var me = this;
me.videoContext.play();
},
onHide:function(){
var me = this;
me.videoContext.pause();
},
upload:function(){
videoUtils.uploadVideo();
},
showMine: function () {
var me = this;
var userInfo = app.getGlobalUserInfo();
if (userInfo.id == '' || userInfo.id == undefined){
wx.navigateTo({
url: '../userLogin/userLogin',
})
}else{
wx.navigateTo({
url: '../mine/mine',
})
}
},
})
详情跳转到个人页面
判断缓存中是否存在用户信息,存在跳转到个人信息页面,不存在,跳转到登录页面
PS:小程序一般的开发思路就是尽量前端能办的少麻烦后端,减少交互。这样用户体验就上去了。
「小程序JAVA实战」小程序的横向视频和页面拦截(59)的更多相关文章
- 「小程序JAVA实战」小程序的个人信息作品,收藏,关注(66)
转自:https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxudegerenxinxizuopinshoucangguanzhu65 ...
- 「小程序JAVA实战」小程序头像图片上传(下)(45)
转自:https://idig8.com/2018/09/09/xiaochengxujavashizhanxiaochengxutouxiangtupianshangchuan44/ 接下来,我们应 ...
- 「小程序JAVA实战」小程序多媒体组件(27)
转自:https://idig8.com/2018/08/19/xiaochengxujavashizhanxiaochengxuduomeitizujian27/ 来说下 ,小程序的多媒体组件.源码 ...
- 「小程序JAVA实战」小程序的flex布局(22)
转自:https://idig8.com/2018/08/09/xiaochengxu-chuji-22/ 之前已经把小程序的框架说完了,接下来说说小程序的组件,在说组件之前,先说说布局吧.源码:ht ...
- 「小程序JAVA实战」 小程序私有页面的生命周期以及导航(10)
转自:https://idig8.com/2018/08/09/xiaochengxu-chuji-10/ 之前讲了小程序全局的生命周期,今天咱们说说单个页面的生命周期!源码:https://gith ...
- 「小程序JAVA实战」小程序视频处理工具ffmpeg(47)
转自:https://idig8.com/2018/09/16/xiaochengxujavashizhanxiaochengxushipinchuligongjuffmpeg46/ 前面已经把视频成 ...
- 「小程序JAVA实战」小程序查看视频发布者信息(64)
转自:https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxuchakanshipinfabuzhexinxi63/ 当我们点击右下 ...
- 「小程序JAVA实战」小程序的留言和评价功能(70)
转自:https://idig8.com/2018/10/28/xiaochengxujavashizhanxiaochengxudeliuyanhepingjiagongneng69/ 目前小程序这 ...
- 「小程序JAVA实战」小程序的举报功能开发(68)
转自:https://idig8.com/2018/09/25/xiaochengxujavashizhanxiaochengxudeweixinapicaidancaozuo66-2/ 通过点击举报 ...
- 「小程序JAVA实战」小程序的关注功能(65)
转自:https://idig8.com/2018/09/24/xiaochengxujavashizhanxiaochengxudeguanzhugongneng64/ 在个人页面,根据发布者个人和 ...
随机推荐
- bzoj1179: [Apio2009]Atm scc缩点+dag上dp
先把强连通缩点,然后变成了dag,dp求终点是酒吧的最长路即可, /************************************************************** Pro ...
- 转-Linux启动过程详解(inittab、rc.sysinit、rcX.d、rc.local)
http://blog.chinaunix.net/space.php?uid=10167808&do=blog&id=26042 1)BIOS自检2)启动Grub/Lilo3)加 ...
- 浅谈jsonp
要谈jsonp,首先要弄明白jsonp是什么,它是用来干嘛的.jsonp其实就是我们常用的script标签,用来解决跨域的,只不过这个标签是动态创建的,为啥要动态创建涅. 举个小栗子: 假如我们远程文 ...
- java实现的18位身份证格式验证算法
公民身份号码是特征组合码,由十七位数字本体码和一位数字校验码组成.排列顺序从左至右依次为:六位数字地址码,八位数字出生日期码,三位数字顺序码和一位数字校验码.1.地址码表示编码对象常住户口所在县(市. ...
- html绘制三角形(兼容IE6)
.sanjiao { width:; height:; overflow: hidden; border-width: 10px; border-color: red transparent tran ...
- hrbust 1621 迷宫问题II 广搜
题目链接:http://acm.hrbust.edu.cn/vj/index.php?/vj/index.php?c=&c=contest-contest&cid=134#proble ...
- iOS多线程GCD详解
在这之前,一直有个疑问就是:gcd的系统管理多线程的概念,如果你看到gcd管理多线程你肯定也有这样的疑问,就是:并发队列怎么回事,即是队列(先进先出)怎么会并发,本人郁闷了好久,才发现其实cgd管理多 ...
- 【LeetCode 36_哈希表】Valid Sudoku
//occupyed_1检查行是否占用 //occupyed_2检查列是否占用 //occupyed_3检查块是否占用 bool isValidSudoku(vector<vector<c ...
- Internet Explorer 11.0.9600.16428 For Windows 7
官方消息http://blogs.msdn.com/b/ie/archive/2013/11/07/ie11-for-windows-7-globally-available-for-consumer ...
- Alpha阶段贡献分配规则
作业要求[https://edu.cnblogs.com/campus/nenu/2018fall/homework/2244] 分配规则: 1.每人有基础分3分. 2.每参加一次组内会议及活动加0. ...