之前的帖子里已经详细说了弹窗和气泡确认框是如何实现的,今天再补充一种用于移动端的抽屉信息框。它多用于一些轻量和低频率的交互,比如用户需要提交一些信息却又不会频繁使用这部分功能,这种情况下去跳转页面会使操作流程更加繁琐,我们就可以制作一个抽屉信息框。平时抽屉信息框是隐藏的,可以节省主页面的空间展示更加重要的内容,当需要进行操作时就让抽屉从屏幕侧面滑出,在抽屉信息框中操作完成后再将其重新隐藏。

1.组件结构
布局上则可以分为三个部分,列1 ,背景对象组和抽屉表单对象组。列1是案例的主页内容,这里只是放置了一个按钮用于显示抽屉信息框,抽屉表单中上方是三个输入项,底部是两个操作按钮,同时对象组内还有一个轨迹组件,关于它我们在第二点再详细介绍。背景对象组只是做一个蒙层的效果,所以宽高都绑定了两个变量,使对象组能铺满整个屏幕。


案例中两个变量的作用是在初始化或者设备宽高变化时获取设备的实时宽高,然后去设置列1的宽高使之占满整个屏幕。

2.轨迹
首先选中抽屉表单对象组,添加一个轨迹组件。顾名思义,轨迹指的是一个运动的过程,添加在抽屉表单对象组下的轨迹控制的自然就是抽屉表单这个对象组运动的过程。
使用ivx制作移动端抽屉信息框的经验总结
最新推荐文章于 2025-08-21 15:52:12 发布

最低0.47元/天 解锁文章
729

被折叠的 条评论
为什么被折叠?



