zsh233333的博客

好的如果你看到本篇文章你就可以开心一下了，因为这是此次实战项目开发的最后一篇文章了（完结撒花）我会在这篇文章的最下方附上我的鸿蒙开发文件和实验报告，有需要的同学可以参考那么本篇文章要继续完成饮食记录页面的交互部分并完成最终的数据持久化保存。

前几篇文章我们已经完成了饮食记录数据库的基本操作。

在上篇文章我们已经完成了饮食记录的类型以及本身的数据模型设计，还给饮食记录类型提供了数据操作的Model上篇文章提到饮食记录需要用到关系型数据库。

上篇文章我们先完成了食物和运动的数据模型的设计，有了这些数据我们就可以基于它们添加到饮食记录中去了。

好的前几篇文章我们已经完成了饮食记录相关页面的开发，不过其中的数据还都是一些假数据，也就是没法正常去使用的一些数据，比如前面我们设置的列表就都是一些吐司面包之类的，数据也没有持久化存储，所以本篇文章要去分析饮食记录的数据模型。

本篇文章主要针对多设备响应式布局来说明，由于现在的软件开发指定是不能只在一种设备上进行发布，像某种视频软件，手机、电视、平板、电脑上肯定都会部署。

上篇文章我们已经完成了底部Panel的大部分内容，还剩下一个数字键盘和保存取消按钮，那我们本篇文章来看看怎么个事。

好的我们上篇文章已经完成了食物列表页面UI的基本设计，本篇文章要实现当点击加号按钮时将弹出一个面板，面板中显示食物的详细信息还是老规矩我们先对页面的布局进行分析。

上一篇文章我们已经实现饮食记录页面的绝大部分功能了，那么相对于上一部分呢这一部分就显得非常轻松了OK直接开干。

本篇文章要完成的内容是统计饮食记录卡片的开发，黑马视频时长都达到了惊人的55分18秒，我会尽量的精简其内容的同时保证本篇文章的质量，减少屏幕前你的阅读量及完成本部分所需时间。

好的，我们上一篇文章已经完成了首页的底部导航栏的部分，那么本篇文章呢要带领大家完成饮食记录页面的顶部搜索栏，实际上这部分的工作量是及其至少，相信聪明的你很快就可以去读下一篇文章了。

前两篇文章呢我们已经完成了欢迎页面的开发，包括页面布局以及业务逻辑等那么接下来的几篇文章我将带领你完成首页部分的开发本篇文章呢先为大家讲解首页UI的导航栏设计。

与自定义组件语法及其相似①使用@CustomDialog装饰器声明弹窗组件build(){Column(){Text('弹窗内中的内容')②在页面中声明弹窗控制器，并利用其控制弹窗@Entry@ComponentdialogController: CustomDialogController = new CustomDialogController({//弹窗控制器builder：CustomDialogExample({/*此处可以传入弹窗需要的参数*/}）,//使用自定义弹窗])

分析页面我们可以很清晰的看出，欢迎页面是一个整体列式布局，背景颜色为绿色，从上至下是一个图片-图片-文本-文本-文本的格式。