美食类网站模板,网站的ftp地址是什么,网页视频下载网址,网站前台页面的设计与实现目录 一、Text组件
1、Text组件案例
二、Text组件参数
1、string字符串类型
2、Resources类型
2.1、resources中内容配置
base/element/string.json 中的内容
zh_US/element/string.json 中的内容
es_US/element/string.json 中的内容
2.2、环境适配 适配英文 适配中文…目录 一、Text组件
1、Text组件案例
二、Text组件参数
1、string字符串类型
2、Resources类型
2.1、resources中内容配置
base/element/string.json 中的内容
zh_US/element/string.json 中的内容
es_US/element/string.json 中的内容
2.2、环境适配 适配英文 适配中文
三、Text常用属性
1、fontSize()
2、fontWeight()
3、fontColor() 一、Text组件
鸿蒙中的文本组件是Text Text组件的参数类型为string | Resource
string字符串类型如 Text(这是一段文本我是字符串类型)Resource类型使用$r()引用定义的字符串内容在resources/*/element的string.json文件
1、Text组件案例
Entry
Component
struct Index {State isOn: boolean false;State isDel: boolean false;build() {Column({ space: 10 }) {Text(你好 鸿蒙).fontSize(50)Text($r(app.string.greeting)).fontSize(50)}.width(100%).height(100%).justifyContent(FlexAlign.Center)}
} 二、Text组件参数
1、string字符串类型 Text(你好 鸿蒙).fontSize(50) 2、Resources类型 Text组件中的参数的文字内容可是字符串直接写死在代码中也可是编辑到resources目录下下的不用环境的配置文件中如base、en_Us、zh_Us目录下的element中的 String.json文件。 如下图所示Text组件中的$r(app.string.greeting)文本可以写到 三个不同目录的环境中根据不同的环境适配不同的内容。但注意在配置时候必须三个文件中都配置否则会显示报错如 2.1、resources中内容配置
base/element/string.json 中的内容
{string: [{name: module_desc,value: module description},{name: EntryAbility_desc,value: description},{name: EntryAbility_label,value: label},{name: greeting,value: 你好 鸿蒙 base}]
}
zh_US/element/string.json 中的内容
{string: [{name: module_desc,value: 模块描述},{name: EntryAbility_desc,value: description},{name: EntryAbility_label,value: label},{name: greeting,value: 你好 鸿蒙 zh}]
}
es_US/element/string.json 中的内容
{string: [{name: module_desc,value: module description},{name: EntryAbility_desc,value: description},{name: EntryAbility_label,value: label},{name: greeting,value: hello harmony en}]
} 2.2、环境适配 适配英文 当我们选择en_us时候会自动的选择适配环境 en_US/element/string.json中的适配内容。 适配中文 我们选择zh_us时候会自动的选择适配环境 zh_US/element/string.json中的适配内容。
三、Text常用属性
字体大小fontSize() 方法进行设置该方法参数类型为 string | number | Resource字体粗细fontWeight()方法进行设置该方法参数类型为 string | number | FontWeight字体颜色fontColor() 方法进行设置该方法参数类型为 string | number | Resource |Color文本对齐 TextAlign.Start 首部对齐 TextAlign.Center 居中对齐 TextAlign.End 尾部对齐
1、fontSize()
string 指定字体大小的具体单位例如fontSize(100px)、例如fontSize(100fp)number 数值默认单位 fp Resource 引用resources下的element目录中定义的数值
Entry
Component
struct Index {State isOn: boolean false;State isDel: boolean false;build() {Column({ space: 10 }) {Text(你好 鸿蒙).fontSize(150px)Text(你好 鸿蒙).fontSize(50fx)Text(你好 鸿蒙).fontSize(50)}.width(100%).height(100%).justifyContent(FlexAlign.Center)}
}2、fontWeight()
string 数字与样式字符串例如例如100和boldnumber [100,900]取值间隔为100默认为400值越大字体越粗。FontWeight枚举类型
Entry
Component
struct Index {State isOn: boolean false;State isDel: boolean false;build() {Column({ space: 10 }) {Text(你好 鸿蒙).fontSize(50)Text(你好 鸿蒙).fontSize(50).fontWeight(600)Text(你好 鸿蒙).fontSize(50).fontWeight(500)Text(你好 鸿蒙).fontSize(50).fontWeight(FontWeight.Bold)Text(你好 鸿蒙).fontSize(50).fontWeight(bolder)}.width(100%).height(100%).justifyContent(FlexAlign.Center)}
}3、fontColor()
string rgb(0, 128, 0)或者#008000number 16进制的数字如 0x008000Resource 引用resources下的element目录中定义的数值Color 枚举类型例如Color.Green
Entry
Component
struct Index {State isOn: boolean false;State isDel: boolean false;build() {Column({ space: 10 }) {Text(你好 鸿蒙).fontSize(50).fontColor(Color.Green)Text(你好 鸿蒙).fontSize(50).fontWeight(600).fontColor(Color.Orange)Text(你好 鸿蒙).fontSize(50).fontWeight(500).fontColor(Color.Blue)}.width(100%).height(100%).justifyContent(FlexAlign.Center)}
}Entry
Component
struct FontColorPage {build() {Column({ space: 50 }) {Text(Color.Green).fontSize(40).fontWeight(FontWeight.Bold).fontColor(Color.Green)Text(rgb(0, 128, 0)).fontSize(40).fontWeight(FontWeight.Bold).fontColor(rgba(59, 171, 59, 0.33)) // rgba 表示透明度Text(#008000).fontSize(40).fontWeight(FontWeight.Bold).fontColor(#a4008000)Text(0x008000).fontSize(40).fontWeight(FontWeight.Bold).fontColor(0xa4008000)}.width(100%).height(100%).justifyContent(FlexAlign.Center)}
}
4、文本对齐
Entry
Component
struct Index {State isOn: boolean false;State isDel: boolean false;build() {Column({ space: 10 }) {Text(文本对齐TextAlign.Start首部对齐、TextAlign.Center 居中对齐、TextAlign.End尾部对齐).fontSize(20).textAlign(TextAlign.Start)Text(文本对齐TextAlign.Start首部对齐、TextAlign.Center 居中对齐、TextAlign.End尾部对齐).fontSize(20).textAlign(TextAlign.End)Text(文本对齐TextAlign.Start首部对齐、TextAlign.Center 居中对齐、TextAlign.End尾部对齐).fontSize(20).textAlign(TextAlign.Center)}.width(100%).height(100%).justifyContent(FlexAlign.Center)}
}
