HarmonyOS APP开发入门3——组件（二 Text组件）

文章目录

HarmonyOS APP开发入门3——组件（二 Text组件）
- Text组件

Text组件

文本（Text）是用来显示字符串的组件，在界面上显示为一块文本区域。仅仅作为展示数据使用，用户不能在App中修改文本组件中的内容。

Text组件是最基本的组件，后面还会学习他的子类组件，比如Button，TextField都是从这个类衍生而来的。

常见的属性：

这些属性不用去背，用着用着就熟了，想要对文本进行一个设置，如果忘记属性，可以直接到笔记中找，或者到华为开发者文档中找。

常用属性

功能说明	属性名称
id属性,唯一	id
组件宽	width
组件高	height
文本内容	text
背景，可以设颜色值或xml背景	background_element
文字颜色	text_color
文字粗细	text_weight
斜体	italic
文字尺寸单位: fp	text_size
字体。如: 黑体、宋体、楷体	text_font
文字内容对齐方式	text_alignment
左/右外间距	left_margin / right_margin
上下外间距	top_magin / bottom_margin
左/右内间距	left_padding / right_padding
上下内间距	top_padding/ bottom_padding
文本内容换行	paddingmultiple_lines
最大文本显示行数	max_text_lines
自动调节文字大小	auto_font_size

常见属性
<Text
ohos:id="$+id:text"
ohos:width="match_content"
ohos:height="match_content"
ohos:text="Text"
ohos:background_element="$graphic:color_gray_element" />
其他属性使用方式：
字体大小
ohos:text_size="28fp"
字体颜色
ohos:text_color="blue"
Text组件的左外边距
ohos:left_margin="15vp" Text
组件的下外边距
ohos:bottom_margin="15vp"
Text组件和内部文本的右内边距 ohos:right_padding="15vp"
Text组件和内部文本的左内边距 ohos:left_padding="15vp"
设置字体风格 斜体ohos:italic="true"
字重（就是文字的粗细）
ohos:text_weight="700"
字体
ohos:text_font="serif"
设置文本对齐方式
ohos:text_alignment="horizontal_center|bottom"
设置文本换行
ohos:multiple_lines="true"
最大显示行数
ohos:max_text_lines="2"

创建Text

在layout目录下的xml文件中创建Text组件。

<Textohos:id="$+id:text"ohos:width="match_content"ohos:height="match_content"ohos:text="Text"/>

设置Text

在xml中设置Text的背景。

<Text...ohos:background_element="$graphic:background_text"/>

设置字体大小和颜色

<Textohos:id="$+id:text"ohos:width="match_content"ohos:height="match_content"ohos:text="Text"ohos:text_size="28fp"ohos:text_color="#0000FF"ohos:left_margin="15vp"ohos:bottom_margin="15vp"ohos:right_padding="15vp"ohos:left_padding="15vp"ohos:background_element="$graphic:background_text"/>

设置字体风格和字重

<Textohos:id="$+id:text"ohos:width="match_content"ohos:height="match_content"ohos:text="Text"ohos:text_size="28fp"ohos:text_color="#0000FF"ohos:italic="true"ohos:text_weight="700"ohos:text_font="serif"ohos:left_margin="15vp"ohos:bottom_margin="15vp"ohos:right_padding="15vp"ohos:left_padding="15vp"ohos:background_element="$graphic:background_text"/>

设置文本对齐方式

<Textohos:id="$+id:text"ohos:width="300vp"ohos:height="100vp"ohos:text="Text"ohos:text_size="28fp"ohos:text_color="#0000FF"ohos:italic="true"ohos:text_weight="700"ohos:text_font="serif"ohos:left_margin="15vp"ohos:bottom_margin="15vp"ohos:right_padding="15vp"ohos:left_padding="15vp"ohos:text_alignment="horizontal_center|bottom"ohos:background_element="$graphic:background_text"/>

设置自动换行、最大显示行数和自动调节字体大小

<Textohos:id="$+id:text"ohos:width="90vp"ohos:height="match_content"ohos:min_height="30vp"ohos:text="T"ohos:text_color="#0000FF"ohos:italic="true"ohos:text_weight="700"ohos:text_font="serif"ohos:multiple_lines="true"ohos:max_text_lines="1"ohos:auto_font_size="true"ohos:right_padding="8vp"ohos:left_padding="8vp"ohos:background_element="$graphic:background_text"/>

