自动化助手

    下拉框

    • 更新时间:2026-06-15 07:53:03

    下拉框-drop

    布局原生类型:{com.google.android.material.textfield.TextInputLayout} 组件原生类型:{com.google.android.material.textfield.MaterialAutoCompleteTextView}

    下拉框类似于一个小菜单，点一下才会展开让你选，核心用途就是帮你方便、规范地挑东西。

    一、基础用法

    <ui>
    <statusbar />
    <linear w="max" padding="15" gravity="center" h="max">
        <drop id="mDrop" w="max">
            <!-- 添加选项 -->
            <item text="吃饭" />
            <item text="睡觉" />
            <item text="电影" />
        </drop>
    </linear>
</ui>
    //解析布局
let ui = $ui.layout("ui.xml");
ui.show();//显示界面
//为下拉框添加选中事件
ui.id("mDrop").onCheck((value, index) => {
    info("选中下标为:" + index + "的元素:" + value);
});

    二、常用属性

    项目 - 子选项

    设置子选项

    子选项使用项目标签，只有文本一个属性

    <界面>
    <状态条 />
    <下拉框 宽="最大">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    风格 - 样式

    设置样式

    可选:填充,边框(或轮廓)

    <界面>
    <状态条 />
    <下拉框 宽="最大" 风格="边框">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    主题颜色 - 主题颜色

    设置主题颜色

    <界面>
    <状态条 />
    <下拉框 主题颜色="#F44236" 宽="最大" 提示="你的爱好" 风格="边框" 默认="睡觉">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    提示 - 提示文字

    设置提示文字

    <界面>
    <状态条 />
    <下拉框 宽="最大" 提示="你的爱好" 风格="边框">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    提示颜色 - 提示颜色

    设置提示颜色

    <界面>
    <状态条 />
    <下拉框 宽="最大" 提示="你的爱好" 提示颜色="#C94F4F" 文本="吃饭" 风格="边框">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    默认 - 默认文字

    设置默认文字

    <界面>
    <状态条 />
    <下拉框 宽="最大" 提示="你的爱好" 风格="边框" 默认="睡觉">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    文本 - 文本

    设置文本

    <界面>
    <状态条 />
    <下拉框 宽="最大" 提示="你的爱好" 文本="睡觉" 风格="边框">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    文本颜色 - 文字的颜色

    设置文字的颜色

    <界面>
    <状态条 />
    <下拉框 宽="最大" 提示="你的爱好" 文本颜色="#F44236" 风格="边框" 默认="睡觉">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    文本尺寸 - 文本尺寸

    设置文本尺寸

    单位:dp

    <界面>
    <状态条 />
    <下拉框 宽="最大" 文本尺寸="18" 风格="边框" 默认="睡觉">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
    <下拉框 宽="最大" 文本尺寸="25" 风格="边框" 默认="睡觉">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    前缀 - 前缀

    设置前缀

    <界面>
    <状态条 />
    <下拉框 前缀="邮箱：" 宽="最大" 文本="123456789@qq.com" 文本尺寸="18">
        <选项 文本="123456789@qq.com" />
        <选项 文本="222333555@qq.com" />
    </下拉框>
</界面>

    前缀颜色 - 前缀颜色

    设置前缀颜色

    <界面>
    <状态条 />
    <下拉框 前缀="邮箱：" 前缀颜色="#C94F4F" 宽="最大" 文本="123456789@qq.com"
        文本尺寸="18">
        <选项 文本="123456789@qq.com" />
        <选项 文本="222333555@qq.com" />
    </下拉框>
</界面>

    后缀 - 后缀

    设置后缀

    <界面>
    <状态条 />
    <下拉框 前缀="邮箱：" 后缀="@qq.com" 宽="最大" 文本="123456789" 文本尺寸="18">
        <选项 文本="123456789" />
        <选项 文本="222333555" />
    </下拉框>
</界面>

    后缀颜色 - 后缀颜色

    设置后缀颜色

    <界面>
    <状态条 />
    <下拉框 前缀="邮箱：" 后缀="@qq.com" 后缀颜色="#C94F4F" 宽="最大" 文本="123456789"
        文本尺寸="18">
        <选项 文本="123456789" />
        <选项 文本="222333555" />
    </下拉框>
