Auto.js学习笔记5:autojs的UI界面基础篇1

申明本人使用的autojs是4.1.1版本

目录

UI定义

控件通用基础属性

w:

h:

id:

gravity:

layout_gravity:

margin:

padding:

bg:

visibility:

rotation:

marginTop:

文本控件:text

text:

textColor:

textStyle:

lines:

textSize:

maxLines:

ellipsize:

autoLink:

ems:

界面UI例子

结语


UI定义

带有ui的脚本的的最前面必须使用"ui";指定ui模式,否则脚本将不会以ui模式运行。

"ui";
ui.layout(
    <horizontal>
        <button text="第一个按钮"/>
        <button text="第二个按钮"/>
    </horizontal>
);

控件通用基础属性

w:

        View的宽度,是属性width的缩写形式。可以设置的值为*, auto和具体数值。其中*表示宽度尽量填满父布局,而auto表示宽度将根据View的内容自动调整(自适应宽度)。

h:

View的高度,是属性height的缩写形式。可以设置的值为*auto和具体数值。其中*表示宽度尽量填满父布局,而auto表示宽度将根据View的内容自动调整(自适应宽度)。

如果不设置该属性,则不同的控件和布局有不同的默认高度,大多数为auto

id:

View的id,用来区分一个界面下的不同控件和布局,一个界面的id在同一个界面下通常是唯一的,也就是一般不存在两个View有相同的id。id属性也是连接xml布局和JavaScript代码的桥梁,在代码中可以通过一个View的id来获取到这个View,并对他进行操作(设置点击动作、设置属性、获取属性等)。

gravity:

View的"重力"。用于决定View的内容相对于View的位置,可以设置的值为:

  • left 靠左
  • right 靠右
  • top 靠顶部
  • bottom 靠底部
  • center 居中
  • center_vertical 垂直居中
  • center_horizontal 水平居中

layout_gravity:

View在布局中的"重力",用于决定View本身在他的父布局的位置,可以设置的值和gravity属性相同。注意把这个属性和gravity属性区分开来。

margin:

margin为View和其他View的间距,即外边距。margin属性包括四个值:

  • marginLeft 左外边距
  • marginRight 右外边距
  • marginTop 上外边距
  • marginBottom 下外边距

padding:

View和他的自身内容的间距,也就是内边距。注意和margin属性区分开来,margin属性是View之间的间距,而padding是View和他自身内容的间距。举个例子,一个文本控件的padding也即文本控件的边缘和他的文本内容的间距,paddingLeft即文本控件的左边和他的文本内容的间距。

bg:

View的背景。其值可以是一个链接或路径指向的图片,或者RGB格式的颜色,或者其他背景。

visibility:

View的可见性,该属性可以决定View是否显示出来。其值可以为:

  • gone 不可见。
  • visible 可见。默认情况下View都是可见的。
  • invisible 不可见,但仍然占用位置。

rotation:

View的旋转角度。通过该属性可以让这个View顺时针旋转一定的角度。例如rotation="90"可以让他顺时针旋转90度。

marginTop:

View的上外边距。如果该属性和margin属性指定的值冲突,则在后面的属性生效,前面的属性无效。

文本控件:text

文本控件用于显示文本,可以控制文本的字体大小,字体颜色,字体等。

text:

文本控件用于显示文本,可以控制文本的字体大小,字体颜色,字体等。

设置文本的内容。例如text="测试内容"

textColor:

设置字体的颜色,可以是RGB格式的颜色(例如#ff00ff),或者颜色名称(例如red, green等)。

示例, 红色字体:<text text="红色字体" textColor="red"/>

textStyle:

设置字体的样式,比如斜体、粗体等。可选的值为:

  • bold 加粗字体
  • italic 斜体
  • normal 正常字体

可以用或("|")把他们组合起来,比如粗斜体为"bold|italic"。

lines:

设置文本控件的行数。即使文本内容没有达到设置的行数,控件也会留出相应的宽度来显示空白行;如果文本内容超出了设置的行数,则超出的部分不会显示。

textSize:

设置字体的大小,单位一般是sp。按照Material Design的规范,正文字体大小为14sp,标题字体大小为18sp,次标题为16sp。

maxLines:

设置文本控件的最大行数。

ellipsize:

设置文本的省略号位置。文本的省略号会在文本内容超出文本控件时显示。可选的值为:

  • end 在文本末尾显示省略号
  • marquee 跑马灯效果,文本将滚动显示
  • middle 在文本中间显示省略号
  • none 不显示省略号
  • start 在文本开头显示省略号

autoLink:

控制是否自动找到url和电子邮件地址等链接,并转换为可点击的链接。默认值为“none”。

设置该值可以让文本中的链接、电话等变成可点击状态。

可选的值为以下的值以其通过或("|")的组合:

  • all 匹配所有连接、邮件、地址、电话
  • email 匹配电子邮件地址
  • map 匹配地图地址
  • none 不匹配 (默认)
  • phone 匹配电话号码
  • web 匹配URL地址

ems:

当设置该属性后,TextView显示的字符长度(单位是em),超出的部分将不显示,或者根据ellipsize属性的设置显示省略号。

界面UI例子

"ui";
ui.layout(
    <relative w = "*" h = "*">
     <vertical w = "*" h = "auto" gravity = "center" layout_centerInParent="true">
                <text id = "textTitleHintTxt" textStyle = "bold" padding="15 10 15 10" 
                marginBottom = '5' bg = "#34b1e7" textColor = "black" textSize="26sp">欢迎使用</text>
              <text id = "textHintTxt" textStyle = "italic" marginTop = '10dp' padding="3 1 3 1" bg = "#34b1e7" textColor = "black" textSize="16sp">描述</text>
      <vertical >

           <input id = "countIt" digit="1234567890" singleLine = "true" hint="输入过期天次数" ></input> 

            <text id = "bottmHintTxt" w = "*" text = "重要提示语句:无" gravity = "center" marginBottom = "15" layout_alignParentBottom="true" textStyle = "bold" padding="0 10 15 0"  textColor = "black"/>

    </relative>
);

结语

学过Android原生开发的会很快适应autojs的ui界面开发,没太大难度,根据文档编写即可,后面一些控件文档并未详细描述,可以查看Auto.js学习笔记14:autojs的UI界面基础篇2

光看不敲是没用的
看后一定要去实践
一定要去敲代码
一定要去运行试错
这样才是有意义的学习

猜你喜欢

转载自blog.csdn.net/piyangbo/article/details/124922844