Flutter组件
日常开发抽离的组件
倾云鹤
宝可梦训练家
展开
-
Flutter走马灯
一、预览二、代码1. 封装方法参考:Flutter走马灯Flutter生命周期import 'dart:async';import 'package:flutter/material.dart';class NotablePage extends StatefulWidget { Widget child; // 轮播的内容 Duration duration; // 轮播时间 double stepOffset; // 偏移量 double padding原创 2022-01-04 14:43:22 · 1255 阅读 · 0 评论 -
Flutter笔试页面
一、预览预览二、使用1. 获取试题(1) 实体class ExamQuestions { int? id; int? level; String? subject; String? title; int? right; String? a; String? b; String? c; String? d; int? addtime; int? deltime;}(2) 使用var myExamQuestions = [ExamQuestions原创 2022-01-04 11:36:21 · 919 阅读 · 1 评论 -
Flutter优化加载网络图片及异常捕获
一、前言加载网络图片时,有时候因为一些原因导致加载缓慢。所以可以选择如下方式添加占位图。二、使用1. 图片占位符(1) FadeInImageFadeInImage( width: 100, fit: BoxFit.cover, placeholder: NetworkImage("占位图网址"), image: NetworkImage("实际渲染图片网址"))(2) 带圆角的FadeInImageClipRRect( borderRadius: BorderRadi原创 2021-12-25 15:24:00 · 2714 阅读 · 0 评论 -
Flutter使用Clip裁剪Widget
一、前言有时候总会遇到一些奇怪的需求,比如奇形怪状的Widget,今天主要搞一下如何实现这是Widget。二、实现1. ClipOval默认:子组件为正方形时裁剪成内贴圆形;为矩形时剪裁成内贴椭圆。也可自定义Rect参数进行裁剪局域(1) 方法ClipOval({Key? key, this.clipper, this.clipBehavior = Clip.antiAlias, Widget? child}) : assert(clipBehavior != null),原创 2021-12-15 11:59:41 · 2042 阅读 · 0 评论 -
Flutter主题及状态栏设置
一、依赖只需要原生io和services即可。功能主要为可以自定义AppBar及整体页面布局。1. 状态栏管理主要使用如下import 'dart:io';import 'package:flutter/services.dart';SystemUiOverlayStyle value;if(Platform.isAndroid){ value = SystemUiOverlayStyle( statusBarColor: Colors.transparent, /// 安卓系原创 2021-12-14 16:49:38 · 2915 阅读 · 0 评论 -
Flutter聊天页面
一、依赖与预览get: 4.1.4video_player: ^2.1.1 /// 播放视频emoji_picker_flutter: ^1.0.5 /// 表情库flutter_keyboard_visibility: ^5.0.3 /// 监听键盘弹起有关IM相关的请看《Flutter融云接入部分》预览二、使用_messageText:TextEditingController()类型1. 表情部分展示import 'package:emoji_picker_flutt原创 2021-08-23 16:16:40 · 3005 阅读 · 10 评论