#2020征文-TV# 3.1.1 文本组件 - Text 原创 精华

Tuer白晓明
发布于 2020-12-3 14:08
浏览
3收藏

文本组件是我们最常用的组件之一,它是用来在UI界面上显示字符串。作为基本组件,有很多扩展,常见的有按钮组件Button、文本编辑组件TextFiled、计时器组件TickTimer,它们都是Text组件的扩展(也称为Text的子类)。

 

Text(文本组件)是Component类的子类之一,所以它能够使用Component类的所有公开的属性和方法(后面章节会详细介绍该类),Text类自身也提供了一些特殊的属性、方法、内部类和接口。

 

1、从源代码入手

阅读官方的Java API文档看结构不是很清晰,所以我们在DevEco中查看源代码。

/**
 * 继承Component类
 */
public class Text extends Component {}

这里我们说一下如何查看类的继承关系,由于DevEco是基于开源的社区版,它是没有Diagrams功能的,我们可以使用第二种方法Navigate --> Type Hierarchy(或者F4)来查看关系图。

#2020征文-TV# 3.1.1 文本组件 - Text-鸿蒙开发者社区#2020征文-TV# 3.1.1 文本组件 - Text-鸿蒙开发者社区我们可以点击DevEco界面左侧选项卡Structure查看类中详细结构,我们可以看到Text自身提供了很多属性和方法,同时也继承父类的很多属性和方法。

#2020征文-TV# 3.1.1 文本组件 - Text-鸿蒙开发者社区

/**
 * 默认构造函数
 *      用于使用默认属性和样式创建文本实例
 * @param context
 */
public Text(Context context) {}

/**
 * 提供了用于在XML解析后使用指定的属性集合和默认样式创建文本实例的构造函数
 * @param context
 * @param attrSet
 */
public Text(Context context, AttrSet attrSet) {}

/**
 * 提供了用于在XML解析后使用指定的属性集和指定的样式创建文本实例的构造函数
 * @param context
 * @param attrSet
 * @param styleName
 */
public Text(Context context, AttrSet attrSet, String styleName) {}

我们在代码中要给布局添加组件时,需要先创建组件对象。使用磨人的构造函数创建Text对象,后面两种构造函数我们这里不做过多说明,这两种是用于自定义组件时使用的,后面自定义组件小节中会详细介绍,期待吧。

//创建Text对象
Text text = new Text(this);

我们可以在Structure中看到Text类有很多属性,比如设置文本内容的text属性、设置文本内容颜色的textColor属性、设置文本内容字体大小的textSize属性,及设置文本内容字体的font属性等。也有继承自父类的属性,比如设置文本宽度的width属性、设置文本高度的height属性等。

//1. 创建Text对象
Text text = new Text(this);
//2. 设置文本内容宽高
text.setWidth(ComponentContainer.LayoutConfig.MATCH_PARENT);
text.setHeight(ComponentContainer.LayoutConfig.MATCH_PARENT);
//3. 设置显示内容
text.setText("我是在代码创建的Text。");
//4. 设置文字大小
text.setTextSize(50, Text.TextSizeType.FP);
//5. 设置文字颜色
text.setTextColor(Color.BLUE);
//6. 添加组件到布局中
layout.addComponent(text);

我们可以启动一下我们的模拟器,查看是不是在界面中显示了我们设置的文本内容。

#2020征文-TV# 3.1.1 文本组件 - Text-鸿蒙开发者社区当然组件不仅仅是做显示使用的,我们还可以在组件上添加监听事件,来实现交互效果,比如我们点击界面中的文字内容,让它显示成其他的内容。

#2020征文-TV# 3.1.1 文本组件 - Text-鸿蒙开发者社区

我们现在使用的是代码中构建UI界面,当然官方也给我们提供了在XML中声明布局,添加组件,在代码中设置界面入口只需要指定它在内存中的地址。如果我们要对组件进行监听,需要指定其在内存中的地址,然后创建对象完成监听操作。

 

在resources --> base目录下创建layout目录(目录下的文件就是布局资源),然后在该目录下创建布局资源文件(后缀为.xml),然后在XML中声明布局和组件。

<!--xml文件-->
<?xml version="1.0" encoding="utf-8"?>
<DirectionalLayout
    xmlns:ohos="http://schemas.huawei.com/res/ohos"
    ohos:height="match_parent"
    ohos:width="match_parent"
    ohos:orientation="vertical">

    <Text
        ohos:id="$+id:text_helloworld"
        ohos:height="match_parent"
        ohos:width="match_parent"
        ohos:layout_alignment="horizontal_center"
        ohos:text="我是在XML中声明的Text。"
        ohos:text_size="50"
        />

