当前位置: 首页 > news >正文

Harmony OS开发-ArkUI框架速成四

程序员Feri一名12年+的程序员,做过开发带过团队创过业,擅长Java相关开发、鸿蒙开发、人工智能等,专注于程序员搞钱那点儿事,希望在搞钱的路上有你相伴!君志所向,一往无前!


1.图标库

1.1 图标库概述

HarmonyOS 图标库为 HarmonyOS 开发者提供丰富的在线图标资源,涵盖多种使用场景以及风格分类,提供灵活的颜色、大小和格式定义,满足不同角色的下载需求。

1.2 下载图标库

点击即可打开,HarmonyOS 图标库

进入图标库网站,下载 SVG 格式,存储到工程目录:resources/base/media/

HarmonyOS 图标默认命名以 ic_ 开头,其他图标库下载的图标素材建议修改为与 HarmonyOS 命名规则相同。

1.3 使用图标

使用 Image 组件显示图标,添加 fillColor() 属性修改图标颜色

@Entry
@Component
struct Index {@State message: string = '快速拿下ArkUI框架';build() {Column() {Text(this.message).fontSize(30).fontWeight(FontWeight.Bold).margin(10)Row(){Text("图标使用:")Image($r('app.media.ic_celiakeyboard_cangjie')).width(50)}}.width("100%")}
}

2.布局属性

2.1 常用的布局属性

2.2 内边距 padding

作用:在组件内添加间距,拉开内容与组件边缘之间的距离

属性:数字 或 对象{}

● 数字:上下左右内边距相同

● 对象{}:配合 left、right、top、bottom 单独设置某个方向内边距

@Entry
@Component
struct Index {build() {Column() {Text('内边距-Feri演示').backgroundColor(Color.Orange)// 单值:四个方向padding相同.padding(20)// 对象:单独设置某个方向.padding({top: 10,right: 20,bottom: 40,left: 80})}.width("100%")}
}

2.3 外边距 margin

作用:在组件外面添加间距,拉开两个组件之间的距离

属性:margin

属性:数字 或 对象{}

● 数字:上下左右边外距相同

● 对象{}:配合 left、right、top、bottom 单独设置某个方向外边距

@Entry
@Component
struct Index {build() {Column() {Row() {Text('程序员Feri').backgroundColor(Color.Red).padding(10).margin(20)Text('求关注,求点赞').backgroundColor(Color.Blue).padding(10).margin({top: 10,right: 20,bottom: 40,left: 80})}}.width("100%")}
}

好了,夜已深,本篇就到这里吧,关注我,跟着我搞鸿蒙,搞钱!

http://www.lryc.cn/news/515271.html

相关文章:

  • 卡码网 ACM答题编程模板
  • 逆向入门(6)汇编篇-外挂初体验
  • Vulnhub靶场(Earth)
  • CSP初赛知识学习计划
  • 信息科技伦理与道德1:研究方法
  • 高中数学部分基础知识
  • 机器人领域的一些仿真器
  • 5大常见高并发限流算法选型浅析
  • 深入刨析数据结构之排序(下)
  • 特殊数据类型的深度分析:JSON、数组和 HSTORE 的实用价值
  • PCA降维算法详细推导
  • NS4861 单灯指示独立耳锂电池充放电管理 IC
  • 编写可复用性的模块
  • 2025年1月4日CSDN的Markdown编辑器
  • 广域网连接PPP
  • 【pyqt】(四)Designer布局
  • 【从零开始入门unity游戏开发之——C#篇40】C#特性(Attributes)和自定义特性
  • DES密码的安全性分析(简化版本)
  • 引入三方jar包命令
  • 机器学习基础-机器学习的常用学习方法
  • 在控制领域中如何区分有效性、优越性、稳定性和鲁棒性?
  • 美国宏观经济基础框架梳理
  • 装饰器模式详解
  • [最新] SIM卡取出后还能找到我的iPhone吗?
  • 数据分析思维(六):分析方法——相关分析方法
  • 谷歌2025年AI战略与产品线布局
  • 登录的几种方式
  • Scala_【5】函数式编程
  • 解析 World Football Cup 问题及其 Python 实现
  • 9.系统学习-卷积神经网络