Flutter 实战:构建跨平台应用

文章目录

  • 一、简介
  • 二、开发环境搭建
  • 三、实战案例:开发一个简单的天气应用
    • 1. 项目创建
    • 2. 界面设计
    • 3. 数据获取
    • 4. 实现数据获取和处理
    • 5. 界面展示
    • 6. 添加动态效果和交互
    • 7. 添加网络错误处理
    • 8. 添加刷新功能
    • 9. 添加定位功能
    • 10. 添加通知功能
    • 11. 添加数据持久化功能
  • 《Flutter小白开发——跨平台客户端应用开发学习路线》
    • 内容简介
    • 作者简介
    • 目录


一、简介

Flutter是由Google开发的一款开源移动应用开发框架,它可以帮助开发者在iOS和Android平台上快速、高效地开发应用。Flutter使用Dart语言作为开发语言,具有跨平台兼容性高、开发效率快、性能优异等特点。本文将通过实战案例,介绍如何使用Flutter构建跨平台应用。

二、开发环境搭建

在开始Flutter开发之前,需要先安装Flutter SDK和开发环境。可以按照Flutter官方文档的指引,下载并安装Flutter SDK,以及配置开发环境。

三、实战案例:开发一个简单的天气应用

本案例将通过使用Flutter开发一个简单的天气应用,介绍Flutter的开发流程和常用组件。

1. 项目创建

在终端中进入要创建项目的目录,然后运行以下命令创建一个新的Flutter项目:

flutter create weatherapp

2. 界面设计

进入项目目录,打开lib/main.dart文件,可以看到默认的Flutter界面代码。在这个文件中,我们可以编写应用的界面和逻辑代码。为了让应用更加美观和易用,我们可以使用Flutter提供的各种组件和布局。比如,我们可以使用MaterialApp组件来设置应用的主题和导航,使用Container组件来设置容器和背景,使用Text组件来显示文本信息,等等。

3. 数据获取

为了让天气应用能够实时获取并显示天气信息,我们需要使用网络请求来获取数据。在Flutter中,我们可以使用http库来发送HTTP请求。在pubspec.yaml文件中添加以下代码来引入http库:

dependencies:flutter:sdk: flutterhttp: ^0.12.0

然后运行以下命令来更新依赖:

flutter pub get

4. 实现数据获取和处理

main.dart文件中,我们可以使用HttpClient类来发送HTTP请求,获取天气数据。然后,我们可以使用JsonDecoder类将JSON数据解析为Dart对象,方便后续操作。示例代码如下:

import 'package:http/http.dart' as http;
import 'package:json_annotation/json_annotation.dart';
import 'package:weatherapp/models/weather.dart';void main() async {// 发送HTTP请求,获取天气数据final response = await http.get('https://api.example.com/weather');// 解析JSON数据final jsonData = jsonDecode(response.body);final weatherData = Weather.fromJson(jsonData);// 处理天气数据,如显示在界面上// ...
}

在上面的代码中,我们使用http.get方法发送GET请求,获取天气数据的JSON字符串。然后,我们使用jsonDecode方法将JSON字符串解析为Dart对象,方便后续操作。最后,我们使用Weather.fromJson方法将JSON数据解析为Weather对象,方便后续操作。

5. 界面展示

最后,我们可以在界面上展示天气数据。在Flutter中,我们可以使用各种组件和布局来展示数据。比如,我们可以使用Text组件来显示天气温度和天气情况,使用ListView组件来展示未来几天的天气预报,等等。示例代码如下:

import 'package:flutter/material.dart';
import 'package:weatherapp/models/weather.dart';class WeatherApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(title: 'Weather App',theme: ThemeData(primarySwatch: Colors.blue,),home: Scaffold(appBar: AppBar(title: Text('Weather App'),),body: Center(child: Text('Temperature: ${weatherData.temperature}°C'),child: Text('Weather: ${weatherData.weather[0].description}'),),),);}
}

