美文网首页android开发技巧Flutter
Flutter个人开发项目架构

Flutter个人开发项目架构

作者: karl_wei | 来源:发表于2020-06-06 23:34 被阅读0次

背景

本人18年尾接触了Flutter,并开发了两个APP。瞬间被这门跨平台技术吸引住,无奈后续没有机会继续开发,但一直有在默默学习。却始终觉得整天写Demo实在难以进步,必须要有一套完整的小项目。首先要找个好的框架,GitHub上下载了几个优秀源码,自己动手写一个吧。

项目结构如图所示

项目结构图

简单说一下,这个框架主要应用MVVM原理,主要通过provider实现。上图中强调一下services包,主要用来做API请求管理。这里还要说明一下,我也是Flutter新手一枚,此篇文章主要也是为了巩固一下知识,与大家一起交流flutter,千万不要被我的浅薄知识误导,也非常希望大家提出意见,让我完善这个项目的学习编写。

Services

1. 首先看service_interface:这是一个abstract class,声明了所有的接口请求方法,等待实例对象去实现,当有新的请求时,请在此文件新声明一个接口。

service_interface

2. 接下来是request_service:此文件实现(implements)了上面的抽象类(NetWorkApi),利用工厂+单例模式暴露静态实例。之后必须实现service_interface中声明的方法,去调用http请求。implements规范了程序员必须去实现否则会报错。

request_service

当VM页面需要请求接口时,可直接调用:

VM中调用网络请求

Router

Flutter路由一般分静态和动态,静态路由传参比较复杂,因此我习惯使用动态路由。因此在routers中,我使用Map对象router管理所有路由,定义多个静态函数,通过传参中的键值,去router中匹配页面。逻辑非常简单,其实就是一个封装而已,目的就是为了方便管理。

Router

Model+ ViewModel +View 

这几个我需要一起讲,顾名思义MVVM思想,我使用的是Flutter官方采用的provider。View只负责布局,布局中需要用到的数据和方法,通过Provider.of(context,listen:false).model,去使用ViewModel中定义的数据,而ViewModel中的数据,又引入了Model的实体类。达到视图与数据与操作相互分离的效果,提高代码可维护性。

Model ViewModel Model

Utils

这一块主要是工具类的封装,每个人习惯都不一样,我的仅供参考。先看看我们导入的第三方库

yaml

1.http: 使用Dio,单例模式暴露对象,直接上代码吧。

1 2 3

这里调用了api中管理的路径,进行请求。api的截图如下: 

api

2. toast:吐司utils

toast

至此,简单介绍了我写的粗略的项目框架,其中还有很多需要完善的地方,比如CommentModel需要几种在http中处理;多个页面共享Model如何更好的管理;缓存管理;防抖节流都还没有实现,后面抽空补上。同时我也需要将开始在这个项目中写Demo了,不想再零散的学习了。

希望大家多多指导我!

再会

相关文章

  • Flutter个人开发项目架构

    背景 本人18年尾接触了Flutter,并开发了两个APP。瞬间被这门跨平台技术吸引住,无奈后续没有机会继续开发,...

  • Flutter个人开发项目架构-2

    前言 上一篇文章已经搭建出基础框架,之后我也利用空闲时间继续优化。此篇文章的主要方向还是围绕provider搭建m...

  • Flutter个人开发项目架构-3

    这是2021的第一篇文章,首先祝各位小伙伴心想事成呀!2021我也立了很多的Flag,其中专研技术,总结、分享文章...

  • MVC、MVP、BloC、Redux四种架构在Flutter上的

    个人博客 前言 从进行开发OpenGit_Flutter项目以来,在项目中选择哪种架构困扰了很久。近段时间,分别在...

  • Flutter开发实战 高仿微信(1)首页

    Flutter开发实战 高仿微信(1)首页 flutter 开发微信项目 (1)首页 源码地址:flutter_...

  • flutter-mvp架构

    flutter_mvp 项目介绍 该项目为flutter的mvp的基础架构,主要封装了mvp基础类,使用dio进行...

  • Flutter中的网络请求

    个人使用flutter开发项目已经有1年半的时间了,由于从iOS原生开发转使用Flutter,比较习惯使用数据模型...

  • Flutter学习之旅-混合开发Part1

    场景 Flutter项目中需要与Native进行通信Android原生项目嵌入Flutter开发模块iOS原生项目...

  • flutter 项目架构

    经过一段时间,使用flutter开发项目,自已也有了一些 开发心得.此专栏只是为了记录自己在学习开发过程中的一点总结.

  • Flutter混合开发:Android接入Flutter

    前言 Flutter Google推出已经已经一年多了,单个 Flutter 项目的开发流程已经很成熟了。对与个人...

网友评论

    本文标题:Flutter个人开发项目架构

    本文链接:https://www.haomeiwen.com/subject/zcrftktx.html