分类：Flutter

2021
07-08

flutter直接上传文件到阿里云oss

目录代码实现调用上传的例子另一种方法准备工作:给一个工具类代码实现以下是我写的一个上传oss的类，只需要替换ossAccessKeyId，ossAccessKeySecret，bucket，url，expiration这几个参数就可以直接实现上传import'dart:convert';import'dart:io';import'dart:math';import'package:crypto/crypto.dart';import'package:dio/dio.dart';classUploadOss{staticStringossAccessKeyId='ossAccessKeyId';staticStrin... 继续阅读 >

2021
07-08

Flutter 如何设置App的主色调与字体

Flutter的主题色和字体可以在MaterialApp中设置，即在main.dart的入口返回的MaterialApp组件统一设置全局的主色调和字体。如下面的代码所示：classMyAppextendsStatelessWidget{@overrideWidgetbuild(BuildContextcontext){returnMaterialApp(title:'App框架',theme:ThemeData(primaryColor:Colors.blue,accentColor:Colors.blue[600],textTheme:TextTheme(... 继续阅读 >

2021
07-06

Flutter 容器盒子模型的使用示例

目录样例代码在讲Flutter的盒子模型前，先看看HTML中的盒子模型。如下图所示，一个页面元素包括了与父级容器的外边距（margin），自身内容与边框的内边距（padding）。外边距和内边距都可以通过LTRB（左、上、右、下）单独设定四个方向的大小。Flutter的盒子模型和HTML的是一样的，而通用的容器Container就相当于是一个通用的容器，和HTML的div标签一样。如果要控制一个元素的尺寸，外边距，内边距和边框，最通用的... 继续阅读 >

2021
07-06

Flutter 构建一个常用的页面框架

目录图标准备BottomNavigationBar简介构建项目页面结构简化入口代码复用最终实现的结果如上图所示，顶部共用一个导航栏，底部有四个图标导航，点击对应的图标跳转到对应的页面。图标准备本次例程需要4个图标，2种颜色，可以从iconfont中找到自己需要的图标下载不同的颜色使用。然后在pubspec.yaml中的assets指定素材所在目录。需要注意的是如果是png文件直接指定整个目录即可，但如果是jpg格式，则需要同时指定文件名及... 继续阅读 >

2021
07-04

如何使用Flutter发布安卓应用

目录设置应用的名称，包名、应用图标和启动替换应用图标替换启动页设置访问权限配置版本发布参数生成应用签名修改配置文件打包注意事项设置应用的名称，包名、应用图标和启动安卓的应用资源配置在main/AndroidManifest.xml中设置，文件内容如下：<manifestxmlns:android="http://schemas.android.com/apk/res/android"package="com.example.gesture_demo"><!--io.flutter.app.FlutterApplicationisanandroid.app.Appl... 继续阅读 >

2021
07-01

Flutter 如何正确显示SnackBar

目录简介官方示例错误示例解决方法一：Scaffold的子组件通过Builder构建解决方法二：使用GlobalKey存储ScaffoldStateFlutter学习Github代码仓库简介官方API文档Scaffold的of方法说明有说明调用Scaffold.of方法是在Scallfold的子组件的Build方法中，也就是不能直接在构建Scaffold的build方法里调用，否则会抛异常。TypicalusageoftheScaffold.offunctionistocallitfromwithinthebuildmethodofachildofaScaffold... 继续阅读 >

2021
07-01

Flutter 创建私有公共插件的步骤

目录创建package创建演示代码（可选）plugins工程配置本地引入编写Example发布到pub（公有资源）创建package通过以下命令行创建一个packagefluttercreate--template=packageplugins创建演示代码（可选）在test文件中，对存dart库进行单元测试，但是在涉及页面等功能，需要有一个demo，需要在工程内部创建一个demo。如果要发布到公有pub上，需要写上示例代码，方便别人知道如何使用。cdpluginsfluttercreateexample得到的目录... 继续阅读 >

2021
07-01

Flutter 常用插件汇总

目录DIO网络请求框架url_launcher系统应用跳转flutter_easyrefresh上下拉刷新flutter_swiper轮播组件catcher异常捕获cached_network_image网络图片加载缓存shared_preferences本地离线键值对缓存image_picker和multi_image_pikcer图片选择器marquee滚动文字组件sqflite本地数据库访问DIO网络请求框架提起Flutter的网络框架，就不得不提DIO，而且令人自豪的是DIO是国人开发的哦！DIO作为一个网络框架实现了全部的网络... 继续阅读 >

2021
07-01

Flutter实现抖音点赞效果

目录效果图如下：分析效果思路实现1.对外公开的参数2.声明需要的对象3.手势的处理4.动画小红心的布局5.小红心动效使用效果源码效果图如下：分析效果1.整个控件可以点击，控件可以铺满屏幕，点赞效果在子部件之上。2.可以实现单击3.连击的情况下，呈现红心的动画效果，并且有红心叠加4.动画的位置会随着手指的点击位置改变思路1.通过GestureDetector来监控手势，在手指抬起的时候记录时间毫秒值，手指再次按下时，通过获取到毫秒值... 继续阅读 >

2021
06-19

Flutter数据库的使用方法

说明Flutter原生是没有支持数据库操作的，它使用SQLlit插件来使应用具有使用数据库的能力。其实就是Flutter通过插件来与原生系统沟通，来进行数据库操作。平台支持FLutter的SQLite插件支持IOS，安卓，和MacOS平台如果要对Linux/Windows/DartVM进行支持请使用sqflite_common_ffi不支持web平台数据库操作在安卓或ios的后台执行使用案例notepad_sqflite可以在iOS/Android/Windows/linux/Mac上运行的简单... 继续阅读 >

2021
05-25

Flutter页面传值的几种方式

今天来聊聊Flutter页面传值的几种方式：InheritWidgetNotificationEventbus（当前Flutter版本：2.0.4）InheritWidget如果看过Provider的源码的同学都知道，Provider跨组件传值的原理就是根据系统提供的InheritWidget实现的，让我们来看一下这个组件。InheritWidget是一个抽象类，我们写一个保存用户信息的类UserInfoInheritWidget继承于InheritWidget：classUserInfoInheritWidgetextendsInheritedWidget{UserIn... 继续阅读 >

2021
05-23

Flutter仿钉钉考勤日历的示例代码

本文主要介绍了Flutter仿钉钉考勤日历的示例代码，分享给大家，具体如下：效果原型开发1.使用//考勤日历DatePickerDialog(initialDate:DateTime.now(),firstDate:DateTime(2020),lastDate:DateTime(2030),onDateChanged:onDateChanged,//0：无状态，1：正常考勤2：异常考情，迟到，早退，//若不满一个月，... 继续阅读 >

2021
05-19

Flutter实现二维码扫描

本文实例为大家分享了Flutter实现二维码扫描的具体代码，供大家参考，具体内容如下配置安卓访问权限:1.文件配置路径android\app\src\main\AndroidManifest.xml2.添加代码：<uses-permissionandroid:name="android.permission.CAMERA"/><uses-permissionandroid:name="android.permission.WRITE_EXTERNAL_STORAGE"/><uses-permissionandroid:name="android.permission.READ_EXTERNAL_STORAGE"/>在pubspec.yaml文件中引入... 继续阅读 >

2021
05-02

Flutter Http网络请求实现详解

Http网络请求是一门开发语言里比较常用和重要的功能，主要用于资源访问、接口数据请求和提交、上传下载文件等等操作，Http请求方式主要有：GET、POST、HEAD、PUT、DELETE、TRACE、CONNECT、OPTIONS。本文主要GET和POST这两种常用请求在Flutter中的用法，其中对POST将进行着重讲解。Flutter的Http网络请求的实现主要分为三种：io.dart里的HttpClient实现、Dart原生http请求库实现、第三方库实现。后面将会给大家详细讲解这几种区别... 继续阅读 >

2021
04-27

Android原生项目集成Flutter解决方案

了解一下如何在Android原生项目中集成Flutter生成配置在原生项目根目录执行命令fluttercreate-tmodule--org{package_name}{module_name}//此处module_name的命令遵循Android子module的命名即可。不能有中划线。//比如,fluttercreate-tmodule--orgcom.engineer.mini.flutterflutter_sub//此处module_name的命令遵循Android子module的命名即可。不能有中划线。//比如,fluttercreate-tmod... 继续阅读 >

2021
04-09

Flutter网络请求库DIO的基本使用

1.导入dio包目前dio库的最新版本是3.0.1,同使用其他三方库一样，Flutter中使用dio库同样需要配置pubspec.yaml文件。dependencies:flutter:sdk:flutterdio:^3.0.102.导入并创建实例dio包引入成功之后就可以创建dio实例了，一个实例可以发起多个请求，APP中如果只有一个数据源的情况下就可以考虑将dio实例创建成单例模式，这样可以节省系统资源，减少不必要的开销。//htpp.dartimport'package:dio/dio.dart';vardio=... 继续阅读 >