咖啡花园

专注咖啡一百年!
103
原创
0
转载
0
译文
16
评论
94198
访问

我的博客文章

2017
15

Flutter基础—你好,Flutter!

什么是FlutterFlutter是一个移动应用程序的软件开发工具包(SDK),用一个代码库构建高性能、高保真的iOS和Android应用程序。目标是使开发人员能够为Android和iOS提供自然的高质量的应用,在滚动行为、排版、图标等方面实现零差异。学习Flutter不需要Android或iOS的开发经验,因为Flutter程序使用Dart语言编写,如果您使用过Java或JavaScript等语言

(875)(0)
2017
22

Flutter实战一Flutter聊天应用(十四)

优化输入体验在进行下一步之前,我们先优化一下注册的体验: 正在输入注册信息时,点击屏幕空白部分,清除当前文本输入框的焦点,同时收起键盘。 正在输入注册信息时,直接收起键盘,再点击空白部分,清除当前文本输入框的焦点。 不在用户输入时直接判断并显示错误提示信息,而是在用户输入完成以及点击加入按钮时判断并显示错误提示信息。 在每一个输入框下方都显示帮助信息,提示用户输入什么内容。 首先我们把SignUpS

(316)(0)
2017
11

Flutter进阶—Firebase数据库实例

Flutter目前无法使用平台的数据库,因此我们暂时使用Firebase实时数据库。首先我们需要为项目配置Firebase,具体配置方法可以在《Flutter实战一Flutter聊天应用(五)》查看,因为我们只需要使用Firebase数据库,所以pubspec.yaml文件的内容需要修改一下。name: talk_casually description: A new flutter project

(319)(0)
2017
28

Flutter实战一Flutter聊天应用(十三)

