- app.js 通过 wx.getSystemInfoSync 获取 statusBarHeight 存入 globalData
- 所有12个自定义导航页面的 JS 读取 statusBarHeight
- WXML 通过 style="padding-top: {{statusBarHeight + 24}}px" 动态适配
- 普通手机和灵动岛手机都能正确显示
35 行
1.2 KiB
Plaintext
35 行
1.2 KiB
Plaintext
<view class="page">
|
|
<view class="page-header page-header-pink" style="padding-top: {{statusBarHeight + 24}}px;">
|
|
<view class="page-header-title">护理设置</view>
|
|
<view class="page-header-subtitle">试用期已结束</view>
|
|
</view>
|
|
|
|
<view class="page-content">
|
|
<view class="page-title">选择护理模式</view>
|
|
|
|
<view class="mode-selector">
|
|
<view class="mode-option active">
|
|
<text class="mode-icon">🔄</text>
|
|
<view class="mode-label">普通模式</view>
|
|
<view class="mode-sub">6色循环</view>
|
|
</view>
|
|
<view class="mode-option locked">
|
|
<text class="mode-icon">🔒</text>
|
|
<view class="mode-label">智能模式</view>
|
|
<view class="mode-sub">订阅解锁</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="tip-card">
|
|
<text class="tip-card-icon">⏰</text>
|
|
<view class="tip-card-body">
|
|
<view class="tip-card-title">试用已结束</view>
|
|
<view class="tip-card-sub">订阅后继续使用智能模式</view>
|
|
</view>
|
|
</view>
|
|
|
|
<button class="btn-primary btn-primary-gold" bindtap="onViewPlans">立即订阅</button>
|
|
<button class="btn-secondary" bindtap="onBack">先使用普通模式</button>
|
|
</view>
|
|
</view>
|