请选择 进入手机版 | 继续访问电脑版

XXTouch 论坛

 找回密码
 立即注册
搜索
查看: 340|回复: 19

[模块分享] 让 XXT 拥有控件和事件!轻松打造自己的UI 2-7更新

[复制链接]

3

主题

8

帖子

915

积分

老码

Rank: 4

积分
915
发表于 2018-2-6 17:42:44 | 显示全部楼层 |阅读模式
本帖最后由 86088780@qq.com 于 2018-2-7 13:06 编辑

如果要用xxt做UI,就必须使用webview函数,但是又要求必须懂html编程语言,想做一个UI出来或者只是简单做个按钮在屏幕上,都要很长的代码,还需要自己写while来响应传回的值。所以市面上绝大部分脚本都是运行途中没任何可以交互的办法。我在接触xxt之前,一直是做桌面开发的,可视化的编程是桌面级应用程序的主流,而且我对网页编程语言一直是苦手,使用xxt以后莫大的改变和约束我之前的开发逻辑和习惯,两种语言各有所长吧,所以我在想能不能将它们融合起来。
为此我做了一个模块出来,让大家可以简单一行代码就能弄出按钮等控件,而且还为它们封装触发事件的方法,免去大家while词典等繁琐事情,不是简单的控件哦,大家还能随意修改它的属性,让它变成各种样式!
无需懂HTML代码!
首先请看以下简单演示:
Cache_6831acbd4fe0ceef..jpg

来个复杂演示:(附件会有这个示例源码下载,还是能用的哦)
QQ截图20180206173207.jpg

制作一个按钮,我只需代码:
require('luaocx')  --调用插件,必须放在代码开头
button('我是按钮')

销毁函数是:killocx(控件名)
销毁它:
killocx('我是按钮')

并且更方便的地方是,这个按钮按了以后怎么响应呢?你只需这么写:
function 我是按钮_click()   
     ....(按钮按了以后做什么的代码)

end

完整代码示例:
require('luaocx')
button('按钮')
function 按钮_click()
    sys.alert('hello world')
end
以上代码就是在屏幕上生成一个按钮,当点按它时,弹出对话框:hello world
无需你懂网页代码,轻松在xxt搞定!



样式使用说明:
代码示例:
require('luaocx')
button('按钮',{x=100,y=100})
以上代码表示:在屏幕横坐标100,纵坐标100的位置生成一个按钮。

控件们都拥有丰富的属性可以调整
QQ截图20180206170646.jpg
我已经为大家将文档集成在插件里了,插件文档使用标准是:不带任何参数调用函数。插件文档这么用:
文档内容=luaocx()
你可以随时打印,如:
nLog(luaocx())
你会看到
[ip:192.168.0.2]:启动成功{ -- table: 0x1635fa90
        ["picturebox(控件名[,{属性}])"] = "图片控件。声明 控件名:字符型,必须唯一。属性:表型,可设置控件各项样式",
        ["textbox(控件名[,{属性}])"] = "文本输入框控件。声明 控件名:字符型,必须唯一。属性:表型,可设置控件各项样式",
        ["button(控件名[,{属性}])"] = "按钮控件。声明 控件名:字符型,必须唯一。属性:表型,可设置控件各项样式",
}


这样你会看到插件拥有什么控件了,想查对应控件的文档,直接输入函数
nLog(button())
QQ截图20180206171555.jpg

随时查,无需联网也能查文档~

总结:
    打印控件列表与声明:nLog(luaocx())
        打印按钮文档:nLog(button())
        打印文本输入框文档:nLog(textbox())
        打印图片框文档:nLog(picturebox())

一个完整使用按钮控件所有属性的示例:
require('luaocx')

button('btn1',{  --控件名命名为btn1
                x=100,  --横坐标100
                y=100,  --纵坐标100
                height=100,  --高度100
                white=300,  --宽度300
                caption='确定',  --按钮文字:确定
                backcolor='#2873c2',  --按钮浅蓝色底
                fontcolor='#ffffff',  --按钮白色字体
                border=0,  --无边框
                radius=2,  --2px的圆角
                fontsize=20,  --字体大小20px
                alpha=0.8,  --80%不透明
                font='Helvetica-Bold'  --字体为Helvetica-Bold
        })

function btn1_click()  --按下按钮结束程序
        os.exit()
end




属性返回
a=button('btn1','x') --获取按钮“btn1”的横坐标
就这么简单,直接输入它的属性名字就可以了

代码示例:
require('luaocx')
textbox('文本框1',{text=‘你好’})
textbox('文本框2',{text=‘再见’})
sys.alert(textbox('文本框1',"text"))
sys.alert(textbox('文本框2',"text"))

完整获取属性示例:
require('luaocx')

local ocxname='btn1'

button(ocxname)

sys.alert('控件名:'..ocxname..'\n'..
        '横坐标是:'..button(ocxname,'x')..'\n'..
        '纵坐标是:'..button(ocxname,'y')..'\n'..
        '高度是:'..button(ocxname,'height')..'\n'..
        '宽度是:'..button(ocxname,'width')..'\n'..
        '文字内容是:'..button(ocxname,'caption')..'\n'..
        '背景色是:'..button(ocxname,'backcolor')..'\n'..
        '字体颜色是:'..button(ocxname,'fontcolor')..'\n'..
        '边框状态:'..button(ocxname,'border')..'\n'..
        '圆角大小:'..button(ocxname,'radius')..'\n'..
        '字体大小:'..button(ocxname,'fontsize')..'\n'..
        '不透明度:'..button(ocxname,'alpha')..'\n'..
        '使用的字体:'..button(ocxname,'font')
        )

