基于 Flutter 视频客户端 Vistor【已开源】

android studio 相关说明 | 2019-02-16 22:06

作者丨Songlcy (粉丝投稿)

项目已开源到 Github:Vistor,欢迎大家 fork,star。

开发环境:

Vs Code (1.30.2)

Android Studio 3.+

开发框架 ( Flutter sdk: ">=2.0.0-dev.68.0 <3.0.0" ):

状态管理:Scoped_model

网络层:Dio

导航库:Fluro

主模块分为首页、精选、电影、我的,以下是功能列表:

使用 scoped_model 状态管理,实现state统一管理。

使用 TabBar + TabBarView 实现单页面不同模块切换。

使用 staggered_grid_view、ListView 组件展示图文列表。

扩展列表组件,结合 NotificationManager 实现上拉加载更多数据,下拉刷新数据。

精选内容,分类展示,使用SliverAppBar,增加交互动效,提高用户体验。

自定义过滤菜单组件,结合 ScrollController 实现滑动交互效果。

代码模块化  实现,组件封装实现代码复用。

功能设计

使用 Fluro 管理全局路由,可自由配置 Scene 的转场动画,处理Android端的后退键事件

使用 Flutter 基本语法进行布局,并封装了一系列通用的组件,比如 AnimationText、过滤菜单,加载状态组件,共享动画组件等,便于全局复用

数据层使用Dio实现 Http / Https 网络加载,可轻松实现 http header、链接超时等常用配置。

使用 CachedImage 组件,实现图片的加载缓存,优化渲染显示性能。

引入 scoped_model 状态管理,Scoped 结合 ScopedModelDescendant ,设定全局 state 结构,管理相关的组件状态。

使用 shared_preferences 实现小数据的本地化存储。

使用第三方字体库,实现 FontFamily 的定制显示。

设置 WillPopScope,实现首页点击返回键提示两次快按退出功能。

首页非Index Tab 页面下,点击返回键,首先返回 Index Tab,再次点击提示两次退出。

项目结构

资源文件夹/lib├── main.dart├── common├── components├── config├── constants├── delegate├── events├── models│   ├── pood│   └── state_model├── pages│   ├── detail│   └── home│   ├── index│   └── mine│   ├── movie│   └── popular│   ├── theme├── route├── utils└assets

部分图标采用了icons,查看具体的图标名称可到 ionics官方文档。

依赖方式,cd 到项目根目录,执行:flutter get packages

dio: ^1.0.13

fluro: ^1.4.0

timeago: ^2.0.10

scoped_model: ^1.0.1

event_bus: ^1.0.1

shimmer: ^0.0.6

connectivity: ^0.3.2

fluttertoast: ^2.2.7

shared_preferences: ^0.4.3

cached_network_image: ^0.5.1

flutter_swiper: ^1.1.4

flutter_spinkit: ^3.0.0

flutter_staggered_grid_view: ^0.2.6

flutter_webview_plugin: ^0.3.0+2

video_player:

1.生成签名Keystore文件,并将keystore签名文件放到android/app根目录下

keytool -genkey -v -keystore my-release-key.keystore -alias my-key-alias -keyalg RSA -keysize 2048 -validity 10000

2.在gradle.properties文件下增加常量标识

MYAPP_RELEASE_STORE_FILE=my-release-key.keystore MYAPP_RELEASE_KEY_ALIAS=my-key-aliasMYAPP_RELEASE_STORE_PASSWORD=MYAPP_RELEASE_KEY_PASSWORD=

3.在app的build.gradle下的增加如下配置

android {   ...   defaultConfig {     ...   }   signingConfigs {     release {         storeFile file(MYAPP_RELEASE_STORE_FILE)         storePassword MYAPP_RELEASE_STORE_PASSWORD         keyAlias MYAPP_RELEASE_KEY_ALIAS         keyPassword MYAPP_RELEASE_KEY_PASSWORD     }   }   buildTypes {     release {       // signingConfig signingConfigs.debug      signingConfig signingConfigs.release     }   }}

5.进入项目根目录,终端执行如下命令:

flutter build apk  // 默认携带 --release

flutter build apk 会默认打出 release 版本的安装包,apk文件会生成在android/app/build/outputs/apk/目录。

推荐↓↓↓