Fix：hello mui 顶部选项卡-可左右拖动（webview），首次加载目标webview时，高度不正确

lb786984530 · Dec 9, 2017 · 995d5b8 · 995d5b8
1 parent a026682
commit 995d5b8
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 8 deletions.
diff --git a/examples/hello-mui/examples/tab-top-webview-main.html b/examples/hello-mui/examples/tab-top-webview-main.html
@@ -121,9 +121,6 @@ <h1 class="mui-title">顶部选项卡-可左右拖动(webview)</h1>
 						<a class="mui-control-item" href="#item5mobile" data-wid="tab-top-subpage-5.html">
 							娱乐
 						</a>
-						<!--<a class="mui-control-item" href="#item6mobile" data-wid="tab-top-subpage-6.html">
-							科技
-						</a>-->
 					</div>
 				</div>
 
@@ -135,7 +132,8 @@ <h1 class="mui-title">顶部选项卡-可左右拖动(webview)</h1>
 			mui.init();
 
 			mui.plusReady(function() {
-				var group = new webviewGroup("viewgroup", {
+				var _self = plus.webview.currentWebview();
+				var group = new webviewGroup(_self.id, {
 					items: [{
 						id: "tab-top-subpage-1.html",
 						url: "tab-top-subpage-1.html",
@@ -162,7 +160,11 @@ <h1 class="mui-title">顶部选项卡-可左右拖动(webview)</h1>
 						if(c) {
 							c.classList.remove("mui-active");
 						}
-						document.querySelector(".mui-scroll .mui-control-item:nth-child(" + (parseInt(obj.index) + 1) + ")").classList.add("mui-active");
+						var target = document.querySelector(".mui-scroll .mui-control-item:nth-child(" + (parseInt(obj.index) + 1) + ")");
+						target.classList.add("mui-active");
+						if(target.scrollIntoView) {
+							target.scrollIntoView();
+						}
 					}
 				});
 				mui(".mui-scroll").on("tap", ".mui-control-item", function(e) {
@@ -178,4 +180,4 @@ <h1 class="mui-title">顶部选项卡-可左右拖动(webview)</h1>
 		</script>
 	</body>
 
-</html>
+</html>
diff --git a/examples/hello-mui/js/webviewGroup.js b/examples/hello-mui/js/webviewGroup.js
@@ -28,8 +28,10 @@ proto._initParent = function() {
 	}
 };
 proto._initNativeView = function() {
+	// fixed by wmy 因为沉浸式应用，需要额外加上状态栏高度
+	var statusbar_H = plus.navigator.getStatusbarHeight(); 
 	this.nativeView = new plus.nativeObj.View('__MUI_TAB_NATIVE', {
-		'top': '83px',//这个需要根据顶部导航及顶部选项卡高度自动调整
+		'top': (83 + statusbar_H) +'px', //这个需要根据顶部导航及顶部选项卡高度自动调整
 		'height': (window.screen.height - 83)+"px",
 		'left': '100%',
 		'width': '100%',
@@ -180,7 +182,7 @@ proto.switchTab = function(id) {
 		this._checkDrags(toWebview); //新建的时候均需校验
 	}
 	var self = this;
-//	console.log("current:" + fromWebview.id + ",to:" + fromToLeft);
+//	console.log("current:" + fromWebview.id + ",to:" + fromToLeft);
 //	console.log("next:" + toWebview.id + ",from:" + toFromLeft);
 
 	plus.webview.startAnimation({