</界面>

    隐藏图标 - 是否隐藏后面的倒三角图标

    是否隐藏后面的倒三角图标

    <界面>
    <状态条 />
    <下拉框 宽="最大" 隐藏图标="是" 风格="边框">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    重力 - 布局重力

    设置布局重力

    <界面>
    <状态条 />
    <下拉框 宽="最大" 重力="开始" 风格="边框" 默认="吃饭">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
    <下拉框 宽="最大" 重力="中间" 风格="边框" 默认="吃饭">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
    <下拉框 宽="最大" 重力="结束" 风格="边框" 默认="吃饭">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    内边距 - 布局内边距

    设置布局内边距

    单位:dp

    <界面>
    <状态条 />
    <下拉框 宽="最大" 内边距="10" 风格="边框" 默认="吃饭">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
    <下拉框 宽="最大" 内边距="20" 风格="边框" 默认="吃饭">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    背景颜色 - 背景颜色

    设置背景颜色

    <界面>
    <状态条 />
    <下拉框 宽="最大" 背景颜色="#57965C" 风格="边框" 默认="吃饭">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    背景图片 - 背景图片

    设置背景图片

    <界面>
    <状态条 />
    <下拉框 宽="最大" 背景图片="example/$ui - 交互界面/05.drop-下拉框/img/img.png" 风格="边框" 默认="吃饭">
        <选项 文本="吃饭" />
        <选项 文本="睡觉" />
    </下拉框>
</界面>

    存储关键字 - 应用内存储

    应用内存储

    通过storeKey(存储关键字)指定一个存储字符串的关键字，获取值时可以直接通过$storage($存储)获取字符串。

    注意：不同的控件存储的类型不同，对于本控件(输入框)则存储的是字符串类型，表达当前选中的内容

    <!-- 你必须在ui(界面)节点中通过store(存储)指定$storage($存储)的命名空间，等价于使用代码：let storage = $storage.create("MyDrop"); -->
<界面 存储="MyDrop">
    <状态栏 />
    <!-- 使用storeKey(存储关键字)属性，指定关键字，等价于使用代码：let data = $storage.create("MyDrop").getStr("文本"); -->
    <!-- 使用storeDef(存储默认值)属性，指定关键字，等价于使用代码：let data = $storage.create("MyDrop").getStr("文本","吃饭"); -->
    <下拉框 存储关键字="文本" 存储默认值="吃饭">
        <选项 文本="吃饭"/>
        <选项 文本="睡觉"/>
        <选项 文本="游戏"/>
    </下拉框>
</界面>

    如果我们已经配置好了应用内存储，则可以直接获取数据：

    注意：一、要使用应用内存储，必须在ui(界面)节点指定属性store(存储)的值，该值指定存储的命名空间； 二、不是所有的控件都支持应用内存储； 三、不同的控件存储的数据类型可能都不一致，例如：输入类型的控件存储的是字符串类型，开关、多选框存储的就是布尔类型的数据。

    //创建(或者加载)存储对象
let storage = $storage.create("MyDrop");//名称要一致
//获取数据
let data = storage.getStr("文本","吃饭");//数据类型是字符串

    三、常用函数

    监听选中(回调)

    事件监听

    • 参数 : 回调 {(标题,下标)=>{}} 回调函数
    //解析布局,获得界面对象
定义 界面 = $界面.解析布局("./主界面.xml");
//获取控件
定义 下拉框 = 界面.找控件("我的下拉框");
//监听选中事件
下拉框.监听选中((标题,下标)=>{
    土司(标题);
});

    设置文字(文本)

    设置文字

    • 参数 : 文本 {string} 文字
    //解析布局,获得界面对象
定义 界面 = $界面.解析布局("./主界面.xml");
//获取控件
定义 下拉框 = 界面.找控件("我的下拉框");
//设置文字
下拉框.设置文字("选项1");
//注意:'设置文字()'函数也可以写成'设置文本()'函数

    获取文字()

    获得文字

    • 返回 : {string} 文字
    //解析布局,获得界面对象
定义 界面 = $界面.解析布局("./主界面.xml");
//获取控件
定义 下拉框 = 界面.找控件("我的下拉框");
//获取文本
定义 文本 = 下拉框.获取文字();
//注意:'获得文字()'函数也可以写成'获得文本()'函数

    刷新(数据)

    刷新数据

    • 参数 : 数据 {string[]} 数据集合
    //解析布局,获得界面对象
定义 界面 = $界面.解析布局("./主界面.xml");
//获取控件
定义 下拉框 = 界面.找控件("我的下拉框");
//刷新数据
下拉框.刷新(["张三","李四","王五"]);

    获取下标()

    获取选中下标

    • 返回 : 下标 {数字} 用户当前选中的下标(-1表示没有选中)
    • 版本 : 1.9.6
    //解析布局,获得界面对象
定义 界面 = $界面.解析布局("./主界面.xml");
//获取控件
定义 下拉框 = 界面.找控件("我的下拉框");
//刷新数据
下拉框.刷新(["张三","李四","王五"]);
//获取用户当前选中的下标(-1表示没有选中)
定义 下标 = 下拉框.获取下标();

    设置下标(下标)

    设置下标

    • 参数 : 下标 {数字} 需要设置的下标
    • 版本 : 1.9.6
    //解析布局,获得界面对象
定义 界面 = $界面.解析布局("./主界面.xml");
//获取控件
定义 下拉框 = 界面.找控件("我的下拉框");
//刷新数据
下拉框.刷新(["张三","李四","王五"]);
//设置下表 1 表示设置第二个元素
下拉框.设置下标(1);