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

  • Post author:
  • Post category:其他




申明本人使用的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

光看不敲是没用的

看后一定要去实践

一定要去敲代码

一定要去运行试错

这样才是有意义的学习



版权声明:本文为piyangbo原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。