tag: Flutter

原文地址：13 Reasons Why you should choose/ consider to move to Flutter 13 个你应该转向 Dart 并且选择或者学习利用 Flutter 去开发你的下一个 app 的理由。 如今的企业需要在选择移动技术时做出关键选择。他们不断的测试和评估技术，以求不论用户使用什么移动设备或操作系统都能有强大的数字体验。企业如果不能提供易于使用的产品和服务，那么无论使用何种渠道或设备，都有可能落后于竞争对手。 目前面临的挑战便是跨平台应用的开发存在问题。在某些情况下，尽管开发人员尽了最大努力，其用户体验仍然落后于原生 app 。近年来，我们看到了各种移动框架的出现，如 React Native、Xamarin 和 AngularJS ，它们帮助我们更容易地产生较好地数字体验。最近我们看到一个新玩家加入了这场游戏——谷歌的 Flutter。 从内部来看，Flutter 看起来像是谷歌各种技术和概念的大杂烩，然而却产生一个不可思议的强大的移动框架。它是基于 Dart (谷歌的内部编程语言)开发的，它可以让 Flutter 访问 Skia 图形库，而这正是 Chrome 浏览器所使用的。除此之外，Flutter 与谷歌的 Material Design 规范紧密结合；其中最著名的便是 Android 用户已经熟知的“卡片图案”。 让我们看看 13 个选择 Flutter 作为你的开发环境甚至可以选择它开始你的职业生涯的理由， 1. Flutter 克服了传统跨平台的限制 长期以来，创建真正的跨平台方法一直是技术顾问的苦恼所在，他们厌倦了为同一产品制作多个版本。但是，实际上，跨平台应用的用户体验通常落后于原生 app，因为你经常需要即时编译 JavaScript 来构建 UI 体验。 使用 Flutter，你不仅可以拥有“一次编写”的优势，还可以创建高性能的“原生”体验，因为 Flutter 应用程序是提前编译出机器可执行的二进制文件。它克服了其他跨平台方法中的一些常见问题。...

前言 最近在利用flutter制作校园软件，需要制作一个登录界面，所以要用到Flutter中的一些表单控件，今天就来总结下flutter中的一些表单控件。 本文参考： 《Flutter 基础组件-表单》 FormState class Form Class TextField class TextFormField ...

