diff --git a/app/src/boot/onGetConfig.ts b/app/src/boot/onGetConfig.ts index b0c846ccd..abe91ac08 100644 --- a/app/src/boot/onGetConfig.ts +++ b/app/src/boot/onGetConfig.ts @@ -79,6 +79,23 @@ export const onGetConfig = (isStart: boolean, app: App) => { let resizeTimeout = 0; let firstResize = true; window.addEventListener("resize", () => { + /// #if MOBILE + // 获取键盘高度 + window.siyuan.mobile.size.isLandscape = window.matchMedia && window.matchMedia("(orientation: landscape)").matches; + if (window.siyuan.mobile.size.isLandscape) { + if (window.innerHeight < window.siyuan.mobile.size.landscape.height1) { + window.siyuan.mobile.size.landscape.height2 = window.innerHeight; + } else { + window.siyuan.mobile.size.landscape.height1 = window.innerHeight; + } + } else { + if (window.innerHeight < window.siyuan.mobile.size.portrait.height1) { + window.siyuan.mobile.size.portrait.height2 = window.innerHeight; + } else { + window.siyuan.mobile.size.portrait.height1 = window.innerHeight; + } + } + /// #endif if (firstResize) { recordBeforeResizeTop(); firstResize = false; diff --git a/app/src/mobile/index.ts b/app/src/mobile/index.ts index 566f02f13..9ea191442 100644 --- a/app/src/mobile/index.ts +++ b/app/src/mobile/index.ts @@ -53,6 +53,17 @@ class App { dialogs: [], blockPanels: [], mobile: { + size: { + isLandscape: window.matchMedia && window.matchMedia("(orientation: landscape)").matches, + landscape: { + height1: window.innerHeight, + height2: window.innerHeight, + }, // 横屏 + portrait: { + height1: window.innerHeight, + height2: window.innerHeight, + } + }, docks: { outline: null, file: null, diff --git a/app/src/mobile/util/keyboardToolbar.ts b/app/src/mobile/util/keyboardToolbar.ts index 36852c207..7fcaeda5b 100644 --- a/app/src/mobile/util/keyboardToolbar.ts +++ b/app/src/mobile/util/keyboardToolbar.ts @@ -288,8 +288,8 @@ export const showKeyboardToolbarUtil = (oldScrollTop: number) => { showUtil = true; const toolbarElement = document.getElementById("keyboardToolbar"); - const keyboardHeight = ((document.documentElement.clientHeight - window.visualViewport.height) || - (window.outerHeight / 2 - 42)) + "px"; + const keyboardHeight = ((window.siyuan.mobile.size.isLandscape ? window.siyuan.mobile.size.landscape.height1 - window.siyuan.mobile.size.landscape.height2 : window.siyuan.mobile.size.portrait.height1 - window.siyuan.mobile.size.portrait.height2) || + (window.innerHeight / 2 - 42)) + "px"; const editor = getCurrentEditor(); if (editor) { editor.protyle.element.parentElement.style.paddingBottom = keyboardHeight; diff --git a/app/src/protyle/render/av/cell.ts b/app/src/protyle/render/av/cell.ts index 2b1d3a606..3ba3b0102 100644 --- a/app/src/protyle/render/av/cell.ts +++ b/app/src/protyle/render/av/cell.ts @@ -417,9 +417,9 @@ export const cellScrollIntoView = (blockElement: HTMLElement, cellElement: Eleme /// #if MOBILE const contentElement = hasClosestByClassName(blockElement, "protyle-content", true); if (contentElement && cellElement.getAttribute("data-dtype") !== "checkbox") { - const keyboardH = document.documentElement.clientHeight - window.visualViewport.height; - if (cellRect.bottom > window.innerHeight - keyboardH - 42) { - contentElement.scrollTop += cellRect.bottom - window.innerHeight + 42 + keyboardH; + const keyboardToolbarHeight = document.querySelector("#keyboardToolbar").clientHeight; + if (cellRect.bottom > keyboardToolbarHeight) { + contentElement.scrollTop = contentElement.scrollTop + (cellRect.bottom - keyboardToolbarHeight); } else if (cellRect.top < 110) { contentElement.scrollTop -= 110 - cellRect.top; } diff --git a/app/src/types/index.d.ts b/app/src/types/index.d.ts index 3ea673675..e82f26af7 100644 --- a/app/src/types/index.d.ts +++ b/app/src/types/index.d.ts @@ -488,6 +488,17 @@ interface ISiyuan { emojis?: IEmoji[], backStack?: IBackStack[], mobile?: { + size: { + isLandscape:boolean, + landscape: { + height1: number, + height2: number, // 键盘弹起时的高度 + }, // 横屏 + portrait: { + height1: number, + height2: number, + } + } editor?: import("../protyle").Protyle popEditor?: import("../protyle").Protyle docks?: {