IVX使用 | 如何不开发代码实现网页界面?

本文介绍了IVX这款无代码开发平台,用户可以通过拖拽组件来构建前端界面,无需编程知识。文章详细讲解了如何使用图片、布局调整、新建页面、事件对象、文本、按钮、导航菜单和搜索等组件,并提供了简单的操作步骤,适合初学者快速上手。
摘要由CSDN通过智能技术生成

目录

一、IVX简介

是什么?

登录网址

准备工作

二、组件介绍

1.图片组件

 2.布局大小调整

3.新建页面

4.事件对象

5.添加文本

6.添加按钮

7.添加导航菜单

8.添加搜索


        前一阵和其他伙伴一起参加了一个创新创业比赛,用到了前端界面功能展示的模块,因此简单学习了ivx,发现非常的方便高效且易上手,只需通过扫描上传界面的二维码即可访问界面。现分享简易版使用指南。

一、IVX简介

是什么?

        是一款 无需代码、仅仅使用拖拽即可开发平台。从逻辑上讲和写代码开发一样,但是是可视化的可见即所得的状态,不需要代码开发。

登录网址

https://www.ivx.cn/

准备工作

1.下载谷歌浏览器

浏览器内搜索【谷歌浏览器】进行下载

2.账号注册和登录

        在网页右上角处进行登录/注册,进入后输入对应信息即可。

·个人账号还是企业账号?

        企业账号增添了各个账号之间的交互的一些功能,初学者/小型企业个人账号即可。

3.工作台的使用

基础界面功能展示:

点击【标签管理】

二、组件介绍

工作台界面分辨率都可以自行设置,现以PC端为例:

1.图片组件

添加图片的话需要实名认证

点击下图的“图片”插件对图片进行添加,

 也可选中页面直接将文件夹内多个图片拖动到页面内

·选中页面内的图片,也可以对宽度和高度调整其大小

·上下边距的排版指的是在整个页面内距离页面边框的距离

 

 2.布局大小调整

按下【空格键】会变成小手可拖动前台进行移动。

或者在页面右上角点击这两处进行调整布局大小

3.新建页面

左侧新建页面

设置当前页面属性:

4.事件对象

通过拖动每个界面或对象,实现不同优先级,从下往上优先级递增,也可以对界面进行隐藏。

5.添加文本

如下,实现了一个简单界面的文字添加

6.添加按钮

添加按钮后,可以对按钮中文字进行点击,就会出现如下所示形式,然后可以添加切换界面实现点击后对界面的跳转。

7.添加导航菜单

下拉菜单的成果图可以设置为如下形式:

8.添加搜索

 设置参数,对界面预览结果如下:


        上述是笔者在设计界面时用到的比较多的组件,实现网页也就是把功能预设好,先构思再上手做,在界面内添加组件然后实现组件与界面两者之间的跳转。

概括来讲,操作就是:

  1. 通过提供的组件构建对象
  2. 添加逻辑
Muse界面你可能是一名出色的网页设计师,但如果你不会代码的话,设计好的网页还要请别人去制作。Adobe打算帮你解决这个问题。 Adobe刚刚发布了一个代号为“Muse{缪斯}”网站开发工具。Muse基于AIR平台,其目的是让设计师把精力放在设计上,让那些不懂代码的设计师也可以制作、发布网站。 Muse主要包括四大功能: 网站规划:Muse提供网站地图、主页面、以及覆盖整个网站的工具,你可以很快完成网站规划,为设计做好准备。 设计:让设计师专注于设计而不是工具。精确控制图片、文本、曲线等元素。用户可以使用和Photoshop或Fireworks相仿的内置工具设计网页,实际上你可以导入整个PSD文件在Muse中编辑。Muse让用户简便的整合网页内容。用户可以在设计中自由拖拽内容的位置,也可以点击‘添加HTML’直接添加视频、地图或者任何网页内容。Muse还内置了数量庞大的交互小工具,可以直接使用。 互动性:支持嵌入Google地图,Facebook feed等元素,结合内置工具可提高网站互动性。支持拖拽自定义导航菜单、幻灯片、面板等内容。Muse支持最新的Web标准,包括HTML5和CSS3。另外,Muse与Adobe InDesign可以很好的相结合,创作出具有交互式内容和各种流行元素的Web站点。 网站发布:设计完网站之后,你可以在Muse内部预览上线后的效果,然后对网站进行浏览器兼容性等测试,没有问题的话就可以上线。同时,Adobe网站上也列举了好多 Muse 成品网站,专业美观。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值