# flutter_bilil_app

**Repository Path**: amespaces/flutter_bilil_app

## Basic Information

- **Project Name**: flutter_bilil_app
- **Description**: 仿照b站视频App,使用flutter 的实战项目
- **Primary Language**: Dart
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-10-08
- **Last Updated**: 2025-11-05

## Categories & Tags

**Categories**: Uncategorized

**Tags**: Dart, Flutter

## README

# flutter_bilil

A video playback project made with Flutter, imitating bililbilil

## branch content
1. 01net Flutter 网络和数据存储框架搭建
> - HiNet 网络层设计，支持网络库插拔设计不干扰业（Dio，http）、简洁易用支持配置来进行请求、统一异常和返回处理
> - 三种Json解析方式，  1. 手写实体类， 2， 网页工具自动生成实体类 3 json_serializable
> - 统一缓存框架hi_cache 设计， 使用shared_preferences

2. 02login 登录注册模块设计开发
> - 输入框使用技巧
> - 自定义AppBar 与 登录动效设计与实现
> - 登录，注册模块
> - fluttertoast

3. 03 Flutter 路由原理搭建App导航架构
> Navigator2 使用封装案例 文档https://blog.flutter.dev/learning-flutters-new-navigation-and-routing-system-7c9068155ade
```text
Navigator2 提供了一些列全新接口，
- page 用来表示Navigator路由栈各个页面中不可变的对象，page是抽象类，通常使用其派生类 MaterialPage 或者 cupertinoPage
- Router 用来配置要由Navigator展示的页面列表
- RouterDelegate 定义应用程序中的路由行为，主要工作是监听RouteInfomationParser 和应用状态 ，并使用当前列表来构建Pages
- RouteInformationParser 解析路由信息, 持有RouterInfomationProvider 提供的RouteInfomation 可以将其解析为我们定义的数据类型
- BackButtonDispatcher 响应后退按钮，并通知Router
```
> - 页面跳转以及未登录拦截
> - 底部Tab切换监听
> - 感知当前页面是否压后台
> - 页面导航监听与onPause和onResume的能力

4. 04 首页模块搭建
> 搭建首页模块， Flutter 图片加载和缓存原理，列加载优化
- 首页接口系分和Dao层实现
- 封装HiState处理页面状态异常
- 轮播图Banner组件封装 flutter_swiper 的安装和使用
- ios 9 和android9 之后不允许明文传输问题
> 为了提升数据的安全性， 系统默认禁用应用的明文网络流量http请求
> transparent_image 一个简单的透明图像
>  图片加载和缓存 
```text 
默认情况下flutter 支持1000张图片缓存到本地， 并且图片的总大小不超过100MB，如果超过会根据LRU算法移除之前缓存的图片
可以对缓存大小进行调整，但不建议调整很大
如果想增加本地缓存可以借助插件来完成 比如cache_network_image
```
> 列表常驻内存
```text
默认情况下 放在PageView 中的页面切换走时会被销毁，再次切换回来会导致页面重新创建， 如果页面中有列表会重新加载
可以通过AutomaticKeepAliveClientMixin 来设置

class _HomeTabPageState extends State<HomeTabPage> with AutomaticKeepAliveClientMixin {

    @override
    bool get wantKeepAlive => true;
}
```