乐趣区

vase原生跨平台

九年前,女:“对不起,我不会喜欢你的,你不要再坚持了。就好比让原生 App 运行到浏览器里,可能吗?”,男生听后默默走开。九年后,在 Fanx 编程语言专栏里,我听到一名 vase 开发程序员给大家讲述了这个故事。为什是九年不是十年,那是因为我翻阅 git 提交记录发现,我在 2011 年第一次提交了 vase 框架的代码。

什么是 vase

Vase 是 Fanx 语言开发的开源跨平台 UI 开发框架,使用它可以快速构建高质量的移动端 App。一份代码同时运行在 Android/iOS/ 浏览器 / 桌面。

static Void main() {
  Frame {   
     VBox
     {padding = Insets(50)
        layout.height = Layout.matchParent
        spacing = 15
        Button {
          text = "Flat Button"
          style = "flatButton"
          onClick {Toast("hello world").show(it) }
        },
        Button {
          text = "Push Button";
          onClick {Toast("Hi").show(it) }
        },
        Button {
          text = "Disable Button";
          enabled = false
          onClick {Toast("hello world").show(it) }
        },

        ToggleButton {text = "switch"},
        ToggleButton {text = "checkBox"; style = "checkBox"},
        RadioButton {text = "radio1"},
        RadioButton {text = "radio2"},

      }
    },
  }.show
}

丰富的 UI 控件

vase 提供丰富的 UI 开发组件,包括:

  • 各种按钮(Button,Switch,CheckBox,Radio,Combox)
  • 警告 / 输入对话框
  • 时间日期对话框
  • 菜单和上下文菜单
  • 图片的各种拉伸、掩模、多指缩放
  • 高性能的 ListView 和上拉下拉刷新
  • 滑动条和进度条
  • 文件选择 / 拍照 上传
  • 图片轮播
  • 用于 PC 的表格和树形视图
  • 多行文字输入

简单强大的布局容器

布局容器包括 HBox、VBox、Pane、FlowBox、EdgePane 等。支持各种对齐和大小策略,后面会单独文章介绍。

灵活的样式系统

vase 的 UI 和样式系统的分离的,类似于 CSS 的架构。和 CSS 类似,可以通过 ID、控件类型、样式类型来指定样式。很容易做到样式共享和换肤功能。也支持直接设置样式。

吸引人的微动画

无论是触摸反馈还是滚动,微动画无处不在。

基于 async/awit 的 Http 客户端

  • 人体工程学的异步,没有回调。
  • 支持 Cookie
  • 支持 multipart 文件上传协议。
  • 支持网络图片自动加载和缓存

预览 Demo

这里有 Android demo 安装包可供预览。链接: https://pan.baidu.com/s/1HuF8BBnDZ3nfxu7qnH_klA 提取码: nn83

欢迎关注专栏和提意见。

退出移动版