鸿蒙开发实例:【demo-搜索历史记录】

 图片演示效果:

cke_1568.png

鸿蒙OS开发更多内容↓点击HarmonyOS与OpenHarmony技术
鸿蒙技术文档开发知识更新库gitee.com/li-shizhen-skin/harmony-os/blob/master/README.md在这。或+mau123789学习,是v喔

代码演示:

// 注:当前代码基于宽度为720的设计稿进行适配,使用lpx单位。
// 整段代码描述的功能:
// 该代码实现了一个简单的搜索功能组件,其中包括:
// 1. 输入框:用户可以在此输入要搜索的内容;
// 2. 搜索按钮:点击后,将当前输入内容添加到搜索历史记录的首位,若有重复则移除重复项,并保持历史记录不超过10条;
// 3. 搜索历史标题和清空记录按钮:展示搜索历史记录列表,并提供清空全部历史记录的功能;
// 4. 搜索历史记录列表:按照时间最近的顺序显示搜索历史记录,最多显示10条。
@Entry
@Component
struct test {// 定义状态变量,用于存储输入框的当前值@State inputValue: string = ''// 定义状态变量,用于存储搜索历史记录的数组@State historyValueArr: Array<string> = ['张三', '李四', '举头望明月', '低头思故乡', 'HarmonyOs', '不可能,绝对不可能']// 构建UI组件build() {// 主体内容使用Column布局,垂直堆叠组件Column() {// 输入框和搜索按钮组合,使用Row布局,水平排列Row() {// 创建一个TextInput输入框TextInput({placeholder: '请输入内容',text: this.inputValue}).width('524.31lpx') // 设置宽度.height('70lpx') // 设置高度.fontSize('27lpx') // 设置字体大小.backgroundColor("#ffffff") // 设置背景颜色// 输入框内容改变时,同步更新状态变量inputValue.onChange((value) => {this.inputValue = value})// 创建一个搜索按钮Button('搜索')// 按钮点击事件,处理搜索逻辑.onClick(() => {// 遍历历史记录数组,若找到与输入框内容相同的记录,从数组中移除for (let i = 0; i < this.historyValueArr.length; i++) {if (this.historyValueArr[i] === this.inputValue) {this.historyValueArr.splice(i, 1);break;}}// 将输入框内容添加到历史记录数组的首位this.historyValueArr.unshift(this.inputValue);// 若历史记录超过10条,则移除最后一项if (this.historyValueArr.length > 10) {this.historyValueArr.splice(this.historyValueArr.length - 1);}})}// 设置Row组件的宽度、对齐方式和内外边距.width('100%').justifyContent(FlexAlign.SpaceBetween).padding({left: '37lpx',top: '11lpx',bottom: '11lpx',right: '15lpx'})// 搜索历史标题和清除记录按钮组合,同样使用Row布局Row() {// 搜索历史标题Text('搜索历史').fontSize('31lpx').fontColor("#000000")// 清空记录按钮Text('清空记录').fontSize('27lpx').fontColor("#828385")// 清空记录按钮点击事件,清空历史记录数组.onClick(() => {this.historyValueArr.length = 0;})}// 设置Row组件的宽度、对齐方式和内外边距.width('100%').justifyContent(FlexAlign.SpaceBetween).padding({left: '37lpx',top: '11lpx',bottom: '11lpx',right: '37lpx'})// 使用Flex布局,按行(FlexDirection.Row)包裹搜索历史记录Flex({direction: FlexDirection.Row,wrap: FlexWrap.Wrap,}) {// 遍历历史记录数组,创建Text组件展示每一条历史记录ForEach(this.historyValueArr, (item: string, value: number) => {Text(item).padding({left: '15lpx',right: '15lpx',top: '7lpx',bottom: '7lpx'})// 设置背景颜色、圆角和间距.backgroundColor("#EFEFEF").borderRadius(10).margin('11lpx')})}// 设置Flex容器的宽度和内外边距.width('100%').padding({left: '26lpx',top: '11lpx',bottom: '11lpx',right: '26lpx'})}// 设置Column容器的宽度、高度和背景颜色.width('100%').height('100%').backgroundColor("#F8F8F8")}
}

鸿蒙开发岗位需要掌握那些核心要领?

目前还有很多小伙伴不知道要学习哪些鸿蒙技术?不知道重点掌握哪些?为了避免学习时频繁踩坑,最终浪费大量时间的。

自己学习时必须要有一份实用的鸿蒙(Harmony NEXT)资料非常有必要。 这里我推荐,根据鸿蒙开发官网梳理与华为内部人员的分享总结出的开发文档。内容包含了:【ArkTS、ArkUI、Stage模型、多端部署、分布式应用开发、音频、视频、WebGL、OpenHarmony多媒体技术、Napi组件、OpenHarmony内核、Harmony南向开发、鸿蒙项目实战】等技术知识点。

废话就不多说了,接下来好好看下这份资料。