为了让你的 App 更美观，主题切换已经是一个必不可少的功能了，但如果想在传统的 Android 和 iOS 上分别适配不同的主题相当繁琐。但这一切，在 Flutter 中都非常容易实现。今天我们就来看看，如何在 Flutter 中给你的 App 添加换肤功能。我们要实现的效果如下： 添加依赖 在该案例中，我使用到了 provider 和 flustars 两个库，简单介绍一下这两个库： provider 官方推荐的状态管理库，相比其他状态管理库使用起来比较方便。 状态管理：通俗的讲，当我们想在多个页面（组件/Widget）之间共享状态（数据），或者一个页面（组件/Widget）中的多个子组件之间共享状态（数据），这个时候我们就可以用 Flutter 中的状态管理来管理统一的状态（数据），实现不同组件直接的传值和数据共享。 flustars 号称“Flutter 全网最全常用工具类”，其中包括了SpUtil、ScreenUtil、TimelineUtil等常见工具类，这里我们要使用的是SpUtil这个部分，用于存储用户所选择的主题信息。 以上就是关于我们使用的两个第三方库的介绍，如果想要使用，我们需要在pubspec.yaml文件中添加如下内容： provider:^4.0.5flustars:^0.2.6+1准备工作做好了，接下来我们就开始编码吧。 添加主题样式 我们需要先想好自己所需要切换的主题样式列表，如果觉得麻烦的可以直接用下面的内容： Map<String, Color> themeColorMap = { 'gray': Colors.grey, 'blue': Colors.blue, 'blueAccent': Colors.blueAccent, 'cyan': Colors.cyan, 'deepPurple': Colors.purple, 'deepPurpleAccent': Colors.deepPurpleAccent, 'deepOrange': Colors.orange, 'green': Colors.green, 'indigo': Colors.indigo, 'indigoAccent': Colors.indigoAccent, 'orange': Colors.orange, 'purple': Colors.purple, 'pink': Colors.pink, 'red': Colors.red, 'teal': Colors.teal, 'black': Colors....

前言 之前有做一个工具集的微信小程序「开挂 Lite」，但是由于小程序自身限制，没有办法实现下载文件的功能，只能把下载链接解析出来。而且受限于微信平台，小程序的审核是一件很麻烦的事情，因此有了将其 APP 化的想法。 自从去年 Flutter 横空出世后，我便一直关注它的发展，时隔一年后重新拾起，发现它的生态已经初具规模，于是决定采用 Flutter 重做一个「开挂 Lite」。后期我也会不定时更新一些和 Flutter 有关的文章，希望大家可以多多支持。本文记录的便是我利用 Flutter 实现文件下载功能的过程。 完整源码可在公众号：「01 二进制」后台回复：「Flutter 文件下载」获取 开始 我们先看一下实现的效果： iOS Android 本 demo 的实现效果非常简单，就是点击一个按钮，然后下载文件，完成后提示用户是否打开文件。 准备工作 在本 demo 中使用的 IDE 为 Android Studio，同时使用到了以下几个库： flutter_downloader: ^1.1.7 path_provider: 1.1.2 permission_handler: ^3.1.0 progress_dialog: ^1.1.0+1 toast: ^0.1.4 我们先新建一个空项目，然后将上述依赖添加到项目的pubspec.yaml文件，添加位置如下： 接下来我们可以在 Terminal 中输入flutter packages get或者点击 IDE 左上角的Packages get字样安装依赖。 然后将初始项目中的多余代码删除，并在中间添加一个按钮。 body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ RaisedButton( child: Text("点我下载文件"), onPressed: () { // 执行下载操作 _doDownloadOperation(); }, ), ], ), ), 其中_doDownloadOperation()便是我们执行下载操作的方法，至此，前期准备工作结束。...

前言 做过android开发的人都知道，可以利用SharedPreferences这个轻量级的存储类来保存键值对信息，在Flutter中，我们可以使用shared_preferences库来同时支持Android和ios平台。 参考： 《Flutter中的本地存储》 《Flutter知识点:数据存储之SharedPreferences》 shared_preferences 0.4.2 使用介绍 在pubspec.yaml文件中添加依赖 shared_preferences: "^0.4.2" 添加的位置如图所示： ...

本文翻译自Flutter Could Be the Best Solution for Mobile App Development，如有错误，望批评指正 众所周知，Java 和 Objective-C 是开发高质量 Android 和 iOS App 的首选。大多数开发人员通过这些编程语言制作足够健壮的 APP。 然而，自从 2017 年 5 月 Flutter 横空出世后，几乎所有移动应用开发公司和个人开发者都转向了这种先进的移动应用开发技术。 Flutter 是谷歌的用户界（UI）工具包，从官网介绍中我们可以得知，它可以通过统一的代码为移动端、web 端 和桌面端设计出漂亮的、具有原生 App 特性的应用程序。 Flutter 的引入给移动应用开发行业带来了诸多好处，其中之一就是它简化了跨平台应用的开发过程。 利用 Flutter 开发应用的好处 许多开发者声称他们发现 Flutter 是最有前途的平台。 此外，你现在可以找到许多可靠的公司，他们正在利用 Flutter 为企业提供超现代化、多平台的移动应用程序。 我们无法预测未来，但 Flutter 已经成为一个强大的、可以帮助开发者为 Android 和 iOS 开发移动应用的平台。 Flutter 与一个响应式的现代框架相结合，以便允许开发者可以在 Android 和 iOS 平台上构建令人印象深刻的动画、共享代码库和视图。 上述好处已经证明 Flutter 将会在行业内存活很长时间。但这些并不足以说明 Flutter 的前景和未来是光明的。 下面这些内容你应该了解下，这些是 Flutter 的其他优秀特性。 Flutter 基于 Dart 开发 谷歌开发的 Dart 语言是开发 Flutter 应用的唯一选择。Dart 是一种完全不同的编程语言；它与 Java 惟一相似的地方是语法。 Flutter 强大的编程语言也支持异步操作，这使得开发者可以更轻松地进行应用开发。 另外，在异步操作的支持下，开发人员可以执行那些需要花费时间才能完成的代码，而不会阻塞其他正在运行的代码。...

Flutter Challenges 是一项尝试利用 Flutter 重新创建特定的应用程序 UI 或设计的挑战。 此次挑战将尝试 Whatsapp Android 应用程序的主界面。 请注意将重点放在 UI 上而不是实际获取消息。 开始 WhatsApp 的主界面包括： 一个带有搜索操作和菜单的 AppBar 在 AppBar 的底部有四个标签 一个用于拍照的相机标签 一个用于多种用途的 FloatingActionButton 一个“聊天”标签可查看所有对话 一个“状态”选项卡可查看所有状态 一个“打电话”选项卡可查看所有的通话记录 ...

介绍 Flutter GridView 几乎与 ListView 相同， 只是它提供了与 ListView 单向视图的 2D 视图比较。 同时它也是移动应用开发中非常受欢迎的小部件。 如果你不相信我， 那就举个例子， 打开你手机中的任何一个电子商务应用， 它肯定是依赖于 ListView 或 GridView 来显示数据的。 Amazon 移动应用程序利用网格显示数据 另一个是 PayTM， 它是印度流行的在线钱包服务应用之一， 它广泛使用网格布局来显示不同的产品 ...

概要 这是创建 Slidable 小部件背后的故事（点击这里）。 他是一个当您向左侧或右侧滑动时， 可以在列表项上添加上下文操作的小部件。 这一切是如何开始的呢...

通过我的讲座和研讨会在与很多学生和开发人员亲自交流后， 我意识到他们中很多人都对 Flutter 和应用程序开发有共同的问题， 甚至还有误解。 因此我决定去写一篇文章来解释这些普遍的疑惑。 注意， 这篇文章旨在解释一些问题， 而不是对每个方面的详细表述。 为简洁起见， 我可能没有涉及到一些例外情况。 请注意， Flutter 本身也有一个针对各种背景下的常问问题页面 flutter.io， 在这里我将更多地关注我经常看到的问题。 虽然其中一些也包含在 Flutter 常见问题解答中， 但是我还是尝试着去给出我的观点。 布局文件在哪里？ / 为什么 Flutter 没有布局文件？ 在 Android 框架中， 我们将 Activity 分为布局和代码。 因此， 我们需要引用视图以在 Java 中使用它们。 （当然 Kotlin 可以避免这种情况。 ）布局文件本身用 XML 编写， 包含 Views 和 ViewGroups。 Flutter 使用一种全新的方法， 而不是视图， 使用 Widget。 在 Android 中， View 就是布局的一个组件， 但在 Flutter 中， Widget 几乎就是一切。 从按钮到布局结构， 所有的这些都是一个 Widget。 他在这里的优势是可定制性。 想象一下 Android 中的一个按钮。 它具有文本等属性， 可让你向按钮添加文本。 但 Flutter 中的按钮不会将标题作为字符串， 而是另一个 widget。 这意味着， 在按钮内部， 您可以拥有文本， 图像， 图标以及您可以想象的任何内容， 并且不会破坏布局约束。 这也让你可以很容易地制作自定义 Widget， 而在 Android 中制作自定义 view 是一件相当困难的事情。 ...