上架自检两项整改:横竖屏布局一致性 + 页面转场改为淡入淡出(弹簧曲线)
一、横竖屏(意见 1:折叠屏展开态 / 平板需支持横竖屏切换;接近 1:1 的设备横竖屏布局需保持一致) - 主界面布局判据由"是否横屏 (orientation: landscape)"改为"窗口短边是否达到大屏断点 840vp": min(宽,高) >= 840vp 等价于 (width >= 840vp) && (height >= 840vp),用两条 mediaquery 合成。 - 短边在旋转时不变(宽高互换),因此横竖屏布局天然保持一致 —— 屏幕比例接近 1:1 的设备 (折叠屏展开态、平板)在旋转时不会再出现"单栏 ⇄ 双栏"的布局跳变。 - 不锁死屏幕方向(module.json5 仍为 auto_rotation_restricted),折叠屏展开态与平板 依旧可以自由横竖屏切换显示。 二、转场动效(意见 2:使用系统转场,淡入淡出,曲线优先弹簧曲线) - 全部 7 个 @Entry 页面新增 pageTransition():只做 opacity 淡入淡出, 不调用 .slide() / .translate(),即不做左右平移 / 上下位移 / 单帧直接切换。 - 转场曲线使用 curves.springMotion() 弹簧曲线。
This commit is contained in:
@@ -1,6 +1,6 @@
|
||||
// entry/src/main/ets/pages/CalendarListPage.ets
|
||||
// 添加账号第二页:PROPFIND 列出日历本 → 勾选 → 命名 → 保存账号
|
||||
import { router } from '@kit.ArkUI';
|
||||
import { curves, router } from '@kit.ArkUI';
|
||||
import { buffer } from '@kit.ArkTS';
|
||||
import { BusinessError } from '@kit.BasicServicesKit';
|
||||
import { DavAccount, AccountStore, TYPE_CALDAV } from '../common/AccountStore';
|
||||
@@ -369,6 +369,19 @@ struct CalendarListPage {
|
||||
.expandSafeArea([SafeAreaType.SYSTEM], [SafeAreaEdge.TOP, SafeAreaEdge.BOTTOM])
|
||||
.alignItems(HorizontalAlign.Center)
|
||||
}
|
||||
|
||||
/**
|
||||
* 页面转场:淡入淡出。
|
||||
* 不做左右平移 / 上下位移(不调用 .slide() / .translate()),只做透明度变化,
|
||||
* 避免单帧直接切换;曲线使用弹簧曲线(springMotion)。
|
||||
*/
|
||||
pageTransition() {
|
||||
PageTransitionEnter({ type: RouteType.None, duration: 300, curve: curves.springMotion(0.35, 0.75) })
|
||||
.opacity(0);
|
||||
PageTransitionExit({ type: RouteType.None, duration: 250, curve: curves.springMotion(0.35, 0.75) })
|
||||
.opacity(0);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@Component
|
||||
|
||||
Reference in New Issue
Block a user