</DirectionalLayout>

 

//在AbilitySlice的onStart方法中设置界面入口,这里指定页面在内存中的地址
super.setUIContent(ResourceTable.Layout_ability_text_xml);

 

#2020征文-TV# 3.1.1 文本组件 - Text-鸿蒙开发者社区2、常用属性和方法

到这里我们已经对Text有了大致的了解,对两种编写布局的方式也有了大致的了解。Text有很多属性和方法,我们在这里给大家列出常用的几个属性和方法。

Text常用属性

Java XML 描述
autoFontSize ohos:auto_font_size 设置是否自动调整字体大小以填充组件。
font ohos:text_font 设置文本字体
maxTextLines ohos:max_text_lines 设置文本视图中允许的最大行数
multipleLine ohos:multiple_line 设置文本是否在文本视图中多行显示
scrollable ohos:scrollable 设置文本是否可滚动
text ohos:text 设置文本内容
textAlignment ohos:text_alignment 设置文本视图中文本的对齐方式
textColor ohos:text_color 设置文本视图中文本的颜色
textSize ohos:text_size 设置文本视图中文本字体大小
truncationMode ohos:truncation_mode 当文本内容超过组件的宽度时,设置截断模式

 

Text常用方法

方法名称 描述
append(String str) 将字符串追加到文本视图中的现有文本
<Text
    ohos:id="$+id:text_helloworld"
    ohos:height="match_content"
    ohos:width="match_content"
    ohos:text="我是在XML中声明的Text。"
    ohos:text_size="50fp"
    />

<Text
    ohos:id="$+id:text_auto_font_size"
    ohos:height="match_content"
    ohos:width="match_content"
    ohos:text="T"
    ohos:text_size="50fp"
    ohos:auto_font_size="true"/>

<Text
    ohos:height="match_content"
    ohos:width="match_content"
    ohos:text="Text Font"
    ohos:text_size="50fp"
    ohos:text_font="serif"/>

 

//2. 自动调整字体大小
Text text_auto_font_size = (Text) findComponentById(ResourceTable.Id_text_auto_font_size);
text_auto_font_size.setClickedListener(l -> {
    text_auto_font_size.append("T");
});

#2020征文-TV# 3.1.1 文本组件 - Text-鸿蒙开发者社区声明:码字不易,转载请注明出处,系列图文仅供学习使用,不可用于商用。因转载作品引发的知识产权或其他法律纠纷的,转载人须自行承担一切后果,与本人无关!

©著作权归作者所有,如需转载,请注明出处,否则将追究法律责任
标签
MingTextComponent.zip 1.22M 57次下载
已于2020-12-12 08:36:17修改
4
收藏 3
回复
举报
8条回复
按时间正序
/
按时间倒序
Tuer白晓明
Tuer白晓明

下一节内容预告:

          1、Text组件的自定义样式

          2、Text组件自定义样式源代码

回复
2020-12-3 14:11:33
SummerRic
SummerRic

不错不错,收藏学习。

回复
2020-12-3 15:56:03
jordana
jordana

爱楼主的日更速度

回复
2020-12-3 15:58:03
Tuer白晓明
Tuer白晓明 回复了 SummerRic
不错不错,收藏学习。

我感觉社区就你们几个

回复
2020-12-3 16:02:50
Tuer白晓明
Tuer白晓明 回复了 SummerRic
抱歉,此内容已被作者删除

应该提供关注后查看更多内容的设置,或者可以设置关注后下载附件,或者登录后下载附件,登录后查看更多内容。这样的话,会不会大家更积极一点? 😃😃  😃 😃

回复
2020-12-3 16:48:44
鲜橙加冰
鲜橙加冰

过来看看IT明新文章。

回复
2020-12-3 20:37:57
一路向北545
一路向北545

请教个问题,给Text设置scrollable为true后,Text中的文本内容确实可以滚动了,但是会自动滚动到最后一行,请问如何设置Text内容显示从第一行开始呢?

回复
2021-3-1 16:07:57
JAM
JAM

请问如何在文本信息中键入换行符呢?  安卓是android:text="aa\nbb"  通过 "\n"换行,鸿蒙这边设置无效

回复
2021-8-9 19:29:54
回复
    相关推荐