鸿蒙实战案例-欢迎页面UI实现及首页UI设计（二）

最新推荐文章于 2025-04-27 14:52:56 发布
原创 最新推荐文章于 2025-04-27 14:52:56 发布 · 769 阅读 · 6 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#harmonyos #华为 #开发语言

前言

       欢迎来到我的鸿蒙移动开发项目！我将致力于使用鸿蒙操作系统打造出色的移动应用。让我们一起开启创新的旅程！现在我们将做一个关于健康的软件，本次带来的是首页UI设计（二）！

一、设计与布局

界面设计

       这是我们首页整体的UI设计布局，本次我们来做第一部分，搜索栏和邮箱的内容

二、步骤

1.第一步，我们首先新建一个组，将其取名为record

2.创建好后再继续创建页面，将其取名为ReCordIndex

.3.新建好页面后我们开始敲击代码，最终展示为：

三、相关代码<

最低0.47元/天 解锁文章
南宫问路
关注
鸿蒙实战案例——欢迎页面UI实现及欢迎页面业务的实现（一）
m0_73764510的博客
06-22 1708
Entry@Component})})//1.加载首选项//2.判断是否同意//2.1. 同意，跳转首页}else{//2.2.不同意，弹窗})},1000)//1.保存首选项//2.跳转到首页exitApp(){//退出Appbuild() {//1.中央sloganRow(){//2.logo//3.文字描述Row(){Text('黑马健康支持').opacityWhiteText(0.8,12)
鸿蒙实战案例-欢迎页面UI实现及欢迎页面业务
lpq2001124的博客
06-14 1615
声明弹窗控制器，并利用其控制弹窗代码定义了一个名为的组件，用于显示欢迎页面。在这个页面中，首先会检查用户是否同意了隐私政策，如果同意则跳转到首页，否则弹出隐私政策对话框。用户可以选择同意或退出应用。当用户点击同意按钮时，会调用confirm()方法，关闭对话框，进入首页；当用户点击拒绝按钮时，会调用cancel()方法，关闭对话框，退出应用。
鸿蒙实战案例-欢迎页面UI实现及用户协议
woainiyuwen的博客
06-25 782
这段代码实现了一个用户隐私对话框组件，用户可以查看隐私相关内容，并选择同意或拒绝操作。根据用户的选择，会执行对应的回调函数，并关闭对话框。整体布局简洁明了，符合用户操作习惯。
鸿蒙应用开发——UI设计
黄昏下的黎明的博客
04-27 1276
在移动互联网飞速发展的今天，用户对于应用界面的要求越来越高。作为开发者，如何快速掌握最新技术并创建出既美观又实用的应用成为了关键。今天，我们将带大家一起探索基于鸿蒙5.0的UI设计之旅，通过实际案例展示如何利用ArkUI进行页面布局和组件开发。掌握鸿蒙5.0应用的基本架构和开发流程熟练使用ArkUI进行页面布局和组件开发实现同一个Ability内的多个页面导航和数据传递掌握常用组件、容器组件等使用掌握列表渲染和轮播图组件的实现方法理解组件生命周期管理和状态管理。
前端开发 | 鸿蒙(HarmonyOS)应用开发——UI设计
dogking3344的博客
06-26 2377
设置字体大小为 33。.onClick(() => { console.log('ButtonType.Normal') })：设置按钮的点击事件，点击时输出日志。.width('94%') 和 .height('25%')：设置 Column 的宽度为父容器的 94%，高度为 25%。Text('记住密码').fontColor('#4798fd')：显示 "记住密码" 文本，字体颜色为蓝色。Text('快速注册').fontColor('#4798fd')：显示 "快速注册" 文本，字体颜色为蓝色。
鸿蒙实战案例-欢迎页面UI实现及首页Tabs
woainiyuwen的博客
06-25 973
这次我们创建了一个包含三个选项卡的界面。每个选项卡中都有一个标签栏，分别显示了"记录"、"发现页面"和"我的主页"的内容。整体上，这段代码实现了一个具有选项卡功能的界面，其中包含三个不同的页面。
鸿蒙项目-欢迎页面和项目首页day-2
w2825913520的博客
06-25 474
它在组件即将出现时被回调，具体时机为在创建自定义组件的新实例后，在执行其build函数之前。该函数主要用于数据的初始化，以便在build函数中使用这些数据。两个text 完成页面的布局 要注意每个文本的padding和margin 以及容器的space 保证页面的美观。一个tabs下面三个子组建 分别是记录 发现 我的主页 在第一个组建内操作 实现第一个页面的内容。在展示这个页面之前 要弹出一个有关协议的对话框 确保用户遵循协议内容 规范行为。会使用对话框的组件之间的通信和交互。接下来完善首页页面内容。
HarmonyOS Next～鸿蒙系统UI创新实践：原生精致理念下的设计革命
最新发布
Bruce_xiaowei的博客
04-27 736
鸿蒙系统通过底层架构创新，正在重新定义移动操作系统的UI设计标准。其原生精致理念不仅体现在视觉层面，更是构建了一套完整的计算美学体系，为万物智联时代的用户体验树立了新标杆。随着分布式能力的持续进化，鸿蒙的UI创新将持续推动人机交互向更自然、更智能的方向发展。
鸿蒙系统全新ui,鸿蒙系统细节曝光，全新的UI设计流畅度更高，最快下月亮相...
weixin_31527905的博客
05-28 679
华为将会在8月9号召开全球开发者大会，根据最新爆料称，华为将会在下个月的开发者大会上公布鸿蒙OS的细节信息，这一点也是引起了无数网友的期待。不过这在之前，就已经有测试人员向媒体透露了一些鸿蒙系统的部分细节和特性。根据已经接触鸿蒙的测试人员称，鸿蒙系统与EMUI完全不同，这款系统增加了新的启动画面，系统的界面也可以自定义，支持熄屏显示，也可以添加小插件，也可以自定义锁屏界面。此外所有的系统图标都进行...
鸿蒙个人项目-欢迎页面UI及业务实现
m0_73743793的博客
06-25 641
在 UserPrivacyDialog 中使用了@CustomDialog 装饰器声明弹窗组件，通过controller 控制弹窗的出现，添加了Button 按钮，用来实现首页的跳转与退出。再此基础上，需要完成同意协议弹窗的实现。
鸿蒙实战开发教程-注册登录页面
2401_82546228的博客
05-30 3395
在密码输入框中，只要设置TextInput的类型就可以实现带眼睛logo的密码输入框效果：
如何在一个APP中加入欢迎页，以及引导页
热门推荐
赵小样Jasmine的博客
12-23 1万+
我们知道，一般刚打开一个APP的时候，都会出现一个欢迎页，比如下面这个界面，但是这个界面一般是不需要显示太长时间的，而且这个界面之后一般还会有一个带有广告的界面，那个界面可以根据需要停留一段时间。同时，当第一次安装一个APP的时候，一般会出现一个可以滑动的引导界面，用于提示用户该版APP的主要功能。当然，做的好更能吸引用户的眼球，增加点击量。
鸿蒙实战案例-欢迎页面UI实现及饮食记录UI设计
woainiyuwen的博客
06-25 1885
1.CalorieStats.ets：这段代码实现了一个卡路里统计界面，展示了用户的饮食摄入、推荐摄入量、剩余可摄入量以及运动消耗等信息。通过这些数据，用户可以了解自己的卡路里摄入情况并做出相应的调整。2.DatePickDlalog.ets：这段代码实现了一个日期选择对话框，允许用户选择日期并保存选择的日期到全局存储中。通过这个对话框，用户可以方便地选择日期并进行相应的操作。
鸿蒙案例-欢迎页面的实现
weixin_67913109的博客
06-18 644
案例来源于b站课程’用户首选项为应用提供Key-Value键值型的数据处理能力，支持应用持久化轻量级数据，并对其修改和查询。数据存储形式为键值对，键的类型为字符串型，值的存储数据类型包括数字型、字符型、布尔型以及这3种类型的数组类型。
第十八讲_HarmonyOS应用开发实战（实现电商首页）
wenqi1992的博客
01-27 1306
HarmonyOS应用开发实战（实现电商首页）
鸿蒙开发———黑马健康app（UI首页开发）
m0_73970044的博客
06-21 420
通过 @Link 或 @Prop 装饰器将父组件或外部传入的数据绑定到子组件。底部导航栏，通常使用 Tabs 组件，允许用户在不同的功能页面间切换。router 模块来处理页面间的导航和跳转，例如 router.pushUrl 或 router.replaceUrl。利用生命周期方法，如 aboutToAppear 和 aboutToDisappear，来处理页面显示和隐藏时的逻辑。使用 List 或 ForEach 组件遍历项目列表，为每个项目项创建 ListItem的组件。// 1.头部搜索栏。
快速开发一个鸿蒙的页面
shenshizhong的专栏
03-01 4781
鸿蒙基础组件的使用，并通过基础组件构造一个简单的鸿蒙页面
鸿蒙HarmonyOS NEXT开发，实现app启动页UI（一）
商城app+新闻app+备忘录记事本app视频教程在某站【浩宇软件开发】
07-26 2580
在应用的开发过程中，经常需要设计复杂界面，此时涉及到多个相同或不同组件之间的嵌套。如果布局组件嵌套深度过深，或者嵌套组件数过多，会带来额外的开销。如果在布局的方式上进行优化，就可以有效的提升性能，减少时间开销。RelativeContainer为采用相对布局的容器，支持容器内部的子元素设置相对位置关系，适用于界面复杂场景的情况，对多个子组件进行对齐和排列。子元素支持指定兄弟元素作为锚点，也支持指定父容器作为锚点，基于锚点做相对位置布局。
鸿蒙开发实战案例--抽奖App（附源码）
10-17
鸿蒙系统的开发实战案例通常涉及到利用HarmonyOS提供的分布式服务、UI框架以及数据管理能力。例如创建一个抽奖应用，可以涉及以下步骤： 1. **环境准备**：首先需要安装并配置HMS (Huawei Mobile Services) 开发...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值