如果你是一名Android、Java、前端等等开发人员,想要转入鸿蒙方向发展。可以直接领取这份资料辅助你的学习。鸿蒙OpenHarmony知识←前往。下面是鸿蒙开发的学习路线图。

针对鸿蒙成长路线打造的鸿蒙学习文档。鸿蒙(OpenHarmony )学习手册(共计1236页)与鸿蒙(OpenHarmony )开发入门教学视频,帮助大家在技术的道路上更进一步。

其中内容包含:

《鸿蒙开发基础》鸿蒙OpenHarmony知识←前往

  1. ArkTS语言
  2. 安装DevEco Studio
  3. 运用你的第一个ArkTS应用
  4. ArkUI声明式UI开发
  5. .……

《鸿蒙开发进阶》鸿蒙OpenHarmony知识←前往

  1. Stage模型入门
  2. 网络管理
  3. 数据管理
  4. 电话服务
  5. 分布式应用开发
  6. 通知与窗口管理
  7. 多媒体技术
  8. 安全技能
  9. 任务管理
  10. WebGL
  11. 国际化开发
  12. 应用测试
  13. DFX面向未来设计
  14. 鸿蒙系统移植和裁剪定制
  15. ……

《鸿蒙开发实战》鸿蒙OpenHarmony知识←前往

  1. ArkTS实践
  2. UIAbility应用
  3. 网络案例
  4. ……

最后

鸿蒙是完全具备无与伦比的机遇和潜力的;预计到年底将有 5,000 款的应用完成原生鸿蒙开发,这么多的应用需要开发,也就意味着需要有更多的鸿蒙人才。鸿蒙开发工程师也将会迎来爆发式的增长,学习鸿蒙势在必行!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/772389.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Java代码基础算法练习-报数问题-2024.03.26

任务描述&#xff1a; 有n个人围成一个圆圈分别编号1~n,从第1个到m循环报数&#xff0c;凡是报到m者离开&#xff0c;求n个 人离开圆圈的次序。 任务要求&#xff1a; 代码示例&#xff1a; package M0317_0331;import java.util.ArrayList; import java.util.List; import j…

时序预测 | Matlab实现GWO-BP灰狼算法优化BP神经网络时间序列预测

时序预测 | Matlab实现GWO-BP灰狼算法优化BP神经网络时间序列预测 目录 时序预测 | Matlab实现GWO-BP灰狼算法优化BP神经网络时间序列预测预测效果基本介绍程序设计参考资料 预测效果 基本介绍 1.Matlab实现GWO-BP灰狼算法优化BP神经网络时间序列预测&#xff08;完整源码和数据…

【王道训练营】第6题 输入一个整型数,判断是否是对称数,如果是,输出yes,否则输出no

文章目录 我的代码改正代码其他代码 我的代码 没有完成 #include<stdio.h> int main(){int a;int b;int c0;//位数int d0;//比较几次scanf("%d",&a);while(b!0){bb/10;c;}dc/2;//比较几次int ffor(int i0 ;i<d;i){int ec;//位数fa - a / (((e-i-1)*10…

移动无线电传播与衰弱

文章目录 一、 一般路径损耗模型1. 1 自由环境下路径损耗1. 2 实际情况1.3 考虑阴影衰落 二、代码仿真2.1 仿真代码2.2 数值结果分析 参考 一、 一般路径损耗模型 1. 1 自由环境下路径损耗 根据著名的 Friis 公式&#xff0c;基站发射一个功率&#xff0c;用户得到的功率为&a…

zabbix安装及使用(错误及解决方案)

安装zabbix 常见错误&#xff1a; Zabbix下载错误 6.0与5.0版本冲突 解决方法 yum -y install zabbix-server-mysql zabbix-web-mysql zabbix-get --skip-broken zabbix6.0-web 自己有数据库&#xff0c;使用以下命令 pid找不到 /var/log/zabbix/zabbix_server.log 错误&a…

解决Veeam备份服务器上磁带库状态显示offline断联

问题现象&#xff1a;周末服务器有断电后供电操作&#xff0c;再之后启动服务器发现veeam里磁带库连不上了。 检查磁带库&#xff0c;确认已开机了&#xff0c;带外也可登录 解决方法&#xff1a; 检查veeam服务器上的设备管理器&#xff0c;查看驱动是否正常 显示异常 右键选…

hadoop伪分布式环境启动时web端访问不到

在搭建hadoop伪分布式环境时&#xff0c;开启hdfs-site.sh后&#xff0c;web端访问不到&#xff0c;但是节点已经正常开启&#xff1a; 在尝试关闭防火墙后也没有效果&#xff0c;后来在/etc/hosts文件中加入本机的ip和主机名映射后&#xff0c;重新初始化namenode&#xff0c;…

C语言(结构体,联合体,枚举的讲解)

