自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(7)
  • 收藏
  • 关注

原创 开发鸿蒙项目黑马健康APP的系列随笔

今天的主要工作是对底部弹窗的数字键盘进行详细的设计,并对整体APP的功能进行一个系统的测试。还是先来看一下最终的运行效果截图吧:由上面的运行界面不难看出数字键盘采用的是一种类似于JAVA当中网格布局的布局方式,这里采用的是 鸿蒙开发当中的Grid布局,后面还会做详细的介绍,整体的布局就是一个数字键盘下放加上一个行容器,行容器当中有两个按钮,下面对开发过程中我遇到的问题进行一个详细的叙述。

2024-06-26 10:50:13 289

原创 开发鸿蒙项目黑马健康APP的系列随笔

今天的主要工作是对实物列表的底部弹窗进行初步的界面设计和弹窗逻辑的功能实现,确保用户在点击食物列表中的加号后能顺利弹出底部弹窗。先看一下最终的运行效果截图:由上面的最终效果图可以看出,这次我在设计布局时还是一行列容器的嵌套为主,当然在热量等其他营养素的上下两部分各有一个分割线,这里用到了一个新的UI组件,后面会详细介绍,其余的在界面布局方面都和前面是一样的,这里就不再详细赘述了,同时在进行弹窗设计时,也是用了新的组件,这点也会在后面详细说明。

2024-06-26 09:54:58 169

原创 开发鸿蒙项目黑马健康APP的系列随笔

今天主要是对应用首页的数据统计界面进行设计,并对整个应用首页的进行一次整体的测试评估。下面先展示最终的运行效果图:由上面的运行效果不难看出,这里是采用了两个卡片堆叠在一起的方式,同时页面可以实现左右滑动分别用来向用户展示能量的推荐摄入值和已摄入值。主体框架上的布局还是行容器嵌套列容器,没有什么太大变化。通过此次实验我又学习到一个名叫swiper的新的UI组件,这个组件可以帮助我们实现相应的页面滑动效果,尤其是实现在局部容器中的页面滑动效果。

2024-06-25 17:49:55 385

原创 开发鸿蒙项目黑马健康APP的系列随笔

今天进行的工作主要是对统计卡片中日期信息的一个班级和制作工作,下面是具体的制作过程。首先还是看一下运行的截图吧:正如上图所示的样式,在上次制作的搜索栏的下方是一个带有主题色的row容器,用来显示用户所选择的时间,在用户点击旁边的下按钮之后,会立即弹出一个关于时间日期的弹窗。关于这个弹窗的布局,首先整体上是一个列容器,列容器的下方是一个时间选择器,时间选择器的下方是一个行容器,用来排列确定和取消两个按钮,每个按钮上被赋予了相应的点击事件。

2024-06-23 14:01:53 367

原创 开发鸿蒙项目黑马健康APP的系列随笔

今天的主要工作是对应用首页的页面布局进行设计以及对应用首页顶部的搜索栏部分的功能进行设计和实现。还是先大家展示一下展示一下运行效果的截图:初始化的页面构思布局如下图所示总体上来讲我的构思是用一个总的column容器嵌套三个行容器,这里为了实现三个可选择的可滑动页面,使用了一种类似于容器的新组件Tab,让Tab组件来决定首页导航栏和主体页面的布局关系。同时,由上图也可以看出,首页顶部的搜索栏也是细分成了两个部分,一个是search搜索框,一个是邮件图标。

2024-06-22 19:14:35 227

原创 开发鸿蒙项目黑马健康APP的系列随笔

今天主要完成的是程序首页业务逻辑的判断工作,主要针对的是用户是否同意该应用的用户隐私协议,这里的想法主要是采用用户首选项的方式进行实现。下面一起来看一下详细的编辑过程吧。还是老规矩,现向大家展示一下运行效果图:在介绍运行思路之前,先要向大家简单说明一下:由于这里的相关代码在初始编辑时还不是页面的一部分,所以无法直接执行预览功能,需要在如下图所示的位置增加@preview才能实现对该组件的直接预览。下面再来介绍一下这个页面的整体设计思路。

2024-06-22 12:26:05 22

原创 开发鸿蒙项目黑马健康APP的系列随笔

今天主要制作了程序的欢迎界面,期间主要设计一下几个知识点:一个是ArkUI组件中的行容器(Row)和列容器(column),还包括图片的插入及相关的页面布局的细节等。首先来向大家展示一下我欢迎页面的最终效果图吧:我先来说一下我设计这个页面的整体思路:首先从整体上来讲肯定是一个列式容器,在这个列式容器中,上面“用黑马减更多”的图标为一部分,“黑马健康”的图标为第二部分,剩下的三行文字每行文字又各占一个部分。

2024-06-17 18:21:56 758

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除