function btn1_click()  --按下按钮结束程序
        os.exit()
end
这个控件模块我命名为 Luaocx(Lua的ocx控件),现在的是尝鲜版,因为只有三个控件,但是它们应对一般的脚本已经足够了!未来我还会继续添加其他的控件,毕竟每个控件还是需要由大量代码支撑的,敬请期待

02-07更新:
修正几处文档错误
修正一些bug
增加销毁控件函数


注意:当你require控件后,你的脚本会变成运行完代码也不会结束,必须用结束脚本的方法如:os.exit(),手动按停止脚本热键等。优缺点?缺点是代码运行到最后想结束的话自己手动加个os.exit()呗,优点嘛,你的脚本成为了“真正”的程序,不会因代码结束而结束,而是能一直驻留着。

如果大家对此模块有什么好提议或需求,请留言,如果我觉得合理,会继续加进去~
使用方法:先将luaocx.xxt放到/private/var/mobile/Media/1ferver/lua文件夹,然后即可在自己的脚本上调用
游客,如果您要查看本帖隐藏内容请回复






回复

使用道具 举报

48

主题

100

帖子

947

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
947
发表于 2018-2-6 17:44:12 | 显示全部楼层
牛逼牛逼~~~回复可见
回复

使用道具 举报

0

主题

14

帖子

74

积分

小码

Rank: 2

积分
74
发表于 2018-2-6 18:13:05 | 显示全部楼层

牛逼牛逼~~~回复可见
回复

使用道具 举报

0

主题

13

帖子

38

积分

光头

Rank: 1

积分
38
发表于 2018-2-6 23:17:28 | 显示全部楼层
这论坛厉害的大神真多
·
回复

使用道具 举报

0

主题

12

帖子

97

积分

小码

Rank: 2

积分
97
发表于 2018-2-7 01:31:12 | 显示全部楼层
顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶顶
回复

使用道具 举报

0

主题

5

帖子

62

积分

小码

Rank: 2

积分
62
发表于 2018-2-7 09:28:02 | 显示全部楼层
佩服5连
回复

使用道具 举报

0

主题

3

帖子

12

积分

光头

Rank: 1

积分
12
发表于 2018-2-7 10:14:37 | 显示全部楼层
牛逼牛逼~~~回复可见
回复

使用道具 举报

0

主题

9

帖子

64

积分

小码

Rank: 2

积分
64
发表于 2018-2-7 13:00:35 | 显示全部楼层
真的牛逼,但是我更加想知道是怎样实现的。。哈哈
回复

使用道具 举报

3

主题

8

帖子

915

积分

老码

Rank: 4

积分
915
 楼主| 发表于 2018-2-7 13:02:35 | 显示全部楼层
hkbaobao 发表于 2018-2-7 13:00
真的牛逼,但是我更加想知道是怎样实现的。。哈哈

就是我替大家封装好了webview和事件,每个控件都是一个webview,里面由html代码组成
回复

使用道具 举报

0

主题

9

帖子

132

积分

小码

Rank: 2

积分
132
发表于 2018-2-7 17:58:45 | 显示全部楼层
你指的拥有
回复

使用道具 举报

0

主题

8

帖子

104

积分

小码

Rank: 2

积分
104
发表于 2018-2-8 04:12:00 | 显示全部楼层
牛逼牛逼~~~回复可见
回复

使用道具 举报

0

主题

4

帖子

58

积分

小码

Rank: 2

积分
58
发表于 2018-2-9 11:31:51 | 显示全部楼层
...............
回复

使用道具 举报

0

主题

12

帖子

70

积分

小码

Rank: 2

积分
70
发表于 2018-2-9 11:34:59 | 显示全部楼层
如果您要查看本帖隐藏内容请
回复

使用道具 举报

0

主题

1

帖子

6

积分

光头

Rank: 1

积分
6
发表于 2018-2-10 18:31:51 | 显示全部楼层
这玩意挺厉害的呢
回复

使用道具 举报

0

主题

9

帖子

60

积分

小码

Rank: 2

积分
60
发表于 2018-2-11 10:06:18 | 显示全部楼层
6666666666
回复

使用道具 举报

0

主题

6

帖子

24

积分

光头

Rank: 1

积分
24
发表于 2018-2-11 15:28:55 | 显示全部楼层
牛逼牛逼~~~牛逼牛逼~~~牛逼牛逼~~~
回复

使用道具 举报

0

主题

8

帖子

60

积分

小码

Rank: 2

积分
60
发表于 2018-2-13 13:20:15 | 显示全部楼层
qwddasdasdasdasd
回复

使用道具 举报

0

主题

10

帖子

100

积分

小码

Rank: 2

积分
100
发表于 2018-2-14 09:41:35 | 显示全部楼层
这个强大了,按钮可以方便实现了
回复

使用道具 举报

0

主题

10

帖子

54

积分

小码

Rank: 2

积分
54
发表于 6 天前 | 显示全部楼层
厉害!!!!!!!!!!!!
回复

使用道具 举报

0

主题

9

帖子

50

积分

小码

Rank: 2

积分
50
发表于 昨天 21:32 | 显示全部楼层
66666666666666666666
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|关于我们|XXTouch Inc. ( 湘ICP备15002722号-2 )

GMT+8, 2018-2-23 10:47

Powered by Discuz! X3.4

© 2001-2017 Comsenz Inc.

快速回复 返回顶部 返回列表