ArkTs
在正常的网页开发中,实现一个效果,需要html+css+js三种语言实现。
但是使用ArkTs语言,就能全部实现了。
ArkTs是基于TypeScript的,但是呢,TypeScript是基于javascript的,所以ArkTs不但能完成js的工作,还能做的更好!!!!
ArkTs内部集成了ArkUi的组件,哪怕是一个小小的按钮。所以上去是有默认样式的。
ArkTs底层使用方舟编译器,统一字节码,运用AOT技术实现速度优化,虽然写的是ts,但是效率一样很快。
优点
1.开发效率高、开发体验好(语言三合一,代码量变少了)
2. 性能优越(方舟编译器、AOT技术、UI后端引擎、高效渲染引擎等技术)
3.多系统适配能力、接入能力(平台适配层、平台桥接层)
Hello World
@Entry // 装饰器 @entry 入口型组件
@Component // 装饰器 @component 标记自定义组件
struct Index { // 自定义组件 复用性
@State message: string = 'Hello World'
build() { // UI描述 内部以声明式方式描述UI结构
Row() { //内部的都是ArkUi提供的组件 行式布局
Column() { //列式布局
Text(this.message) // 文本组件
.fontSize(50) // 样式组件
.fontWeight(FontWeight.Bold) // 样式组件
.onClick(()=>{ // 事件方法
})
}
.width('100%') // 属性方法 设置组件的UI样式
}
.height('100%') // 属性方法 设置组件的UI样式
}
}
@entry @Component @state 都是装饰器 分别代表 入口型组件、自定义组件、以及类型的定义
build为UI描述 内部以声明式方式描述UI组件 内部存在布局组件、样式组件、以及相关的时间方法或者属性方法。 可以分别进行各种布局、事件的处理以及样式的设置。
实例
我们使用fontcolor定义颜色为灰色。并且给文本设置一个点击事件,推荐使用箭头函数,函数更加简洁。 使用this属性指向message,并给他赋值。
@Entry // 装饰器 @entry 入口型组件
@Component // 装饰器 @component 标记自定义组件
struct Index { // 自定义组件 复用性
@State message: string = 'Hello World'
build() { // UI描述 内部以声明式方式描述UI结构
Row() { //内部的都是ArkUi提供的组件 行式布局
Column() { //列式布局
Text(this.message) // 文本组件
.fontSize(50) // 样式组件
.fontWeight(FontWeight.Bold) // 样式组件
.fontColor('#ccc') //设置一个颜色
.onClick(()=>{ // 事件方法
// 对message的值做修改
this.message = '探索ArkTs'
})
}
.width('100%') // 属性方法 设置组件的UI样式
}
.height('100%') // 属性方法 设置组件的UI样式
}
}
原文地址:https://blog.csdn.net/a_strong_pig/article/details/134837492
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.7code.cn/show_51389.html
如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱:suwngjj01@126.com进行投诉反馈,一经查实,立即删除!