在上面的代码中,我们定义了一个WeatherApp组件作为应用的主界面。在这个组件中,我们使用MaterialApp组件来设置应用的主题和导航,使用Scaffold组件来设置应用的布局和导航栏,使用AppBar组件来设置导航栏的标题和样式,使用Center组件来设置布局的中心点,使用Text组件来显示天气温度和天气情况。需要注意的是,在上面的代码中,我们使用了名为weatherData的变量来保存天气数据,方便后续操作。

6. 添加动态效果和交互

为了让天气应用更加生动和易用,我们可以添加一些动态效果和交互。比如,我们可以使用Flutter提供的AnimationController类来控制动画的播放和速度,使用Hero组件来实现页面之间的转场动画,使用RaisedButton组件来添加交互按钮,等等。示例代码如下:

import 'package:flutter/material.dart';
import 'package:weatherapp/models/weather.dart';class WeatherApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(title: 'Weather App',theme: ThemeData(primarySwatch: Colors.blue,),home: Scaffold(appBar: AppBar(title: Text('Weather App'),),body: Center(child: Text('Temperature: ${weatherData.temperature}°C'),child: Text('Weather: ${weatherData.weather[0].description}'),child: Hero(tag: 'weather-app',child: Container(color: Colors.lightBlueAccent,child: ListView.builder(itemCount: weatherData.weather.length,itemBuilder: (BuildContext context, int index) {return ListTile(title: Text('${weatherData.weather[index].description}'),leading: Icon(Icons.ac_unit),trailing: Icon(Icons.access_time),onTap: () {// 跳转到详细页面},);},),),),),),);}
}

在上面的代码中,我们使用Hero组件来实现页面之间的转场动画。同时,我们使用ListView.builder组件来展示未来几天的天气预报,使用ListTile组件来定义每个天气的标题、图标和操作按钮。当用户点击操作按钮时,可以跳转到详细页面,展示该天气的详细信息。需要注意的是,在上面的代码中,我们使用了名为weatherData的变量来保存天气数据,方便后续操作。

7. 添加网络错误处理

在实现天气应用时,我们需要考虑到网络错误的情况。当网络连接失败或者请求超时时,我们需要给出相应的错误提示,以便用户了解情况。在Flutter中,我们可以使用try-catch语句来捕获异常,并进行相应的错误处理。示例代码如下:

void main() async {try {// 发送HTTP请求,获取天气数据final response = await http.get('https://api.example.com/weather');// 解析JSON数据final jsonData = jsonDecode(response.body);final weatherData = Weather.fromJson(jsonData);// 处理天气数据,如显示在界面上// ...} catch (error) {// 发生异常,进行错误处理print(error);// 显示网络错误提示,例如:重新加载或检查网络连接}
}

在上面的代码中,我们使用try-catch语句来捕获异常。当发生异常时,我们打印错误信息,并可以进行相应的错误处理,例如:显示网络错误提示,让用户重新加载或者检查网络连接。

8. 添加刷新功能

为了让天气应用更加易用,我们可以添加刷新功能。当用户需要更新天气数据时,可以通过手动刷新来获取最新的天气数据。在Flutter中,我们可以使用RefreshIndicator组件来实现刷新功能。示例代码如下:

void main() async {// 初始化变量,记录是否已经加载过数据bool hasLoadedData = false;runApp(MaterialApp(title: 'Weather App',home: Scaffold(appBar: AppBar(title: Text('Weather App')),body: Center(child: RefreshIndicator(onRefresh: () async {if (!hasLoadedData) {// 第一次加载数据,直接获取天气数据并显示在界面上final response = await http.get('https://api.example.com/weather');final weatherData = Weather.fromJson(jsonDecode(response.body));// 处理天气数据,如显示在界面上hasLoadedData = true; // 标记已经加载过数据,避免重复加载} else {// 非第一次加载数据,执行刷新操作(例如:重新获取天气数据并显示在界面上)// ...}},child: Column(children: [ /* 显示天气数据的组件 */ ]),),),),));
}

在上面的代码中,我们使用RefreshIndicator组件来实现刷新功能。当用户手动刷新时,会触发onRefresh回调函数。在该函数中,我们可以执行相应的刷新操作,例如:重新获取天气数据并显示在界面上。需要注意的是,我们在onRefresh回调函数中判断了是否已经加载过数据。如果是第一次加载数据,我们会直接获取天气数据并显示在界面上;否则,我们会执行刷新操作(例如:重新获取天气数据并显示在界面上)。这样就可以避免重复加载数据和不必要的刷新操作。

9. 添加定位功能

为了让天气应用更加个性化,我们可以添加定位功能。通过获取用户的地理位置信息,我们可以获取用户所在地的天气数据,并为其提供更准确的天气预报服务。在Flutter中,我们可以使用geolocator插件来获取用户的地理位置信息。示例代码如下:

首先,在pubspec.yaml文件中添加geolocator插件的依赖:

dependencies:flutter:sdk: fluttergeolocator: ^5.1.1

然后,在代码中使用geolocator插件来获取用户的地理位置信息:

import 'package:flutter/material.dart';
import 'package:geolocator/geolocator.dart';class WeatherApp extends StatelessWidget {Widget build(BuildContext context) {return MaterialApp(title: 'Weather App',theme: ThemeData(primarySwatch: Colors.blue,),home: Scaffold(appBar: AppBar(title: Text('Weather App')),body: Center(child: Text('Temperature: ${weatherData.temperature}°C'),child: Text('Weather: ${weatherData.weather[0].description}'),child: Hero(tag: 'weather-app',child: Container(color: Colors.lightBlueAccent,child: ListView.builder(itemCount: weatherData.weather.length,itemBuilder: (BuildContext context, int index) {return ListTile(title: Text('${weatherData.weather[index].description}'),leading: Icon(Icons.ac_unit),trailing: Icon(Icons.access_time),onTap: () {// 跳转到详细页面},);},),),),),),);}
}

10. 添加通知功能

为了提醒用户天气变化或者重要通知,我们可以添加通知功能。在Flutter中,我们可以使用flutter_local_notifications插件来发送本地通知。示例代码如下:

首先,在pubspec.yaml文件中添加flutter_local_notifications插件的依赖:

dependencies:flutter:sdk: flutterflutter_local_notifications: ^8.0.0

然后,在代码中使用flutter_local_notifications插件来发送通知:

import 'package:flutter/material.dart';
import 'package:flutter_local_notifications/flutter_local_notifications.dart';class WeatherApp extends StatelessWidget {static void showNotification(BuildContext context, String message) {showLocalNotification(context: context,builder: (BuildContext context) {return AlertDialog(title: Text('Weather Alert'),content: Text(message),actions: [TextButton(child: Text('Dismiss'),onPressed: () {},),],);},notificationBuilder: (BuildContext context, int notificationId) {return SimpleNotification(title: 'Weather Alert', description: 'Check out the weather forecast!', color: Colors.lightBlueAccent);},);}
}

11. 添加数据持久化功能

为了让天气应用在用户重新打开时仍然保留之前的数据,我们可以添加数据持久化功能。在Flutter中,我们可以使用shared_preferences插件来保存和读取用户的设置和数据。示例代码如下:

首先,在pubspec.yaml文件中添加shared_preferences插件的依赖:

dependencies:flutter:sdk: fluttershared_preferences: ^2.0.5

然后,在代码中使用shared_preferences插件来保存和读取数据:

import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';class WeatherApp extends StatefulWidget {@override_WeatherAppState createState() => _WeatherAppState();
}class _WeatherAppState extends State<WeatherApp> {String _temperature = '';String _weather = '';bool _isFavorited = false;@overridevoid initState() {super.initState();readData();}void readData() async {SharedPreferences prefs = await SharedPreferences.getInstance();_temperature = prefs.getString('temperature');_weather = prefs.getString('weather');_isFavorited = prefs.getBool('isFavorited');}void saveData() async {SharedPreferences prefs = await SharedPreferences.getInstance();prefs.setInt('temperature', 25); // 这里的键值需要和读取时的保持一致,否则无法保存成功。同时这里的value是int类型,需要转为String保存。prefs.setString('weather', 'Sunny');prefs.setBool('isFavorited', true);}
}

《Flutter小白开发——跨平台客户端应用开发学习路线》

在这里插入图片描述

内容简介

《Flutter小白开发——跨平台客户端应⽤开发学习路线》以移动平台(iOS/安卓)与Web 平台为例,系统地介绍如何基于Flutter 框架开发跨平台的应用。

《Flutter小白开发——跨平台客户端应⽤开发学习路线》分为三大部分,共27 章。第一部分(第1~4 章)主要介绍开发前要做的准备工作,包括安装命令行界面、开发环境,熟悉Dart 语言和包管理知识;第二部分(第5~14 章)带领大家熟悉和理解Flutter框架,掌握Flutter 应用开发的基础知识;第三部分(第15~27 章)是Flutter 实践,结合服务端应用接口,实现一些真实应用里经常用到的界面,并将做好的应用发布到应用商店。

《Flutter小白开发——跨平台客户端应⽤开发学习路线》提供了一套系统、全面的训练任务,从易到难,轻松有趣。从准备开发工具与开发环境开始,熟悉程序语言,了解应用框架,直到具体实践与应用分发,引领大家逐步掌握Flutter 应用框架的使用技巧,获得开发移动端应用的基础能力,对于初学者来说非常友好。

作者简介

王皓,宁皓网作者,独立开发者,自学应用开发十年有余,创作过数百万字的应用技术内容与数百小时的技术视频,内容覆盖Web技术、客户端与服务端应用开发,内容风格简单有效,逻辑清晰,帮助无数技术爱好者掌握了应用开发技能。

目录

第一部分 开发准备第1 章 准备开发 21.1 命令行界面 21.1.1 任务:Windows 系统下准备命令行界面Cmder 21.1.2 任务:在macOS 系统下准备命令行界面Terminal 31.1.3 任务:熟悉基本命令 31.1.4 理解环境变量目录 51.1.5 知道命令来自哪里 51.1.6 命令行工具的帮助信息 61.1.7 命令行界面的配置文件 61.2 代码编辑器 71.3 源代码管理 82章 开发环境 92.1 下载开发工具包 92.1.1 任务:macOS 系统下安装Flutter 92.1.2 任务:Windows 系统下安装Flutter 102.1.3 任务:配置使用国内镜像 112.2 准备iOS 与macOS 应用开发环境 112.2.1 任务:安装Rosetta 122.2.2 任务:安装Homebrew 122.2.3 任务:安装与准备Xcode 122.3 准备Android平台应用开发环境 132.4 准备设备模拟器 142.5 准备Web 应用开发环境 152.6 准备代码编辑器VSCode 152.7 创建Flutter 项目 162.7.1 任务:创建并运行Flutter 项目 162.7.2 任务:清理项目与源代码管理 182.8 问题与思考 183章 熟悉Dart 语言 213.1 准备工作 213.2 变量 223.2.1 var 223.2.2 final 223.2.3 const 233.2.4 理解var、final 与const 的区别 233.3 类型 253.4 内置类型 253.4.1 字符串 253.4.2 数字 263.4.3 布尔值 263.4.4 列表 273.4.5 集合 273.4.6 映射 283.5 函数 283.5.1 创建函数 293.5.2 执行函数 293.5.3 函数参数 293.5.4 函数有多个参数 293.5.5 有名字的参数 303.5.6 必填参数 303.5.7 参数默认值 313.5.8 函数返回值 313.6 流程控制 313.6.1 if 语句 323.6.2 switch 语句 323.7 异常 343.7.1 抛出异常(throw343.7.2 捕获异常(catch/on) 343.8353.8.1 定义一个类 363.8.2 实例化一个类 363.8.3 属性 363.8.4 构造方法 373.8.5 this 关键字 373.8.6 带名字的构造方法 383.8.7 方法 383.8.8 继承 393.8.9 类属性 393.8.10 类方法 403.9 泛型 403.10413.10.1 使用内置库 413.10.2 指定库前缀 413.10.3 导入部分库 423.10.4 导入开发者个人库里的资源 423.11 Future 423.11.1 定义异步函数 433.11.2 使用异步函数提供的值 433.11.3 处理异步函数遇到的错误 444章 包管理 454.1 包(Package) 454.2 pubspec.yaml 文件 454.3 安装包 464.3.1 解决包依赖问题 464.3.2 dependencies 属性 464.3.3 版本号 474.3.4 pubspec.lock 文件 474.3.5 package_config.json 文件 474.4 使用包 484.5 升级包 48第二部分 Flutter基础第5章 基本部件 525.1 准备 525.1.1 任务:准备项目(widget) 525.1.2 任务:准备应用入口 525.2 小部件(Widget) 535.3 自定义一个无状态的小部件 545.4 Text(文本) 565.5 RichText(富文本) 585.6 Image(图像) 595.6.1 任务:显示资源包里的图像 605.6.2 任务:显示来自网络的图像 615.6.3 任务:调整图像的显示 625.7 Container(容器) 635.7.1 任务:使用Container 小部件 645.7.2 任务:装饰容器 665.8 整理项目 696章 页面结构 706.1 准备项目(page-structure) 706.2 MaterialApp 706.2.1 任务:创建Material 应用 706.2.2 任务:使用图标(Icon) 716.2.3 任务:使用按钮(ElevatedButton) 726.2.4 任务:定制应用的主题样式 736.3 Scaffold(页面结构) 756.4 AppBar(应用栏) 766.5 TabBar(标签栏) 776.6 BottomNavigationBar(底部导航栏) 796.6.1 任务:设置底部导航栏 796.6.2 任务:把App 转换成有状态小部件(StatefulWidget) 806.6.3 任务:单击底部导航栏项目,切换当前活动项目 816.6.4 任务:单击底部导航栏项目,切换显示小部件 826.6.5 任务:单击底部导航栏项目,动态显示或隐藏AppBar 836.7 FloatingActionButton(漂浮动作按钮) 846.8 整理项目 857章 定义部件 867.1 准备 867.1.1 任务:准备项目(define-widget) 867.1.2 任务:配置VSCode 编辑器代码片断 877.2 AppPageHeader(页面头部) 887.3 AppLogo(应用标志) 897.4 AppPageMain(页面主体) 907.5 PostIndex(内容索引) 937.6 AppPageBottom(页面底部) 947.7 AppFloatingActionButton(漂浮动作按钮) 967.8 目录结构 977.9 小部件树 977.10 整理项目 988章 弹窗对话 998.1 准备项目(modal-dialog) 998.2 BottomSheet(底部面板) 998.2.1 任务:显示页面底部面板 998.2.2 任务:用漂浮动作按钮显示与关闭底部面板 1018.3 AlertDialog(警告对话框) 1038.4 SnackBar(消息提示栏) 1058.5 Drawer(边栏抽屉) 1068.5.1 任务:使用边栏抽屉 1078.5.2 任务:设置边栏抽屉上显示的内容(ListView 与ListTile) 1088.6 PopupMenuButton(弹出菜单按钮) 1118.7 整理项目 1139章 页面布局 1149.1 准备 1149.1.1 任务:准备项目(layout) 1149.1.2 任务:准备练习页面 1149.2 约束 1169.2.1 任务:理解小部件的约束 1169.2.2 任务:准备一个布局演示项目小部件 1199.2.3 任务:使用安全区域(SafeArea)和尺寸盒子(SizedBox) 1209.3 Align(对齐) 1219.4 Column(栏/列) 1229.5 Row(行/排) 1249.6 Expanded(扩展空间) 1269.7 Stack(堆) 1279.8 Positioned(定位) 1289.9 整理项目 12810 章 表单元素 12910.1 准备 12910.1.1 任务:准备项目(input) 12910.1.2 任务:准备练习小部件PlaygroundInput 12910.2 ElevatedButton(按钮) 13010.3 TextField(文本字段) 13310.3.1 任务:使用文本字段小部件 13310.3.2 任务:获取文本字段里的数据 13510.4 TextFormField(文本表单字段) 13710.4.1 任务:使用文本表单字段 13710.4.2 任务:验证文本表单字段数据 13810.5 TextEditingController(文本编辑控制器) 14110.6 Form(表单) 14310.7 问题与思考 14410.8 整理项目 14411章 路由导航(一) 14511.1 准备 14511.1.1 任务:准备项目(routing) 14511.1.2 任务:准备导航与路由演示小部件 14511.2 路由与导航器 14611.3 用命令式管理路由 14611.4 默认路由 14911.5 路由表 15111.6 生成路由时的回调 15211.6.1 任务:使用生成路由回调onGenerateRoute 15211.6.2 任务:在路由名字中提取参数 15411.7 问题与思考 15711.8 整理项目 15712章 状态管理 15812.1 准备 15812.1.1 任务:准备项目(state-management) 15812.1.2 任务:准备状态管理演示小部件 15812.1.3 任务:安装provider 15912.2 准备数据 16012.3 提供数据 16112.3.1 确定提供数据的位置 16212.3.2 任务:用Provider 提供数据与方法 16212.4 使用数据 16312.5 数据变化 16512.5.1 任务:用ChangeNotifierProvider提供数据与方法 16512.5.2 任务:在小部件里使用Provider 提供的数据与方法(Consumer) 16712.6 问题与思考 16812.7 整理项目 16813章 路由导航(二) 16913.1 准备项目(routing_2) 16913.2 页面 16913.2.1 任务:使用Navigator 声明式接口(Pages API16913.2.2 任务:使用MultiProvider 提供多个数据类 17113.2.3 任务:动态添加与移除页面 17313.3 路由器 17613.3.1 任务:创建路由器代表(RouterDelegate) 17613.3.2 任务:使用路由器管理路由(Router) 17713.3.3 任务:应用状态变化时通知Router 重建Navigator 18013.4 路由配置 18113.4.1 调试Web 应用 18113.4.2 任务:定义路由配置类型 18113.4.3 任务:把路由信息转换成自定义的路由配置(parseRouteInformation) 18213.4.4 任务:根据路由配置数据修改应用状态(setNewRoutePath) 18413.4.5 任务:把路由配置转换成路由信息(restoreRoute Information) 18513.5 问题与思考 18813.6 整理项目 18814章 网络请求 18914.1 准备 18914.1.1 任务:准备项目(http) 18914.1.2 任务:准备网络请求演示小部件 18914.2 http 19014.2.1 任务:安装http 并使用资源 19014.2.2 任务:请求服务端接口获取数据 19114.2.3 任务:将JSON 数据转换成自定义类型 19314.2.4 任务:请求服务端接口创建内容(用户) 19514.2.5 任务:发送用户登录请求 19714.2.6 任务:请求服务端接口更新内容(用户) 20014.3 序列化 20214.4 问题与思考 20514.5 整理项目 205第三部分 Flutter实践第15章 内容列表 20815.1 准备项目(list) 20815.2 应用配置 20815.3 创建内容列表 21015.3.1 任务:创建内容列表小部件(PostList) 21015.3.2 任务:定义并提供获取内容列表数据方法 21115.3.3 任务:请求内容列表数据 21315.3.4 任务:定义内容数据类型 21415.3.5 任务:转换生成一组内容(Post)类型的数据 21715.3.6 任务:使用ListView 构建内容列表视图 22015.4 整理项目 22116章 列表项目 22216.1 准备项目(list-item) 22216.2 定义列表项目 22216.2.1 任务:创建内容列表项目小部件(PostListItem) 22216.2.2 任务:定义内容媒体小部件(PostMedia) 22416.2.3 任务:定义内容头部小部件(PostHeader) 22616.2.4 任务:定义用户头像小部件(UserAvatar) 22816.2.5 任务:定义内容动作小部件(PostActions) 23016.3 问题与思考 23316.4 整理项目 23417章 内容页面 23517.1 准备项目(post) 23517.2 开发单个内容页面 23517.2.1 任务:处理单击内容列表项目图像 23517.2.2 任务:定义单个内容数据模型(PostShowModel) 23717.2.3 任务:单击内容项目图像时显示内容页面 24017.2.4 任务:定义内容页面主体小部件(PageShowMain) 24317.2.5 任务:定义内容正文小部件(PostContent) 24717.2.6 任务:定义内容标签小部件(PostTags) 24917.2.7 任务:配置路由器处理内容页面 25117.2.8 任务:请求内容页面需要的数据 25417.3 问题与思考 25617.4 整理项目 25918章 验证身份 26018.1 准备项目(auth) 26018.2 登录页面 26018.2.1 任务:添加用户登录页面 26018.2.2 任务:准备登录表单小部件(AuthLoginForm) 26318.3 请求登录 27018.3.1 任务:定义用户登录相关类型(LoginData,Auth) 27018.3.2 任务:自定义网络请求异常(HttpException) 27118.3.3 任务:定义身份验证模型(AuthModel) 27218.3.4 任务:请求用户登录 27418.4 问题与思考 27618.5 整理项目 27619章 状态管理 27719.1 准备项目(state-management_2) 27719.2 改造创建Provider 的方式 27719.2.1 任务:使用Provider 的value 构造方法提供值 27719.2.2 任务:在单独的文件里定义要提供的Provider 27819.3 在用户设备上存取数据 27919.3.1 任务:用shared preferences 插件记住登录状态 27919.3.2 任务:应用启动以后恢复登录状态 28219.4 使用代理Provider 解决依赖 28519.4.1 任务:定义应用服务与接口客户端(AppService 和ApiHttpClient) 28519.4.2 任务:用ChangeNotifierProxyProvider解决依赖 28719.4.3 任务:改造PostIndexModel 用apiHttpClient 发送请求 28819.5 整理项目 28920章 点赞内容 29020.1 准备项目(like) 29020.2 点赞内容相关操作 29020.2.1 任务:使用GestureDetector 处理手势动作 29020.2.2 任务:定义点赞内容模型 29120.2.3 任务:定义取消点赞模型 29220.2.4 任务:定义提供点赞的Provider 29320.2.5 任务:处理用户点赞动作 29420.2.6 任务:处理用户取消点赞动作 29620.3 问题与思考 29820.4 整理项目 29821章 列表布局 29921.1 准备项目(post-list-layout) 29921.2 内容列表布局 29921.2.1 任务:准备热门内容列表 29921.2.2 任务:准备内容列表布局相关数据与方法 30121.2.3 任务:设置与存储内容列表布局 30221.2.4 任务:准备网格内容列表 30321.2.5 任务:准备多种布局的内容列表项目 30521.2.6 任务:恢复内容列表布局 30821.3 问题与思考 31021.4 整理项目 312

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/170227.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

基于springboot实现沁园健身房预约管理系统【项目源码】计算机毕业设计

基于springboot实现沁园健身房预约管理系统演示 B/S架构 B/S结构是目前使用最多的结构模式&#xff0c;它可以使得系统的开发更加的简单&#xff0c;好操作&#xff0c;而且还可以对其进行维护。使用该结构时只需要在计算机中安装数据库&#xff0c;和一些很常用的浏览器就可以…

JS+ES6新增字符串方法大汇总,爆肝,共四十七种方法(求个赞,哈哈)

让我为大家介绍一下字符串的操作方法吧&#xff0c;你知道与不知道的大部分都在这&#xff01; 分类可能有点不太对&#xff0c;还请大家见谅&#xff01; 增 1.concat() 拼接字符串 可以连接两个或多个字符串 let str "hello"let str1 " str"console…

node插件MongoDB(三)—— 库mongoose 的使用和数据类型(一)

前言 提示&#xff1a;使用mongoose 的前提是你安装了node和 MongoDB。 mongoose 官网文档&#xff1a;http://mongoosejs.net/docs/index.html 文章目录 前言一、安装二、基本使用1. 打开bin目录的mongod.exe文件2. 基本使用的代码&#xff08;连接mongodb 服务&#xff09;3.…

【STM32】

STM32 1 CMSIS1.1 概述1.2 CMSIS 应用程序文件描述 2 库2.1 简介2.2 标准外设库&#xff08;standrd Peripheral Libraries&#xff09;2.3 HAL 库2.3.1 目录结构2.3.2 HAL库API函数和变量的命名规则2.3.3 HAL库对寄存器位操作的相关宏定义2.3.4 HAL库回调函数2.3.5 HAL使用注意…

uniapp的实战总结大全

&#x1f642;博主&#xff1a;冰海恋雨 &#x1f642;文章核心&#xff1a;uniapp部分总结 目录 ​编辑 目录 前言&#xff1a; 解决方案 1. 跨平台开发 2. Vue.js生态 3. 组件库 4. 自定义组件 5. Native能力 6. 插件生态 7. 性能优化 写法 1. 模板&#xf…

头歌答案HTML——基础

目录 HTML——基础 第1关&#xff1a;初识HTML&#xff1a;简单的Hello World网页制作 任务描述 第2关&#xff1a;HTML结构&#xff1a;自我简介网页 任务描述 HTML——基本标签 第1关&#xff1a;创建第一个 HTML 标签 任务描述 第2关&#xff1a;创建 任务描述 …

GoLong的学习之路,进阶,语法之并发(并发错误处理)补充并发三部曲

这篇文章主要讲的是如何去处理并发的错误。 在Go语言中十分便捷地开启goroutine去并发地执行任务&#xff0c;但是如何有效的处理并发过程中的错误则是一个很棘手的问题。 文章目录 recovererrgroup recover 哦对&#xff0c;似乎没写错误处理的文章。后面补上。 首先&…

【面试经典150 | 】颠倒二进制位

文章目录 写在前面Tag题目来源题目解读解题思路方法一&#xff1a;逐位颠倒方法二&#xff1a;分治 写在最后 写在前面 本专栏专注于分析与讲解【面试经典150】算法&#xff0c;两到三天更新一篇文章&#xff0c;欢迎催更…… 专栏内容以分析题目为主&#xff0c;并附带一些对于…

【使用教程】在Ubuntu下PMM60系列一体化伺服电机通过PDO跑循环同步位置模式详解

本教程将指导您在Ubuntu操作系统下使用PDO来配置和控制PMM60系列一体化伺服电机以实现循环同步位置模式。我们将介绍必要的步骤和命令&#xff0c;以确保您能够成功地配置和控制PMM系列一体化伺服电机。 一、准备工作 在正式介绍之前还需要一些准备工作&#xff1a;1.装有lin…

c语言-数据结构-带头双向循环链表

目录 1、双向循环链表的结构 2、双向循环链表的结构体创建 3、双向循环链表的初始化 3.1 双向链表的打印 4、双向循环链表的头插 5、双向循环链表的尾插 6、双向循环链表的删除 6.1 尾删 6.2 头删 6.3 小节结论 7、查找 8、在pos位置前插入数据 9、删除pos位…

Lightroom Classic 2023 v12.4

Lightroom Classic 2023是一款图像处理软件&#xff0c;是数字摄影后期制作的重要工具之一。与其他图像处理软件相比&#xff0c;Lightroom Classic具有以下特点&#xff1a; 高效的图像管理&#xff1a;Lightroom Classic提供了强大的图像管理功能&#xff0c;可以轻松导入、…

Google Firebase PHP实现消息推送

获取key的方法&#xff1a; 登录谷歌开发者后台 https://console.firebase.google.com/?hlzh-cn function firebaseNotice($title,$body){$token_arr[token1,token2]; //用户的firebasetoken列表$notify_msg ["notification" > ["title" > $title…