From c028d25221ea9c77de90a8952d8dcf11240eef40 Mon Sep 17 00:00:00 2001 From: qiang Date: Thu, 2 Jan 2020 17:05:49 +0800 Subject: [PATCH] fix: app-v3 windowTop fix: app-v3 --window-top fix: app-v3 windowTop --- packages/uni-cli-shared/lib/platform.js | 4 +- .../app-plus/service/api/device/system.js | 85 +++++++++++-------- src/platforms/app-plus/service/api/util.js | 28 ++++-- .../service/framework/plugins/lifecycle.js | 11 ++- 4 files changed, 82 insertions(+), 46 deletions(-) diff --git a/packages/uni-cli-shared/lib/platform.js b/packages/uni-cli-shared/lib/platform.js index c165ee5a1..c3640ac13 100644 --- a/packages/uni-cli-shared/lib/platform.js +++ b/packages/uni-cli-shared/lib/platform.js @@ -152,9 +152,7 @@ const PLATFORMS = { megalo: false, filterTag: 'wxs', subPackages: false, - cssVars: { - '--window-top': '0px' - }, + cssVars: {}, copyWebpackOptions ({ assetsDir, vueOptions diff --git a/src/platforms/app-plus/service/api/device/system.js b/src/platforms/app-plus/service/api/device/system.js index 9b13810bb..e41dcf072 100644 --- a/src/platforms/app-plus/service/api/device/system.js +++ b/src/platforms/app-plus/service/api/device/system.js @@ -1,7 +1,9 @@ import { callApiSync, isTabBarPage, - getLastWebview + getLastWebview, + getStatusbarHeight, + getScreenInfo } from '../util' import { @@ -17,48 +19,55 @@ export function getSystemInfoSync () { export function getSystemInfo () { const platform = plus.os.name.toLowerCase() const ios = platform === 'ios' - // 安卓 plus 接口获取的屏幕大小值不为整数,iOS js 获取的屏幕大小横屏时颠倒 - const screenWidth = plus.screen.resolutionWidth - const screenHeight = plus.screen.resolutionHeight - // 横屏时 iOS 获取的状态栏高度错误,进行纠正 - var landscape = Math.abs(plus.navigator.getOrientation()) === 90 - var statusBarHeight = Math.round(plus.navigator.getStatusbarHeight()) - if (ios && landscape) { - statusBarHeight = Math.min(20, statusBarHeight) - } - var safeAreaInsets - function getSafeAreaInsets () { - return { - left: 0, - right: 0, - top: titleNView ? 0 : statusBarHeight, - bottom: 0 - } + const { + screenWidth, + screenHeight + } = getScreenInfo() + const statusBarHeight = getStatusbarHeight() + + let safeAreaInsets + const titleNView = { + height: 0, + cover: false } - // 判断是否存在 titleNView - var titleNView - var webview = getLastWebview() + const webview = getLastWebview() if (webview) { let style = webview.getStyle() - if (style) { - titleNView = style && style.titleNView - titleNView = titleNView && titleNView.type === 'default' + style = style && style.titleNView + if (style && style.type && style.type !== 'none') { + titleNView.height = style.type === 'transparent' ? 0 : (statusBarHeight + TITLEBAR_HEIGHT) + titleNView.cover = style.type === 'transparent' || style.type === 'float' } - safeAreaInsets = ios ? webview.getSafeAreaInsets() : getSafeAreaInsets() + safeAreaInsets = webview.getSafeAreaInsets() } else { - safeAreaInsets = ios ? plus.navigator.getSafeAreaInsets() : getSafeAreaInsets() + safeAreaInsets = plus.navigator.getSafeAreaInsets() } - var windowBottom = isTabBarPage() && tabBar.visible && tabBar.cover ? tabBar.height : 0 - var windowHeight = Math.min(screenHeight - (titleNView ? (statusBarHeight + TITLEBAR_HEIGHT) - : 0) - windowBottom, screenHeight) - var windowWidth = screenWidth - var safeArea = { + const tabBarView = { + height: 0, + cover: false + } + if (isTabBarPage()) { + tabBarView.height = tabBar.visible ? tabBar.height : 0 + tabBarView.cover = tabBar.cover + } + const windowTop = titleNView.cover ? titleNView.height : 0 + const windowBottom = tabBarView.cover ? tabBarView.height : 0 + const windowHeight = screenHeight - titleNView.height - tabBarView.height + const windowHeightReal = screenHeight - (titleNView.cover ? 0 : titleNView.height) - (tabBarView.cover ? 0 : tabBarView.height) + const windowWidth = screenWidth + safeAreaInsets = ios ? safeAreaInsets : { + left: 0, + right: 0, + top: titleNView.height && !titleNView.cover ? 0 : statusBarHeight, + bottom: 0 + } + const safeArea = { left: safeAreaInsets.left, right: windowWidth - safeAreaInsets.right, top: safeAreaInsets.top, - bottom: windowHeight - safeAreaInsets.bottom, + bottom: windowHeightReal - safeAreaInsets.bottom, width: windowWidth - safeAreaInsets.left - safeAreaInsets.right, - height: windowHeight - safeAreaInsets.top - safeAreaInsets.bottom + height: windowHeightReal - safeAreaInsets.top - safeAreaInsets.bottom } return { @@ -77,8 +86,14 @@ export function getSystemInfo () { fontSizeSetting: '', platform, SDKVersion: '', - windowTop: 0, + windowTop, windowBottom, - safeArea + safeArea, + safeAreaInsets: { + top: safeAreaInsets.top, + right: safeAreaInsets.right, + bottom: safeAreaInsets.bottom, + left: safeAreaInsets.left + } } } diff --git a/src/platforms/app-plus/service/api/util.js b/src/platforms/app-plus/service/api/util.js index d7c3d97a1..7d1d92402 100644 --- a/src/platforms/app-plus/service/api/util.js +++ b/src/platforms/app-plus/service/api/util.js @@ -1,7 +1,7 @@ -export { - isTabBarPage -} from '../bridge' - +export { + isTabBarPage +} from '../bridge' + export function callApiSync (api, args, name, alias) { const ret = api(args) if (ret && ret.errMsg) { @@ -148,4 +148,22 @@ const _transformlng = function (lng, lat) { const outOfChina = function (lng, lat) { return (lng < 72.004 || lng > 137.8347) || ((lat < 0.8293 || lat > 55.8271) || false) -} +} + +export function getStatusbarHeight () { + // 横屏时 iOS 获取的状态栏高度错误,进行纠正 + return plus.navigator.isImmersedStatusbar() ? Math.round(plus.os.name === 'iOS' ? plus.navigator.getSafeAreaInsets().top : plus.navigator.getStatusbarHeight()) : 0 +} + +export function getScreenInfo () { + const orientation = plus.navigator.getOrientation() + const landscape = Math.abs(orientation) === 90 + // 安卓 plus 接口获取的屏幕大小值不为整数 + const width = plus.screen.resolutionWidth + const height = plus.screen.resolutionHeight + // 根据方向纠正宽高 + return { + screenWidth: Math[landscape ? 'max' : 'min'](width, height), + screenHeight: Math[landscape ? 'min' : 'max'](width, height) + } +} diff --git a/src/platforms/app-plus/service/framework/plugins/lifecycle.js b/src/platforms/app-plus/service/framework/plugins/lifecycle.js index 1a1b8882f..511d0b450 100644 --- a/src/platforms/app-plus/service/framework/plugins/lifecycle.js +++ b/src/platforms/app-plus/service/framework/plugins/lifecycle.js @@ -16,12 +16,17 @@ import { from 'uni-core/service/plugins/lifecycle' import { - ON_REACH_BOTTOM_DISTANCE + ON_REACH_BOTTOM_DISTANCE, + TITLEBAR_HEIGHT } from '../../constants' import tabBar from '../tab-bar' +import { + getStatusbarHeight +} from '../../api/util' + function parsePageCreateOptions (vm, route) { const pagePath = '/' + route const routeOptions = __uniRoutes.find(route => route.path === pagePath) @@ -40,7 +45,7 @@ function parsePageCreateOptions (vm, route) { onPageScroll, onPageReachBottom, onReachBottomDistance, - windowTop: 0, // TODO + windowTop: windowOptions.titleNView && windowOptions.titleNView.type === 'float' ? (getStatusbarHeight() + TITLEBAR_HEIGHT) : 0, windowBottom: (tabBar.indexOf(route) >= 0 && tabBar.cover) ? tabBar.height : 0 } } @@ -88,4 +93,4 @@ export function initLifecycle (Vue) { } } }) -} +} -- GitLab