《Flutter 实战开发旅行社交手机APP》

最新推荐文章于 2021-08-30 12:48:07 发布
最新推荐文章于 2021-08-30 12:48:07 发布
阅读量401 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： Flutter 项目工程化 文章标签： flutter laravel locyin
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/geeksoarsky/article/details/119786405
本文介绍了一个使用Flutter和Laravel开发的旅行社交手机应用。福利章节已在《Flutter项目工程化》专栏免费发布，包括游记列表、点赞功能和游记详情等已完成。提供了Flutter客户端和Laravel服务器端的码云和GitHub仓库链接。

Flutter 实战开发旅行社交手机APP

福利

笔者转人工智能了，本项目的 Git 仓库会持续更新，但是没有多少空闲时间编写文档了，能写多少是多少了。以后章节不再额外收费，以福利形式继续在《Flutter项目工程化》专栏内发布，且不再涨价。
应读者需求，我已经把 Laravel 服务器端部署到了云服务器上，接口基础地址：

  • https://api.locyin.com/api/v1/

其他 App 的基础配置信息可在 lib/utils/getx.dart 文件内修改。

项目地址

Flutter 客户端

Laravel 服务器端

  • 码云
了解本专栏 订阅专栏 解锁全文 超级会员免费看
《Flutter 实战开发旅行社交手机APP》第二章 地图模块 2.1 Flutter 集成高德地图
geeksoarsky的博客
08-27 1047
Flutter 集成高德地图安装依赖KEY创建应用调试版签名发布版签名高德地图添加 jar 文件：添加权限修改配置按需引入高德定位配置截图版本提交 安装依赖 安装高德定位 Flutter 插件，高德地图 Flutter 插件。定位和地图是分开的，不要混淆。 amap_flutter_location: 2.0.0 amap_flutter_map: 2.0.2 KEY 创建应用 根据插件Readme得知，我们需要前往高德地图开放平台 分别申请 Android 端和 iOS 端的 key。 调试版
《Flutter 实战开发旅行社交手机APP》第一章 广场模块 1.4 收藏功能
geeksoarsky的博客
08-26 269
收藏功能视图层数据层API服务类状态管理逻辑层服务器端（选看）版本提交 收藏和点赞是一样的，服务器端逻辑和数据表映射只是字段名不一样，所以框架都是一样的，开发过程中只是把 thumb搜索替换成 collect，所以模块化后开发速度很快，读者可以类比理解。 视图层 封装的收藏按钮小部件 lib/widgets/like_button.dart import 'package:flutter/material.dart'; import 'package:flutter_locyin/utils/getx.da
《Flutter 实战开发旅行社交手机APP》第一章 广场模块 1.3 游记详情
geeksoarsky的博客
08-18 249
数据层 实体类 lib/data/model/dynamic_detail_entity.dart import 'package:flutter_locyin/generated/json/base/json_convert_content.dart'; import 'package:flutter_locyin/generated/json/base/json_field.dart'; class DynamicDetailEntity with JsonConvert<DynamicDet
travel-app-demo-flutter:基于现有设计的旅行应用程序的简单演示
03-20
旅游应用演示 现有设计中的简单旅行应用实现。 应用了一些概念： 图像定位； 无状态小部件； 有状态的小部件； 无限浏览量；
《Flutter 项目工程化》第三章 3.2 GetX 路由管理
geeksoarsky的博客
07-18 466
GetX 路由管理 路由管理 新建路由文件和路由表文件 mkdir lib/router cd lib/router touch router.dart router_map.dart router_map.dart 定义了命名路由表 import 'package:flutter_locyin/menu/about.dart'; import 'package:flutter_locyin/menu/language.dart'; import 'package:flutter_locyin/menu/
《Flutter 实战开发旅行社交手机APP》第一章 广场模块 1.1 游记列表
geeksoarsky的博客
08-18 475
视图层 列表视图，包括上拉加载，下拉刷新，骨架装载器、自定义AppBar 视图 第三方库 包括上拉加载、下拉刷新 easyrefresh，skeleton 骨架加载器和支持空安全的 swiper 轮播图。 flutter_easyrefresh: ^2.2.1 skeleton_text: ^3.0.0 flutter_swiper_null_safety: ^1.0.2 基本视图 lib/page/Dynamic/Dynamic.dart import 'package:flutter/material
《Flutter 实战开发旅行社交手机APP》第一章 广场模块 1.6 发表评论
geeksoarsky的博客
08-27 425
发表评论视图层数据层API服务类逻辑层演示 视图层 封装的弹出评论输入框方法，巧用 Get.bottomSheet。接收评论所属游记的 ID 、接收人 ID 和接收人昵称三个参数，其他页面调用CommentUtils类下的 popCommentTextField方法就可以从底部弹出评论框。 lib/utils/pop_comment_inputfield.dart import 'package:dio/dio.dart'; import 'package:flutter/material.dart'; i
《Flutter 实战开发旅行社交手机APP》第一章 广场模块 1.5 评论列表
geeksoarsky的博客
08-26 444
游记列表视图层基本视图子项视图数据层API实体类接口服务类状态管理逻辑层评论列表加载更多演示版本提交 视图层 基本视图 游记详情一篇中讲到 SliverToBoxAdapter 是一个加载普通 widget 的 Sliver 组件，如果是滑动的组件推荐使用 Sliver 滑动组件，因为评论是滚动列表，故视图要返回 SliverList() 小部件。 lib/page/Dynamic/dynamic_detail.dart @override Widget build(BuildContext conte
基于Flutter商用APP制作的10个经验教训
读芯术的博客
08-26 908
全文共4593字，预计学习时长12分钟图源：unsplash近两年来，我们花费了大量时间在Flutter框架上开发了10个商用APP，本文将分享我们的收获。本文将帮助你了解：·...
《Flutter 项目工程化》第三章 3.3 GetX 国际化
geeksoarsky的博客
07-18 1018
3.3 GetX 国际化切换语言视图share_preferences 持久化存储Getx 状态管理切换语言测试版本提交 首先用户打开抽屉，再点击设置按钮跳转到设置页面，随后选择切换语言或主题。 切换语言视图 设置页面 settings.dart 代码如下： import 'package:flutter/material.dart'; import 'package:get/get.dart'; import 'language.dart'; class SettingsPage extends Sta
《Flutter 项目工程化》第五章 5.4 隐私声明
geeksoarsky的博客
07-19 851
隐私声明持久化存储状态管理视图演示版本提交 持久化存储 lib/utils/sputils.dart ///隐私 static void savePrivacy() { _spf!.setBool('key_privacy', true); } static void clearPrivacy() { _spf!.remove('key_privacy'); } static bool? getPrivacy() { return _spf!.getBool('key_privacy'); }
《Flutter 项目工程化》第四章 4.2 登录注册
geeksoarsky的博客
07-19 553
4.2 登录注册 手机号登录注册 客户端只需要提供手机号和验证码，服务端端检测是否注册，没注册则自动注册，故登录注册客户端实现起来只需要一个页面。 新建用户文件夹和用户注册文件 mkdir lib/page/User touch lib/page/User/login.dart 验证码输入框插件 flutter_verification_box 依赖库 dependencies: · · · flutter_spinkit: ^5.0.0 flutter_verification_b
《Flutter 项目工程化》第四章 4.1二次封装 Dio
geeksoarsky的博客
07-19 544
第四章 用户相关 整个 App 是以用户为中心的，用户必须保持登录状态才能正常使用App，否则跳转到用户登录页。这是一个前后端完全分离的 App ,我已经搭建好了 Laravel API 服务器，使用 JWT 鉴权，即使用 Bear Token 确定用户身份，这就要求我们 App 在发起请求时附带 Token 值，如果 Token 过期但还在刷新周期内，则需要客户端自动刷新 Token , 我们将在此章节完成这些功能。 4.1 Dio 网络请求 安装 Dio 请安装好 Post Man 进行接口调试。
《Flutter 项目工程化》序言
geeksoarsky的博客
07-18 493
序言 Flutter 项目工程化 《Flutter 项目工程化》一书是Flutter 快速开发实战专栏的上册，笔者以快速命名是因为 “完成要比完美更重要”，“快速推进，打破常规”，“天下武功，唯快不破”，对于如今迅猛发展的互联网，也是如此。要知道，用户多变，所以唯一能够抓住机会的办法就是快。 在互联网行业，要成就一个项目，idea 一文不值，不仅是在中国，在哪都一样。笔者希望读者通过《Flutter 项目工程化》这本书能把你的想法在技术层面上来讲从不可行到可行，提高你的执行力，最终做成一款好的APP。 由于
《Flutter 实战开发旅行社交手机APP》第二章 地图模块 2.2 发布动态
geeksoarsky的博客
08-30 412
发布动态演示安装依赖集成游记发布页发布游记接口服务类逻辑处理 演示 难点在于选择图片视频等资源，经调研，wechat_assets_picker 最好用，而且经过实践成功将 SDK 集成到了我们项目中。 安装依赖 wechat_assets_picker wechat_assets_picker: ^6.0.5 wechat_camera_picker: ^2.3.1 extended_image: ^4.1.0 package_info_plus: ^1.0.6 path: ^1
《Flutter 项目工程化》第一章 起步
geeksoarsky的博客
07-18 385
第一章 起步1.1 开发环境1.2 新建项目Android Studio (图形化界面)Git Bash 或 CMD (命令行界面)1.3 版本控制用户信息检查配置信息提交代码版本回退1.4 配置信息pubspec.yaml 1.1 开发环境 对于开发，我们使用集成开发环境（IDE）– 使开发和测试变得轻松快捷。目前有2种流行的IDE： VS Code –轻便，快速，你想要 IDE 拥有的功能它全都有 ！ Android Studio –使用设备上的Android Studio，您只需安装 Flutter
《Flutter 项目工程化》第二章 2.5 返回桌面
geeksoarsky的博客
07-18 345
双击退出 用户双击返回键才退出应用，防止用户误触。 WillPopScope 用于处理是否离开当前页面，我们在整个 App 视图的根位置也就是 index.dart 的 Build 方法内使用 WillPopScope 包裹。 新增目录 /lib/utils 用于存放封装的功能插件，包括我们需要 oktoast 用于文字提示的插件。 mkdir lib/utils touch lib/utils/toast.dart 添加插件，不要忘记执行 flutter pub get oktoast: ^3.0.0
《Flutter 项目工程化》第二章 2.3 上报错误
geeksoarsky的博客
07-18 338
上报错误 众所周知，软件项目的交付是一个复杂的过程，任何原因都有可能导致交付的失败。很多时候经常遇到的一个现象是，应用在开发测试时没有任何异常，但一旦上线就问题频出。出现这些异常，可能是因为不充分的机型适配或者用户糟糕的网络状况造成的，也可能是Flutter框架自身缺陷造成的，甚至是操作系统底层的问题。 而处理此类异常的最佳方式是捕获用户的异常信息，将异常现场保存起来并上传至服务器，然后通过分析异常上下文来定位引起异常的原因，并最终解决此类问题。 目前为止，我们已经对应用中出现的所有未处理异常进行了捕获，不
仿制单读App：Flutter实战开发技巧
首先，了解Flutter的基本概念对于开发高仿单读App至关重要。Flutter使用了“Widget”作为其UI的基本构建块，一个Widget可以是一个布局、一个按钮、一个文本框等等。Flutter通过将这些Widgets组合起来，形成丰富的...
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

geeksoarsky

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值