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

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
热搜: 活动 交友 discuz
查看: 257|回复: 6

[源码] TAB条与布局元素结合实现选择夹功能

[复制链接]

58

主题

112

回帖

715

积分

版主

积分
715
发表于 2024-11-22 16:39:30 | 显示全部楼层 |阅读模式
本帖最后由 hxznhf 于 2024-11-22 16:40 编辑

炫语言的UI设计更趋向于WebUI的逻辑,和易语言的传统UI区别有点大,但是大家也不要慌,不要因为感觉很复杂就马上想到放弃了,虽然易语言的选择夹很简单,但是当我们需要自定义的时候,往往就各种限制,而炫彩UI就不一样,界面上很多复杂组件都是通过基础元素组合而已,你可以通过命令接口任意的控制每个元素的绘制样式,实现各种酷炫的界面(当然如果你说我就喜欢老旧简单的界面,那我也没办法了)。


现在教大家如何咋实现一个选择夹:


这是最终实现的效果,夹头是 TAB条元素 ,提供添加删除标签元素(实际是按钮,包括标签上的叉叉)


夹头和页面是独立的,页面是通过布局元素实现,然后标签关联布局元素,实现不同页面的切换,具体看下图的文档大纲:


TAB条负责夹头,同级的布局元素为选择夹页面容器,然后布局元素内又添加了4个布局元素,每一个代表一个页面,每个页面里面我放了一个按钮。


每个页面布局元素的布局宽度和高度为填充父元素,因此上面效果图中我们只能看到第一个页面布局元素,它一个人就占满了。


那我们咋修改后面看不见的页面内容呢?不用担心,只需要点击元素名称旁边的小眼睛,把不需要显示的页面都隐藏,只保留需要编辑的就行了。


下面我看代码部分:
首先给TAB条添加4个标签,然后除了第一个页面,另外三个都设置为 显示(假),同时给TAB条的标签按钮绑定关联的页面元素,然后设置TAB条默认选中第一个标签


继续实现添加和删除功能:

在TAB条的项删除事件下面标签对应的布局元素进行销毁


添加功能则需要通过代码创建一个布局元素来绑定新标签


我这里给出的例子都是元素的默认样式效果,可能不怎么酷炫,主要是教新手怎么实现。如果你不需要动态添加删除功能,上面大部分代码都不需要。而且在设计器其中即使不用TAB条,你也可以使用按钮元素的绑定元素功能来模拟各式各样的页面切换效果。


附件:






本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

×

34

主题

154

回帖

842

积分

高级会员

积分
842
发表于 2024-11-22 22:21:57 | 显示全部楼层
谢谢分享

4

主题

21

回帖

124

积分

注册会员

积分
124
发表于 2024-11-23 09:07:57 | 显示全部楼层
感谢大老分享

0

主题

74

回帖

598

积分

高级会员

积分
598
发表于 2024-11-23 18:05:59 | 显示全部楼层
感谢分享

2

主题

24

回帖

256

积分

中级会员

积分
256
发表于 2024-11-24 21:46:18 来自手机 | 显示全部楼层
找了好久的选择夹原来在这里

11

主题

17

回帖

151

积分

注册会员

积分
151
QQ
发表于 2024-11-27 22:54:16 | 显示全部楼层
一直不知道怎么设置绑定元素,我都是用按钮和布局手动的

1

主题

15

回帖

65

积分

注册会员

积分
65
发表于 2024-11-28 16:05:43 | 显示全部楼层
先下为快
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|手机版|小黑屋|炫语言 | 炫彩界面库 | 用户所需, 正是我所做! ( 鄂ICP备2023014763号-1 )

GMT+8, 2025-1-13 13:58 , Processed in 0.072614 second(s), 20 queries .

Powered by Discuz! X3.5

© 2001-2024 Discuz! Team.

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