HarmonyOS应用开发实战：猫猫大作战-bindSheet 的使用方式-北京尧图网络

前言底部抽屉Bottom Sheet是移动应用中常见的交互模式——从屏幕底部弹出一个面板展示设置项或更多操作。HarmonyOS 提供了bindSheet方法以半模态方式弹出可拖拽的底部面板。本文以「猫猫大作战」的设置抽屉为锚点讲解 bindSheet 的使用方式。提示本系列不讲 ArkTS 基础语法与环境搭建假设你已跟完第 1–98 篇。本篇是阶段三第 99 篇。一、bindSheet 基本用法1.1 基本结构Entry Component struct Index { State showSettings: boolean false; build() { Column() { Button(⚙️ 设置) .onClick(() { this.showSettings true }) } .bindSheet(this.showSettings, this.SettingsSheet(), { detents: [SheetSize.MEDIUM, SheetSize.LARGE], backgroundColor: #FFFFFF }) } Builder SettingsSheet() { Column() { Text(⚙️ 设置).fontSize(24).fontWeight(FontWeight.Bold).margin({ bottom: 24 }) Row() { Text(音效); Toggle({ type: ToggleType.Switch, isOn: true }) } .width(100%).justifyContent(FlexAlign.SpaceBetween).margin({ bottom: 16 }) Row() { Text(震动); Toggle({ type: ToggleType.Switch, isOn: true }) } .width(100%).justifyContent(FlexAlign.SpaceBetween) } .padding(24) .width(100%) } }1.2 参数说明参数类型说明isShowboolean是否显示builderCustomBuilder底部面板内容optionsSheetOptions配置高度、背景色、拖拽等二、游戏设置面板2.1 设置抽屉.bindSheet(this.showSettings, this.SettingsSheet(), { detents: [SheetSize.MEDIUM], backgroundColor: #FFF, showDragBar: true, onDisappear: () { this.saveSettings() } })三、总结bindSheet 实现底部抽屉半模态弹窗支持多级高度拖拽和自定义内容。核心要点.bindSheet(isShow, builder, options)绑定底部抽屉detents控制高度级别适合设置面板、分享菜单、操作列表等下一篇预告第 100 篇将深入 Menu 弹出菜单——长按菜单的实现。如果这篇文章对你有帮助欢迎点赞、收藏⭐、关注你的支持是我持续创作的动力相关资源bindSheet API 参考开源鸿蒙跨平台社区第 98 篇bindContentCover第 100 篇Menu 菜单

HarmonyOS应用开发实战：猫猫大作战-bindSheet 的使用方式

相关推荐

HarmonyOS应用开发实战：猫猫大作战-Stack 叠层布局实现全屏覆盖遮罩、暂停/恢复交互控制

04-模型与Provider-300+模型自由切换

扒开 HTTP/1.1 的底裤：报文结构、状态码与连接管理一次讲透

更多资讯

小智桌面整理工具使用指南：从下载安装到高效配置全流程

基于智能合约的去中心化抽奖：随机数与加密算法实践

浏览器扫码实战：getUserMedia + jsQR从零实现自定义扫一扫

基于MLP的虚假新闻检测：从TF-IDF特征到Keras模型实现

OpenMetadata AutoPilot 应用配置指南：`AutoPilotAppConfig` 字段说明与底层实现

LLM Wiki：构建可溯源、可审计的企业级智能知识系统

今日更新

基于高阶循环谱的MPSK载波频率估计与MATLAB实现

MiniPdf方：.NET开源Office转PDF的高效解决方案

Solon AI v3.10：Java全栈智能体开发框架解析

本周精选

AI驱动的自动化专利分析平台技术解析

LeetCode-Go 题解：1252. Cells with Odd Values in a Matrix（奇数值单元格计数）双解法剖析

在线答疑系统Java毕设实战：Spring Boot前后端分离与状态流转

本月热门

基于YOLO的焊缝缺陷检测：从数据标注到工业部署全流程实践

分布式服务的决策记录

创业产品的首版范围

读完文章，想聊聊您的网站？