这期我们来讲解结构体&#xff0c;联合体&#xff0c;以及枚举的讲解&#xff0c;首先我们从概念开始一步一步的了解。 1&#xff0c;结构体 1.1概念 C 语言中的结构体是一种用户自定义的数据类型&#xff0c;它允许你将不同类型的变量组合在一起&#xff0c;从而形成一个新…

flask_restful规范返回值

使用方法 导入 flask_restful.marshal_with 装饰器 定义一个字典变量来指定需要返回的标准化字段&#xff0c;以及该字段的数据类型 在请求方法中&#xff0c;返回自定义对象的时候&#xff0c; flask_restful 会自动的读 取对象模型上的所有属性。 组装成一个符合标准化参…

Linux环境基础开发工具使用——yum and vim

本篇将会介绍平时在Linux中开发常用到的一些工具&#xff0c;其中包括&#xff1a;软件包管理器 — yum&#xff0c;Liunx中的开发工具。具体的介绍了 yum 的相关操作以及 yum 源&#xff0c;同时还介绍了 windows与虚拟机如何进行的关联。然后对Liunx中的开发工具进行了详细的…

2020-Structure Aware Negative Sampling in Knowledge Graphs

摘要 使用对比估计学习知识图中实体和关系的低维表示是一种可扩展且有效的推断连接模式的方法。对比学习方法的一个关键方面是选择产生硬负样本的腐败分布&#xff0c;这迫使嵌入模型学习判别表示并找到观察数据的关键特征。虽然早期的方法要么采用过于简单的腐败分布&#xf…

基于java+springboot+vue实现的超市管理系统(文末源码+Lw+ppt)23-354

摘 要 系统根据现有的管理模块进行开发和扩展&#xff0c;采用面向对象的开发的思想和结构化的开发方法对超市管理的现状进行系统调查。采用结构化的分析设计&#xff0c;该方法要求结合一定的图表&#xff0c;在模块化的基础上进行系统的开发工作。在设计中采用“自下而上”…

蓝桥杯刷题8

1. 世纪末的星期 import java.util.Calendar; public class Main {public static void main(String[] args) {Calendar calendar Calendar.getInstance();for(int year 1999;year<100000;year100){calendar.set(Calendar.YEAR,year);calendar.set(Calendar.MONTH,11);cale…

前端面试拼图-数据结构与算法(二)

摘要&#xff1a;最近&#xff0c;看了下慕课2周刷完n道面试题&#xff0c;记录下... 1. 求一个二叉搜索树的第k小值 二叉树(Binary Tree) 是一棵树 每个节点最多两个子节点 树节点的数据结构{value, left?, right?} 二叉树的遍历 前序遍历&#xff1a;root→left→right 中…

C/C++ 语言中的 ​if...else if...else 语句

C/C 语言中的 ​if...else if...else 语句 1. if statement2. if...else statement3. if...else if...else statementReferences 1. if statement The syntax of the if statement is: if (condition) {// body of if statement }The code inside { } is the body of the if …

聚合支付评级较低的机构能否提升评级

聚合支付机构完成备案是合规展业的第一步&#xff0c;同时&#xff0c;一年一度评级结果对其业务开展和收单机构合作发展具有重要的作用&#xff0c;如若评级较低&#xff0c;将影响到其参与商业银行的外包业务投标&#xff0c;支付机构合作协议签署及合作事宜。 近期&#xf…

Chrome浏览器修改网页内容

方法一&#xff1a;使用开发者工具 在Chrome浏览器中打开要修改的网页。按下F12键打开开发者工具。在开发者工具窗口中&#xff0c;找到“Elements”标签页。在“Elements”标签页中&#xff0c;找到要修改的网页元素。双击要修改的网页元素&#xff0c;即可进行编辑。 方法二…

AIGC 训练场景下的存储特征研究

云布道师 引言&#xff1a;在传统块存储大行其道的时代&#xff0c;需要针对很多行业的工作负载&#xff08;Workload&#xff09;进行调研&#xff0c;包含块大小、随机读、读写比例等等。知道行业的 Workload 对于预估业务的 I/OPS、时延、吞吐等性能有很好的指导意义&#…

Cadence——生成Gerber制板文件

软件版本&#xff1a;Cadence SPB OrCAD Allegro 16.6 打开Allegro PCB Designer 选择如下选项&#x1f447; 点击 File–>Open&#xff0c;找到对应的.brd文件 电气错误的检查&#xff1a;点击 Display–>Status&#xff0c;全为绿色则没有错误 按照不同的项目来进…

基于stm32与TJC3224T124_011串口屏的PID调参器(附完整工程)

电赛在即&#xff0c;每次比赛调PID都是一件比较繁琐的事。每次都要在程序中改完再烧录到板子上&#xff0c;特别耗时。正好最近发现实验室的一块串口屏比较好玩。 于是就做了这个调PID的东西。它可以通过串口直接修改PID的值&#xff0c;从而达到快速调PID的目的。下面我将完整…