Hbuilder打包app
Hbuilder打包注意事項 1,選好圖標、權限 2,不要去除 mui的css js 文件 3,選擇安卓程序進行打包 現有的bug:只能在打開app後選擇一次房間id(直播),以後再選擇id就無效了,不能改變房間id仍是原來的id,
index.htmljavascript
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<script src="js/mui.min.js"></script>
<link href="css/mui.min.css" rel="stylesheet" />
<script type="text/javascript" charset="utf-8">
mui.init();
</script>
</head>
<body>
<nav class="mui-bar mui-bar-tab">
<a class="mui-tab-item mui-active" id="live">
<span class="mui-icon mui-icon-home"></span>
<span class="mui-tab-label">直播</span>
</a>
<a class="mui-tab-item" id='whtch'>
<span class="mui-icon mui-icon-phone"></span>
<span class="mui-tab-label">觀看</span>
</a>
<a class="mui-tab-item">
<span class="mui-icon mui-icon-chatbubble"></span>
<span class="mui-tab-label">消息</span>
</a>
<a class="mui-tab-item">
<span class="mui-icon mui-icon-gear"></span>
<span class="mui-tab-label">設置</span>
</a>
</nav>
</body>
<script type="text/javascript">
mui.init({
subpages: [{
url: 'live.html', //一進入app就顯示main頁面
id: 'live.html',
styles: {
top: '0px', //mui標題欄默認高度爲45px；
bottom: '50px' //默認爲0px，可不定義；
},
}],
});
document.getElementById('live').addEventListener('tap', function() {
mui.openWindow({
url: 'live.html',
id: 'live.html',
styles: {
top: '0px', //mui標題欄默認高度爲45px；
bottom: '50px' //默認爲0px，可不定義；
}
})
});
document.getElementById('whtch').addEventListener('tap', function() {
mui.openWindow({
url: 'video.html',
id: 'video.html',
styles: {
top: '0px', //mui標題欄默認高度爲45px；
bottom: '50px' //默認爲0px，可不定義；
}
})
});
</script>
</html>
live.htmlcss
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<title>個人直播間</title>
<link rel="stylesheet" type="text/css" href="css/mui.css" />
<script src="js/mui.js" type="text/javascript" charset="utf-8"></script>
</head>
<body style="margin:0;padding:0;text-align:center;">
個人直播
<br/>
<br/>
<style type="text/css">
#popover {
height: 80px;
width: 100px;
}
</style>
<div id="popover" class="mui-popover">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<ul class="mui-table-view">
<li class="mui-table-view-cell">
<span onclick="chose_id('0001')">0001</span>
</li>
<li class="mui-table-view-cell">
<span onclick="chose_id('0002')">0002</span>
</li>
<li class="mui-table-view-cell">
<span onclick="chose_id('0003')">0003</span>
</li>
<li class="mui-table-view-cell">
<span onclick="chose_id('0004')">0004</span>
</ul>
</div>
</div>
</div>
<a href="#popover" id="openPopover" class="mui-btn mui-btn-primary">選擇房間id</a>
<button onclick="preview()">開始</button>
<button onclick="switchCamera()">切換攝像頭</button>
<button onclick="stopPreview()" id='end'>結束直播</button>
<br/>
<br/>
<br/>
<span id='flag' style="float: left;margin-left:10px;">aaaa</span>
<br/>
<div id="pusher" style="width:100%;height:300px;background-color:#000000;margin:auto"></div>
</body>
<script type="text/javascript">
mui.init()
var Sdata = null
var live_id = null
var pusher = null;
mui.plusReady(function() {
Sdata = plus.webview.currentWebview();
console.log(JSON.stringify(Sdata));
if(Sdata.home_id) {
live_id = Sdata.home_id
} else {
live_id = '0001'
}
document.getElementById("flag").innerText = 'id:' + live_id //試了不少次只有這樣才能解決js異步的問題
})
mui('.mui-scroll-wrapper').scroll()
document.addEventListener('plusready', plusReady, false);
// H5 plus事件處理
function plusReady() {
// 建立直播推流控件
pusher = new plus.video.LivePusher('pusher', {
url: 'rtmp://www.perfey.top:1935/live/' + live_id
});
}
// 預覽
function preview() {
pusher.start();
// pusher.preview();
}
// 結束
function stopPreview() {
pusher.stop({
preview: false
});
pusher.close()
};
// 切換攝像頭
function switchCamera() {
pusher.switchCamera();
}
function chose_id(id) {
mui.openWindow({
url: 'live.html',
id: 'live.html',
styles: {
top: '0px', //mui標題欄默認高度爲45px；
bottom: '50px' //默認爲0px，可不定義；
},
extras: {
"home_id": id
},
createNew: true
})
}
// console.log(id);
// live_id = id;
// document.getElementById("flag").innerText = 'id:' + live_id;
// pusher.stop({
// preview: false
// });
// pusher.options.url = 'rtmp://www.perfey.top:1935/live/' + live_id
// pusher = new plus.video.LivePusher('pusher', {
// url: 'rtmp://www.perfey.top:1935/live/' + live_id
// });
// console.log(JSON.stringify(pusher))
// pusher.start();
// }
// document.getElementById("openPopover").onclick = function(){
// mui.post('http://127.0.0.1:8000/live/get_id/', {
// }, function(data) {
//
// alert(1111)
// console.log(data);
//
// }, 'json');
//
// }
</script>
</html>
video.htmlhtml
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<title>Video Example</title>
<link rel="stylesheet" type="text/css" href="css/mui.css" />
</head>
<body style="margin:0;padding:0;text-align:center;">
觀看直播
<br/><br/>
<style type="text/css">
#popover {
height: 80px;
width: 100px;
}
</style>
<div id="popover" class="mui-popover">
<div class="mui-scroll-wrapper">
<div class="mui-scroll">
<ul class="mui-table-view">
<li class="mui-table-view-cell">
<span onclick="chose_id('0001')">0001</span>
</li>
<li class="mui-table-view-cell">
<span onclick="chose_id('0002')">0002</span>
</li>
<li class="mui-table-view-cell">
<span onclick="chose_id('0003')">0003</span>
</li>
<li class="mui-table-view-cell">
<span onclick="chose_id('0004')">0004</span>
</ul>
</div>
</div>
</div>
<a href="#popover" id="openPopover" class="mui-btn mui-btn-primary">選擇直播間</a>
<button onclick="playVideo()">播放視頻</button>
<button onclick="closeVideo()">關閉視頻</button>
<br/>
<span id='flag' style="float: left;margin-left:10px;"></span>
<br/>
<div id="video" style="width:100%;height:300px;background-color:#000000;margin:auto"></div>
</body>
<script src="js/mui.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
mui.init()
var Sdata = null
var live_id = null
mui.plusReady(function() {
Sdata = plus.webview.currentWebview();
console.log(JSON.stringify(Sdata));
if(Sdata.home_id) {
live_id = Sdata.home_id
} else {
live_id = '0001'
}
document.getElementById("flag").innerText = 'id:' + live_id //試了不少次只有這樣才能解決js異步的問題
})
mui('.mui-scroll-wrapper').scroll()
var video = null;
// H5 plus事件處理
function plusReady() {
// 建立視頻播放控件
video = new plus.video.VideoPlayer('video', {
// src:'http://www.perfey.top/media/video/1' 這個不行,地址發送的必須是mp4格式,我本身的是數據流,瀏覽器能夠識別,這個卻不行
//src: 'http://192.168.43.5:5000/myvideo' // 播放視頻
src: 'rtmp://www.perfey.top/live/' + live_id //直播拉流,這個是能夠的,123是直播間的房間id能夠更改的,我這裏沒有設置防盜鏈,之後能夠玩玩
//src: 'images/1.mp4'
});
}
document.addEventListener('plusready', plusReady, false);
// 播放視頻
function playVideo() {
video.play();
};
// 關閉視頻
function closeVideo() {
video.close();
}
function chose_id(id) {
mui.openWindow({
url: 'video.html',
id: 'video.html',
styles: {
top: '0px', //mui標題欄默認高度爲45px；
bottom: '50px' //默認爲0px，可不定義；
},
extras: {
"home_id": id
},
createNew: true
})
}
</script>
</html>
相關文章
- 1. hbuilder打包APP
- 2. Hbuilder打包App
- 3. Hbuilder打包Android app
- 4. HbuilderX打包app，Hbuilder怎麼打包app
- 5. HBuilder打包App方法
- 6. 用HBuilder打包測試app
- 7. HBuilder打包App方法1
- 8. 用HBuilder打包安卓app
- 9. HBuilder打包App方法2
- 10. HBuilder打包app(vue項目)
- 更多相關文章...
- • ionic 創建 APP - ionic 教程
- • R 包 - R 語言教程
- • IntelliJ IDEA 代碼格式化配置和快捷鍵
- • Docker容器實戰(一) - 封神Server端技術
相關標籤/搜索
每日一句
-
每一个你不满意的现在，都有一个你没有努力的曾经。
歡迎關注本站公眾號,獲取更多信息