跑马灯效果

<Textohos:id="$+id:text"ohos:width="75vp"ohos:height="match_content"ohos:text="TextText"ohos:text_size="28fp"ohos:text_color="#0000FF"ohos:italic="true"ohos:text_weight="700"ohos:text_font="serif"ohos:background_element="$graphic:background_text"/>

// 跑马灯效果
text.setTruncationMode(Text.TruncationMode.AUTO_SCROLLING);
// 始终处于自动滚动状态
text.setAutoScrollingCount(Text.AUTO_SCROLLING_FOREVER);
// 启动跑马灯效果
text.startAutoScrolling();

喜欢博文可以关注博主哦，以后会持续更新干货的

HarmonyOS APP开发入门3——组件（二 Text组件）相关推荐

HarmonyOS APP开发入门3——组件（四 CommonDialog普通弹框组件）
HarmonyOS APP开发入门3--组件(四 CommonDialog普通弹框组件 ) 文章目录 HarmonyOS APP开发入门3--组件(四 CommonDialog普通弹框组件 ) Com ...
HarmonyOS图片,HarmonyOS App开发造轮子--自定义圆形图片组件
一.背景在采用Java配合xml布局编写鸿蒙app页面的时候,发现sdk自带的Image组件并不能将图片设置成圆形,反复了翻阅了官方API手册(主要查阅了Compont和Image相关的API),起 ...
鸿蒙os事例代码,鸿蒙HarmonyOS App开发造轮子之自定义圆形图片组件的实例代码
一.背景在采用Java配合xml布局编写鸿蒙app页面的时候,发现sdk自带的Image组件并不能将图片设置成圆形,反复了翻阅了官方API手册(主要查阅了Compont和Image相关的API),起 ...
【微信小程序】开发入门篇（二）
前言 ❤️ 所谓信仰,可能就是在人们一无所剩的时候仅有的那种东西 ❤️ [微信小程序]开发入门篇(二) 一.小程序的宿主环境 (1)宿主环境简介 1.1 什么是宿主环境 1.2 小程序的宿主环境 (2 ...
5G 时代的 Android App 开发入门与项目实战
随着移动互联网的持续发展,Android系统从智能手机逐步拓展到平板电脑.智能电视.车载大屏.智能家居.智能手表等诸多设备,Android开发依然是前景可期的IT岗位. 当然,整个社会正在迈向5G时代 ...
HTML5plus 移动 App开发入门
咳咳,图片复制不到文章里面来,大家去我的资源里下载吧,PDF版的. HTML5plus 移动 App开发入门更新时间:2014年 4月 17日 HTML5 Plus 应用概述 HTML5 Plus ...
HTML5 Plus 移动 App开发入门
HTML5 Plus 移动 App开发入门 HTML5+扩展了 JavaScript 对象 plus,使得 js 可以调用各种浏览器无法实现或实现不佳的系统能力,设备能力如摄像头.陀螺仪.文件系统等, ...
傻瓜式Android APP开发入门教程
这篇文章主要介绍了Android APP开发入门教程,从SDK下载.开发环境搭建.代码编写.APP打包等步骤一一讲解,非常简明的一个Android APP开发入门教程,android各种机子和rom的 ...
（转载）H5 手机 App 开发入门：技术篇
H5 手机 App 开发入门:技术篇一.手机 APP 的技术栈二.WebView 控件三.原生技术栈 3.1 Xcode 3.3 Android Studio 四.混合技术栈 4.1 框架种类 ...
《Android App开发入门与项目实战》出版后记
<Android Studio开发实战:从零基础到App上线>自面世以来,承蒙众多朋友的抬爱,该书一直保持不错的销量,其中第一版的出货量突破一万,第二版的出货量即将突破两万.对于一个程序员 ...

HarmonyOS APP开发入门3——组件（二 Text组件）

HarmonyOS APP开发入门3——组件（二 Text组件）

文章目录

Text组件

HarmonyOS APP开发入门3——组件（二 Text组件）相关推荐

最新文章

热门文章