一个 Flutter 的 Model-View-ViewModel 实现 Flutter MVVM

MIT
Dart
跨平台
2019-09-04
unicreators

一个 Flutter 的 MVVM(Model-View-ViewModel) 实现, 它使用基于属性 (property) 的数据绑定在视图模型 (ViewModel) 与视图 (View) 之间建立关联,并通过视图模型 (ViewModel) 驱动视图 (View) 变化。以此简化 Flutter 开发过程中繁重的状态管理与 widget 树控制。

import 'package:flutter/widgets.dart';
import 'package:mvvm/mvvm.dart';
import 'dart:async';

// define ViewModel
class Demo1ViewModel extends ViewModel {
  Demo1ViewModel() {
    // define bindable property
    property<String>("time", initial: "");
    // timer
    start();
  }

  start() {
      Timer.periodic(const Duration(seconds: 1), (_) {
        var now = DateTime.now();
        // call setValue
        setValue<String>("time", "${now.hour}:${now.minute}:${now.second}");
      });
  }
}

// define View
class Demo1 extends View<Demo1ViewModel> {
  Demo1() : super(Demo1ViewModel());

  @override
  Widget buildCore(BuildContext context) {
    return Container(
        margin: EdgeInsets.symmetric(vertical: 100),
        padding: EdgeInsets.all(40),

        // binding
        child: $.watchFor("time", 
            builder: $.builder1((t) => 
              Text("$t", textDirection: TextDirection.ltr))));
  }
}

// run
void main() => runApp(Demo1());

的码云指数为
超过 的项目
加载中

评论(0)

暂无评论

暂无资讯

暂无问答

[开源] 从web端开发到app端开发也许只有一个Flutter MVVM的距离

做为一个开发人员,选择一款得心应手的开发框架对提高生产效率和愉悦编码体验是尤为重要的。近两年我从后端开发转向web端开发,开发重心也由之前数据层面转变为现今的展现层面。web端有很多出...

09/04 09:15
17
0
初识 flutter

2019年03月09日 flutter 框架出现快一年,我却没有深入了解,Java 语言过度到 dart 语言,恰逢这两天休息,就纠结了一下闲在家里没事还是学一学这个东西,说实话一直从事做Android 不停的接触...

03/10 00:06
3
0
Chameleon跨端框架——壹个理想主义团队的开源作品

文章较长,信息量很大,请耐心阅读,必然有收获。下面正文开始~ 背景 解决方案 原理 久经考验 生产应用举例 易用性好 多态协议 学习成本低 渐进式接入 业内对比 后期规划 理想主义 历经近20个...

02/01 13:49
1K
3
目前流行前端几大UI框架

在前端项目开发过程中,总是会引入一些UI框架,已为方便自己的使用,很多大公司都有自己的一套UI框架,下面就是最近经常使用并且很流行的UI框架。 一.Mint UI 屏幕快照 2019-01-18 下午3.03....

09/19 21:54
45
0
android 新闻应用、Xposed模块、酷炫的加载动画、下载模块、九宫格控件等源码

Android精选源码 灵活的ShadowView,可替代CardView使用 基于Tesseract-OCR实现自动扫描识别手机号 Android播放界面仿QQ音乐开源音乐播放器 新闻应用项目采用了 RxAndroid + Retrofit + Dat...

2018/12/26 12:17
50
0
重磅!滴滴跨端框架Chameleon 1.0正式发布

导读:滴滴在 GitHub 上开源的跨端解决方案 Chameleon(简写 CML)正式发布 1.0 版本,中文名卡梅龙;中文意思变色龙,意味着就像变色龙一样能适应不同环境的企业级跨端整体解决方案,具有易...

09/17 16:04
2
0
重磅!滴滴跨端框架Chameleon 1.0正式发布

导读:滴滴在 GitHub 上开源的跨端解决方案 Chameleon(简写 CML)正式发布 1.0 版本,中文名卡梅龙;中文意思变色龙,意味着就像变色龙一样能适应不同环境的企业级跨端整体解决方案,具有易...

10/08 14:32
28
0
Flutter for Web 开发环境搭建与验证

最新的Flutter 1.5.4已经支持Web开发,这个教程将介绍如何在Linux、windows和Mac下 安装Flutter web开发环境:安装Flutter SDK和Flutter Web构建工具,并利用Flutter Web 演示代码来验证开发...

05/21 22:43
307
0
Flutter 学习资料汇总

Flutter笔记--Android工程中集成Flutter工程 Flutter笔记--Flutter页面嵌入Android Activity中 Flutter笔记--Flutter页面嵌入Android Fragment中 原生App项目集成flutter混合开发详细指南 Fl...

05/17 20:33
24
0

没有更多内容

加载失败,请刷新页面

返回顶部
顶部