![](https://img-blog.csdnimg.cn/20201014180756913.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Flutter
文章平均质量分 58
Rowrey
这个作者很懒,什么都没留下…
展开
-
flutter实战项目13 flutter仿淘宝git代码库
1原创 2020-11-02 22:15:46 · 409 阅读 · 0 评论 -
flutter实战项目12 学习成果
1,新建购物车状态cart_provide.cartimport 'package:flutter/material.dart';import 'package:shared_preferences/shared_preferences.dart';import 'dart:convert';class CartProvide with ChangeNotifier { String cartString = "[]"; _save(goodsId,goodsName,count,pric原创 2020-11-02 21:10:27 · 81 阅读 · 0 评论 -
flutter实战项目11状态持久化之shared_preferences插件
页面推出之后 或者大写R刷新之后 亦或者重新运行添加到页面上的静态值会一直存在测试案例import "package:shared_preferences/shared_preferences.dart";class ShoppingCartPage extends StatefulWidget{ _ShoppingCartPageState createState() => _ShoppingCartPageState();}class _ShoppingCartPageStat原创 2020-10-30 22:42:41 · 180 阅读 · 0 评论 -
flutter实战项目10 加载HTML flutter_html插件
import 'package:flutter_html/flutter_html.dart'; returnContainer( child: Html( data: "<div>HTML</div>", ), );原创 2020-10-30 22:09:43 · 435 阅读 · 0 评论 -
flutter实战项目09 自定义TabBar
import 'package:flutter/material.dart';class DetailInfo extends StatefulWidget { @override _DetailInfoState createState() => _DetailInfoState();}class _DetailInfoState extends State<DetailInfo> with SingleTickerProviderStateMixin{ TabCo原创 2020-10-26 22:43:34 · 207 阅读 · 0 评论 -
flutter实战项目08 fluro路由
1,在ymal文件中引入 fluro: “^1.6.3”;2,在pages文件夹下创建跳转页面例:商品详情页import 'package:flutter/material.dart';class DetailPage extends StatelessWidget { final String goodsId;//接收商品id DetailPage(this.goodsId); @override Widget build(BuildContext context) { r原创 2020-10-11 10:38:07 · 237 阅读 · 0 评论 -
flutter实战项目07 真机调试
一,手机设备准备1、使用数据线(非充电线)连接电脑2、设置-系统-关于手机-EMUI版本,连续点击7次,打开开发人员选项3、将USB调试打开二,环境变量1,设置环境变量ANDROID_HOME值为安卓sdk路径:例如C:\Users\Administrator\AppData\Local\Android\Sdk可以在android studio里面找到这个路径2,添加path路径%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools...原创 2020-09-25 21:03:52 · 225 阅读 · 0 评论 -
flutter实战项目06 项目中的一些排版布局
代码示例分类主要组件GridViewclass TopNavigator extends StatelessWidget{ final List navGavigator; TopNavigator({Key key,this.navGavigator}):super(key:key); Widget _gridViewItemUI(BuildContext context,item,index){ return InkWell( onTap: (){原创 2020-08-09 18:44:19 · 361 阅读 · 0 评论 -
flutter实战项目05 屏幕适配与轮播
屏幕适配flutter_screenutil//1引入包import 'package:flutter_screenutil/flutter_screenutil.dart';//2初始化尺寸ScreenUtil.instance = ScreenUtil(width: 755,height: 1334,allowFontScaling: true)..init(context);//3设置尺寸ScreenUtil().setWidth(1125)轮播flutter_swiperimpor原创 2020-08-09 13:31:44 · 144 阅读 · 0 评论 -
flutter实战项目04 保持页面状态和下拉刷新插件
Flutter为了节约内存不会保存widget状态,widget都是零时变量。当我们切换tab的时候就会重新加载创建。使用AutomaticKeepAliveClientMixin保持状态class _HomePageState extends State<HomePage> with AutomaticKeepAliveClientMixin{ @override bool get wantKeepAlive => true; ... }...原创 2020-08-09 10:58:46 · 210 阅读 · 0 评论 -
flutter实战项目03 dio之异步请求
线上mock数据模拟https://www.fastmock.site/#/数据示例{ "status": 200, "data": { "slides": [ { "image": "https://img.alicdn.com/imgextra/i1/164/O1CN01ndTkD61D59ZKKyjDr_!!164-0-luban.jpg" }, { "image": "https://img.alicdn.co原创 2020-08-09 09:51:42 · 892 阅读 · 0 评论 -
flutter实战项目02 状态管理
provide/provide.dartimport 'package:flutter/material.dart';class CurrentIndexProvide with ChangeNotifier{ int currentIndex = 0; changeIndex(int newIndex){ currentIndex = newIndex; notifyListeners(); }}index_page.dartimport "package:flu原创 2020-08-08 21:38:49 · 351 阅读 · 0 评论 -
flutter实战项目01 基本资源和目录结构
一,资源引入插件包pubspec.yamldependencies: flutter: sdk: flutter cupertino_icons: ^0.1.2 dio: ^2.0.7//异步请求 flutter_swiper: ^1.1.4//轮播 flutter_screenutil: ^0.5.1//尺寸适配 flutter_easyrefresh: ^1.2.7//下拉刷新 provide: ^1.0.2//状态管理 url_launcher: ^5.0.原创 2020-08-08 21:29:52 · 347 阅读 · 0 评论 -
flutter学习九 页面基本结构
页面基本结构//1,引入material包import 'package:flutter/material.dart';//2,运行包void main() => runApp(MyApp());//3,继承statelessWidegt基本组件class MyApp extends StatelessWidget { @override Widget build(BuildContext context){//4,返回container布局组件return Container原创 2020-08-08 16:19:57 · 702 阅读 · 0 评论 -
flutter学习八 路由
Flutter 中返回到上一级页面Navigator.of(context).pop();Flutter 中替换路由Navigator.of(context).pushReplacementNamed('/registerSecond');Flutter 返回到根路由Tabs为要返回的根页面Navigator.of(context).pushAndRemoveUntil( new MaterialPageRoute(builder: (context) => new Tabs(ind原创 2020-08-08 16:15:20 · 96 阅读 · 0 评论 -
flutter学习七 flutter自定义顶部导航按钮
Flutter AppBar 自定义顶部按钮图标、颜色属性描述leading在标题前面显示的一个控件,在首页通常显示应用 的 logo;在其他界面通常显示为返回按钮title标题,通常显示为当前界面的标题文字,可以放组 件actions通常使用 IconButton 来表示,可以放按钮组bottom通常放 tabBar,标题下面显示一个 Tab 导航栏backgroundColor导航背景颜色iconTheme图标样式textTheme原创 2020-08-08 16:10:23 · 1271 阅读 · 1 评论 -
flutter学习六 flutter状态组件
Flutter 中自定义有状态组件在 Flutter 中自定义组件其实就是一个类,这个类需要继承 StatelessWidget/StatefulWidget。StatelessWidget 是无状态组件,状态不可变的 widgetStatefulWidget 是有状态组件,持有的状态可能在 widget 生命周期改变。通俗的讲:如果我们想改变页面中的数据的话这个时候就需要用到 StatefulWidgetvoid main() => runApp(new MyApp());class原创 2020-08-08 16:01:48 · 162 阅读 · 0 评论 -
flutter学习五 布局组件
Flutter Column 垂直布局组件Flutter Row 水平布局组件Flutter Paddiing 组件Flutter Stack 组件alignment 配置所有子元素的显示位置Alignment.center/Alignment(-1,1)//最小为-1最大为1children 子组件Flutter Stack AlignStack 组件中结合 Align 组件可以控制每个子元素的显示位置alignment 配置所有子元素的显示位置child 子组件Flutter St原创 2020-08-08 15:48:06 · 172 阅读 · 0 评论 -
flutter学习四 底部组件与侧边栏
底部组件bottomNavigationBarimport 'package:flutter/material.dart';import 'tabs/HomePage.dart';import 'tabs/SearchPage.dart';import 'tabs/SettingPage.dart';//想改变页面中的数据 StatefulWidgetclass Tabs extends StatefulWidget { final index; Tabs({Key key,this.i原创 2020-08-08 15:38:03 · 257 阅读 · 0 评论 -
flutter学习三 图片组件和列表组件
Image.network 远程图片 child: Container( child: Image.network( "图片地址", fit: BoxFit.cover,//填充方式 // alignment: Alignment.bottomRight//对齐方式 ), height: 300.0, width: 400.0, decoration: BoxDecoration( color: Colors.yel原创 2020-05-24 21:52:17 · 564 阅读 · 0 评论 -
flutter学习二 基本结构与基本组件
main.dartimport 'package:flutter/material.dart';void main() => runApp(new MyApp());class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return new MaterialApp( home: new Scaffold( appBar: new App原创 2020-05-23 16:05:48 · 175 阅读 · 0 评论 -
flutter学习一 软件安装
windows安装1 使用镜像在控制面板中添加环境变量PUB_HOSTED_URL=https://pub.flutter-io.cnFLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn2 下载Flutter SDK添加PATH环境变量flutter\bin的全路径,使用 ; 作为分隔符3 运行 flutter doctor检查4 下载并安装 Android Studio.5 打开Plugins,安装flutter和dart插件6原创 2020-05-23 12:46:15 · 146 阅读 · 0 评论