冰狐智能辅助
首页
文档&下载
移动端
微服务
社区
码农教程
管理中心
关于我们
登录/注册
文本(text)

文本控件介绍

文本控件（view）用于显示文本，可以控制文本的字体大小、颜色和字体等。

属性-text

文本内容。 支持两种设置方式，1.在template中直接设置；2.使用函数动态设置和获取文本。 <template> <text id="demo" text="hello"/> </template> function main() { setupUI(); } function onUIResume() { ui('demo').setText('ok'); var text = ui('demo').getText(); }

属性-size

设置文本字体大小，单位为sp。 支持两种设置方式，1.在template中直接设置；2.使用函数动态设置。 <template> <text id="demo" size="20"/> </template> function main() { setupUI(); } function onUIResume() { ui('demo').setSize(12); }

属性-gravity

控件内容在控件中的位置。
  • left。靠左
  • right。靠右
  • top。靠顶部
  • bottom。靠底部
  • center。居中
  • center_vertical。垂直居中
  • center_horizontal。水平居中
支持两种设置方式，1.在template中直接设置；2.使用函数动态设置。 
<template>
    <linear>
        <text id="demo" width="matchParent" text="hello" gravity="right"/>
    </linear>
</template>

function main() {
    setupUI();
}

function onUIResume() {
    ui('demo').setGravity('left|top');
}

属性-color

设置文本字体颜色。 支持两种设置方式，1.在template中直接设置；2.使用函数动态设置。 
                    <template>
    <text id="demo" color="red"/>
</template>
function main() {
    setupUI();
}

function onUIResume() {
    ui('demo').setColor('#44332211');
}

属性-lines

设置文本控件的行数。即使文本内容没有达到设置的行数，控件也会留出相应的宽度来显示空白行；如果文本内容超出了设置的行数，则超出的部分不会显示。 <template> <text id="demo" lines="1"/> </template>

属性-maxLines

设置文本框最大显示几行。 <template> <text id="demo" maxLines="3"/> </template>

属性-style

设置字体的样式，比如斜体、粗体等。可选的值为：
  • bold 加粗字体
  • italic 斜体
  • normal 正常字体
可以用或("|")把他们组合起来，比如粗斜体为"bold|italic"。 <template> <linear> <text id="demo" style="bold|italic" text="hello"/> </linear> </template>

属性-ellipsize

设置文本的省略号位置。文本的省略号会在文本内容超出文本控件时显示。可选的值为：
  • end。在文本末尾显示省略号
  • marquee。跑马灯效果，文本将滚动显示
  • middle。在文本中间显示省略号
  • none。不显示省略号
  • start。在文本开头显示省略号
<template> <linear> <text id="demo" text="hello" ellipsize="middle"/> </linear> </template>

函数-setSize

设置文本大小，返回Node。
参数：
参数名 类型 必填 说明
size integer 必填 文字大小 
<template>
    <linear>
        <text id="demo" text="hello" ellipsize="middle"/>
    </linear>
</template>

function main() {
    setupUI();
}

function onUIResume() {
   ui('demo').setSize(20);
}

函数-setColor

设置文本颜色，返回Node。
参数：
参数名 类型 必填 说明
color string 必填 文字颜色 
<template>
    <linear>
        <text id="demo" text="hello" ellipsize="middle"/>
    </linear>
</template>

function main() {
    setupUI();
}

function onUIResume() {
   ui('demo').setColor('#ff0000');
}

函数-setGravity

设置对其方式，返回Node。
参数：
参数名 类型 必填 说明
gravity string 必填 对其方式,点击查看详情 
<template>
    <linear>
        <text id="demo" text="hello" ellipsize="middle"/>
    </linear>
</template>

function main() {
    setupUI();
}

function onUIResume() {
   ui('demo').setGravity('left|top');
}

函数-setText

设置文本，返回Node。
参数：
参数名 类型 必填 说明
text string 必填 文本 
<template>
    <linear>
        <text id="demo" text="hello" ellipsize="middle"/>
    </linear>
</template>

function main() {
    setupUI();
}

function onUIResume() {
   ui('demo').setText('hello');
}

函数-getText

获取文本，返回string。
参数：
参数名 类型 必填 说明 
<template>
    <linear>
        <text id="demo" text="hello" ellipsize="middle"/>
    </linear>
</template>

function main() {
    setupUI();
}

function onUIResume() {
   var text = ui('demo').getText();
   console.log('text:' + text);
}

函数-value

获取/设置文本，返回string。
参数：
参数名 类型 必填 说明
text string 选填 文本，若不填则表示返回文本，填写表示设置文本 
<template>
    <linear>
        <text id="demo" text="hello" ellipsize="middle"/>
    </linear>
</template>

function main() {
    setupUI();
}

function onUIResume() {
   // 获取文本
   var text = ui('demo').value();
   console.log('获取text:' + text);

    // 设置文本
    ui('demo').value('hello');
}