提交用户的注册信息我们现需要将用户的注册信息保存到Firebase实时数据库,在Firebase控制台中,更改Firebase实时数据库的安全规则,选择“Database > 规则”,规则如下所示:{ "rules": { "users":{ ".read": true, ".write": true }, "messages": {

(349)(0)
2017
27

Flutter实战一Flutter聊天应用(十二)

由于当前项目的账号是直接使用Google账户,iOS系统问题不大,但是Android系统如果没有Google框架,则无法使用我们的应用程序。因此,我们需要创建自己的账户数据。在这篇文章中,我们会创建一个登陆屏幕和注册屏幕,两个屏幕的UI如下图所示:关于UI布局的内容不是这篇文章的重点,所以不会具体描述,只会展示代码并陈述布局思路。有关UI布局的内容可以查看《Flutter进阶—构建布局实例》、《Fl

(442)(0)
2017
21

Flutter实战一Flutter聊天应用(十一)

我们的应用程序现在可以点击查看图像,但还没有实现查看时放大、缩小与移动图像。要实现这个功能,需要监听用户在图像上的操作,并调用相应的回调处理用户操作。我们先将Transform控件从_ImageZoomableState的build方法中拆分出来。在_ImageZoomableState类中添加_drawImage方法。class _ImageZoomableState extends State<

(294)(0)
2017
20

Flutter实战一Flutter聊天应用(十)

首先,我们要修复一下之前几篇文章中存在的缺陷。在发送超过两行的消息时,屏幕上显示的消息不会自动换行,会超出最大宽度。我们可以通过将Text包装在Container控件中,再添加一个width属性,使其获得一个不超出屏幕大小的宽度。class ChatMessage extends StatelessWidget { //... @override Widget build(BuildCo

(359)(0)
2017
14

Flutter实战一Flutter聊天应用(九)

在这篇文章中,我们将允许用户在聊天消息中发送图像,从设备检索图像文件,并将文本和图像数据存储在Google云端存储Bucket中。由于我们使用Firebase云储存,应用程序将变得更加健壮和可扩展。它能够在上传和下载期间处理网络中断,安全地存储数据,并在用户群扩展时保持相同的性能。要将数据(如文本和照片)从移动设备上传到云端,我们需要使用firebase_storage插件。在main.dart文件

(276)(0)
2017
13

Flutter实战一Flutter聊天应用(八)

现在,我们将使用Firebase服务将聊天消息数据存储并同步到公用共享实时数据库上的云。我们需要使用firebase_database插件,用于在Firebase数据库存储和同步消息,还需要使用firebase_animated_list插件,用于增强聊天消息列表。在main.dart文件中,确保导入相应的包。import 'package:firebase_database/firebase_da

(479)(0)
2017
12

Flutter实战一Flutter聊天应用(七)

使用Firebase控制台的分析(Analytics)功能可以帮助我们了解用户是如何使用Flutter应用程序。我们将启用捕获预定义的事件,调整应用程序以收集登录事件和发送消息的指标。数据捕获后,我们将通过Firebase控制台在仪表板中查看。要使用Firebase Analytics收集用户的数据,我们需要firebase_analytics插件。在main.dart文件中,确保导入相应的包。im

(308)(0)
2017
09

Flutter实战一Flutter聊天应用(六)

我们将使用Google登录来验证应用程序的用户。Google登录功能可让用户使用其Google帐户(与Gmail、Play、照片和其他Google服务所使用的帐户相同的帐户)进行安全登录。我们还可以根据与用户的Google帐户相关联的个人资料和身份信息,个性化用户体验。用户登录后,我们可以使用个人资料照片个性化聊天消息头像。要添加对Google登录的支持,我们将使用google_sign_in插件,

(2111)(0)
2017
08

Flutter实战一Flutter聊天应用(五)

我们的应用程序现在已经有了一个好看的UI,但是我们还没有一个后端。所以我们要买一个云服务器,然后再安装数据库?当然不是!我们可以使用Firebase平台作为后端,那么Firebase是什么呢?Firebase一开始只是一个移动后端即服务平台,自2014年10月被Google收购后,被谷歌改造成了针对移动开发(iOS和Android)和Web开发的一个完整后端解决方案,2016年谷歌在I/O大会上推出

(452)(0)
2017
07

Flutter实战一Flutter聊天应用(四)

首先,我要对上一篇文章进行一点补充,在添加动画效果后,需要重新启动应用程序。使用重新启动而不是热重新加载,因为需要清除任何没有动画控制器的现有消息。目前在我们的应用程序中,即使输入字段中没有文本,也会启用“发送”按钮,我们可以根据该字段是否包含要发送的文本来决定是否启用发送按钮,并更改按钮的外观。定义_isComposing,一个私有成员变量,只要用户在输入字段中键入,该变量就是true。class

(402)(0)
2017
07

Flutter实战一Flutter聊天应用(三)

我们可以向控件添加动画效果,使应用程序的用户体验更加流畅和直观。在这篇文章中,我们将在聊天消息列表中添加基本动画效果。当用户发送新消息时,我们不要将其简单地显示在消息列表中,我们将从列表底部垂直放置消息。Flutter中的动画被封装为包含类型值和状态(如前进、后退、完成和关闭)的Animation对象,我们可以将动画对象附加到控件或监听动画对象的更改。基于对动画对象属性的更改,框架可以修改窗口控件的

(427)(0)
2017
06

Flutter实战一Flutter聊天应用(二)

随着项目的代码越来越多,我们会碰到各种问题,所以我们需要学习一下如何使用IntelliJ定位并解决问题。我们可以在IntelliJ IDE上调试在模拟器/仿真器或真机设备上运行的Flutter应用程序,使用IntelliJ编辑器可以: 选择一个设备或模拟器来调试应用程序。 查看控制台消息。 在代码中设置断点。 在运行时检查变量并评估表达式。 IntelliJ编辑器在您的应用程序运行时会显示系统日志,

(1494)(2)
2017
05

Flutter实战一Flutter聊天应用(一)

不知不觉,进阶的教程已经写了几十篇了,通过前面的学习,大家已经打下了良好的基础,接下来我们就开始进行项目实战吧!我们现在要写一个叫“谈天说地”的应用程序,这是一个简单、可扩展的聊天应用程序,能实时显示信息,用户可以输入文本信息,也可以通过按返回键或发送图标发送,还可以在iOS和Android设备上运行。首先我们要在IntelliJ编辑器中启动一个新的Flutter项目: 启动IntelliJ IDE

(449)(0)
104条 共7页1 2 3 4 5 ... 下一页 尾页
img

hekaiyou

等级:

排名:第19692名

博客专栏
文章分类
文章存档
阅读排行
评论排行
推荐文章
最新评论
img