diff --git a/CHANGELOG.md b/CHANGELOG.md index 4dd40a331e..9a2da274e4 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -57,6 +57,7 @@ - Fix: テーマ切り替え時に一部の色が変わらない問題を修正 - NOTE: 構造上クラシックUIを新しいデザインシステムに移行することが困難なため、クラシックUIが削除されました - デッキUIでカラムを中央寄せにし、メインカラムの左右にウィジェットカラムを配置し、ナビゲーションバーを上部に表示することである程度クラシックUIを再現できます +- Fix: iPadOSでdeck uiをマウスカーソルによってスクロールできない問題を修正 ### Server - Enhance 全体的なパフォーマンス向上 diff --git a/packages/frontend/src/ui/deck.vue b/packages/frontend/src/ui/deck.vue index ef4a6fc03c..bf39c07229 100644 --- a/packages/frontend/src/ui/deck.vue +++ b/packages/frontend/src/ui/deck.vue @@ -12,15 +12,15 @@ SPDX-License-Identifier: AGPL-3.0-only -
-
+ +
{ isMobile.value = window.innerWidth <= 500; }); -const snapScroll = deviceKind === 'smartphone' || deviceKind === 'tablet'; +// ポインターイベント非対応用に初期値はUAから出す +const snapScroll = ref(deviceKind === 'smartphone' || deviceKind === 'tablet'); const withWallpaper = prefer.s['deck.wallpaper'] != null; const drawerMenuShowing = ref(false); const gap = prefer.r['deck.columnGap']; @@ -219,7 +220,16 @@ const onContextmenu = (ev) => { }], ev); }; +// タッチでスクロールしてるときはスナップスクロールを有効にする +function pointerEvent(ev: PointerEvent) { + snapScroll.value = ev.pointerType === 'touch'; +} + +window.document.addEventListener('pointerdown', pointerEvent, { passive: true }); + function onWheel(ev: WheelEvent) { + // WheelEvent はマウスからしか発火しないのでスナップスクロールは無効化する + snapScroll.value = false; if (ev.deltaX === 0 && columnsEl.value != null) { columnsEl.value.scrollLeft += ev.deltaY; } diff --git a/packages/frontend/src/ui/deck/column.vue b/packages/frontend/src/ui/deck/column.vue index 497a04610e..3d359b05c2 100644 --- a/packages/frontend/src/ui/deck/column.vue +++ b/packages/frontend/src/ui/deck/column.vue @@ -17,7 +17,7 @@ SPDX-License-Identifier: AGPL-3.0-only @dragstart="onDragstart" @dragend="onDragend" @contextmenu.prevent.stop="onContextmenu" - @wheel="emit('headerWheel', $event)" + @wheel.passive="emit('headerWheel', $event)" >