注册登录

Sin_Y

Sin_Y

发布：2015-10-29 18:11
更新：2015-11-16 12:39
阅读：1613

android-切换屏幕方向

分类：HTML5+

HTML5+ bug已修复

一个页面内plus.screen.lockOrientation，先锁定屏幕方向是横屏，再返回上级页面的时候再锁定屏幕为竖屏，上级页面的子页面内容没有切换为竖屏。

2015-10-29 18:11 负责人:无分享

3 个回复

DCloud_Android_ST

测试横竖屏切换是OK的你贴一下代码吧，具体是怎样操作的。

Sin_Y

Sin_Y (作者)

<!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>
<script src="../js/comm.js"></script>
<script src="../js/download.js"></script>
<script src="../js/shared.js"></script>
<script src="../js/shortcut.js"></script>
<link href="../css/mui.min.css" rel="stylesheet" />
<link href="../css/app.css" rel="stylesheet" />
<link href="../css/myIcon3.css" rel="stylesheet" />
</head>

<body>
<div class="mui-content">
<div class="center">
<img id="gameIcon" class="gameIcon-big mt80" />
</div>
<nav class="mui-bar mui-bar-tab" id="menu">
<a class="mui-tab-item" id="back">
<span class="mui-icon mui-icon-back"></span>
<span class="mui-tab-label">返回</span>
</a>
<a class="mui-tab-item" id="refresh">
<span class="mui-icon myIcon3 icon-my-fresh"></span>
<span class="mui-tab-label">刷新</span>
</a>
<a class="mui-tab-item" id="shared">
<span class="mui-icon myIcon3 icon-my-shared"></span>
<span class="mui-tab-label">分享</span>
</a>
<a class="mui-tab-item" id="addDesktop">
<span class="mui-icon myIcon3 icon-my-Add_desktop"></span>
<span class="mui-tab-label">添加到桌面</span>
</a>

</nav>
</div>
<script type="text/javascript" charset="utf-8">
var _btns = ["登录", "退出"];
var _back = mui.back;
var _game;
mui.plusReady(function() {
updateSharedSerivces();
updateShortcutService();
initView();
});

function initView() {
var self = plus.webview.currentWebview();
_game = self.data;
document.getElementById("gameIcon").src = _game.icon;
var _login = JSON.parse(plus.storage.getItem("login"));
var _free = _game.free;
window.addEventListener("reload", function(et) {
plus.webview.currentWebview().reload();
});
if (_login || _free == 1) {
//是否切换成横屏
if (_game.landscape) {
plus.screen.lockOrientation("landscape-primary");
}
var param = {};
param.exUrl = "/getGameUrl";
if (_login) {
param.userId = _login.id;
param.nickname = _login.nickname;
}
param.gameId = _game.cGameId;
param.gameCPId = _game.gameCPId;
param.param = _game.gameCPParam;
getJSON(param, function(_data) {
var _url = _game.url + "?" + _data.data;
//console.log(_url);
mui.init({
swipeBack: true, //启用右滑关闭功能
beforeback: function() {
//离开时切换成竖屏
plus.screen.lockOrientation("portrait-primary");
mui.fire(plus.webview.getWebviewById('views/main.html'), "reloadEveryOnePlayData", null);
return true;
},
subpages: [{
url: _url,
styles: {
top: '0px', //mui标题栏默认高度为45px；
bottom: '50px' //默认为0px，可不定义；
}
}]
});
});
document.getElementById("back").addEventListener("tap", function(et) {
//plus.screen.lockOrientation("portrait-primary");
_back();
});
document.getElementById("refresh").addEventListener("tap", function(et) {
plus.webview.currentWebview().reload();
});
document.getElementById("shared").addEventListener("tap", function(et) {
shared();
});
document.getElementById("addDesktop").addEventListener("tap", function(et) {
createShortcut();
});
/document.getElementById("hide").addEventListener("tap", function(et) {
plus.webview.getWebviewById(_data.url).setStyle({
top: '0px',
bottom: '0px'
});
});/
play(_game.gameId);
} else {
plus.nativeUI.confirm("请先登录后再进行游戏！", function(e) {
if (e.index != 0) {
_back();
} else {
mui.openWindow({
url: "login.html"
});
}
}, null, _btns);
}
}
mui.back = function() {
/plus.webview.getWebviewById(_data.url).setStyle({
top: '0px',
bottom: '100px'
});/
};

function play(gameId) {
var param = {};
param.exUrl = "/play";
param.gameId = gameId;
var _login = plus.storage.getItem("login");
if (_login) {
param.userId = JSON.parse(_login).id;
}
getJSON(param, play6s);
}

function play6s(_data) {}
</script>
</body>

</html>

DCloud_Android_ST

加上LOG 先确定切换回来的时候是否触发了竖屏逻辑

2015-11-10 18:10
Sin_Y (作者)

回复 DCloud_Android_ST:确实是触发了...而且只有android才有..ios上没有..

2015-11-11 09:47
DCloud_Android_ST

回复 Sin_Y:方便的话提供一个测试DEMO我这边看能不能复现问题，有助于排查

2015-11-11 11:32
Sin_Y (作者)

回复 DCloud_Android_ST:可以,那您加我下Q.837331619

2015-11-11 13:33

DCloud_Android_ST

修复

该问题目前已经被锁定, 无法添加新回复