antu58-CSDN博客

作为一个常用到不能再常用的组件，material库中的button组件都有一点奇怪——存在无法设置的内外边距，我们做一个简单的展示，选几个常见button，统一使用Text做child，外加一个带红色的Container组件，观察margin和padding.你会发现，除了InkWell，即使padding设置为0，仍然无法消除消除上下padding，这其实不是padding属性没有生效，而是这些按钮有默认大小的约束。这点可以通过源码和不设置child的UI来佐证。.........

2022-06-08 18:09:02 1305

原创 Flutter--手动绘制k线图的思路

import 'dart:math';import 'package:flutter/material.dart';import 'package:ripp_link/page/base/base_state_page.dart';import 'package:ripp_link/widget/base/dialog_box/tips_card.dart';class PaintPage extends StatefulWidget { @override State<Sta..

2022-04-22 15:39:33 2929

原创 Flutter--分组列表实现思路

代码import 'package:flutter/material.dart';class TableView extends StatelessWidget { final Widget Function(BuildContext context, int section) buildHeader; final Widget Function(BuildContext context, int section) buildFooter; final Widget Functio

2022-03-10 17:29:27 4451

原创 Flutter--自定义弹窗（含底部抽屉）Dialog

主要是基于系统的dialog机制做一些使用限制和自定义UI的优化核心代码：class CustomDialog { static void show(BuildContext context, Widget Function(BuildContext ctx, void Function() dismiss)builder, {bool cancellable = false}) { showDialog( context: context, ..

2022-03-03 11:31:30 4019

原创 Flutter--Android Studio iOS编译报账号错误

1.账号没有去Xcode填写2.账号有，Xcode可以编译运行，需要在Xcode把账号设为手动设置再恢复自动即可

2022-03-02 10:06:02 1918

原创 Flutter--页面跳转动画

这个路由提供页面从上下左右自由弹出的动画，其他不同形式的动画如法炮制。import 'package:flutter/material.dart';class PanPageRouteBuilder extends PageRoute { final WidgetBuilder builder; final AxisDirection popDirection; PanPageRouteBuilder({ RouteSettings? settings, re.

2022-02-26 16:25:28 2014

原创 Flutter--Hero组件

有时候想要本页面的某个组件，可以动画过渡到下个页面，就比如Apple music中，底部打音乐图标，在打开播放页时能自己放大过度到播放页的位置，这时候就需要用页面跳转动画和hero组件来配合实现。注意：hero组件不可以嵌套使用，比如将一个Container标记为hero，那么它的child不可以Hero组件。import 'package:flutter/material.dart';const String iconTag = "icon";const String titleTag .

2022-02-26 11:30:04 1015

原创 Flutter--常用命令

flutter doctor //检测flutter运行环境flutter run //运行flutter build ios --release //iOS打包 -lstdc++flutter build apk //安卓打包flutter clean //清理工程 flutter pub get //更新应用的库//打包flutter build apk//打google play上架的aab包flutter build appbundle//打制定 arm arm6.

2022-02-26 10:05:20 1244

原创 Flutter--动画

做一个简单的组合动画，让一个View从小变大，然后从红色变蓝色class AnimationView extends StatefulWidget { const AnimationView({Key? key}) : super(key: key); @override _AnimationViewState createState() => _AnimationViewState();}class _AnimationViewState extends State&

2022-02-25 17:20:37 309

原创 Flutter--局部组件状态更新

// 通过Builder来获得构建Checkbox的`context`， Builder( builder: (BuildContext context) { return Checkbox( value: _withTree, onChanged: (bool value) { //Flutter决定是否更新组件主要是判断该组件是否为dirty，setState其实就是将组建标记为dirty的过程...

2022-02-25 12:01:33 1230

原创 Flutter--高德地图使用指南

1.在高德官网申请Key2.导入flutter包dependencies: amap_flutter_map: ^3.0.03.初始化官网的说明很混乱，经过实验。3.0.0版sdk后，初始化apikey这种操作不需要在原生代码中操作了，在你要创建地图时，应当采用如下做法：注意：privacyStatement该参数表示已经给用户看过相关协议，权限要求等，不写拿不到数据，如果要上架必须要在执行该代码前用明显弹窗提示,具体内容可参考重要： SDK合规使用方案 | 高德地图API/

2022-02-17 11:13:13 9066 8

原创 Flutter--解决web端网络请求失败问题

主要是跨域问题引起的1. 删除 flutter\bin\cache\flutter_tools.stamp2. 打开flutter\packages\flutter_tools\lib\src\web\chrome.dart.3. 在'--disable-extensions'下方添加'--disable-web-security'

2022-02-16 16:22:38 2125 1

原创 Flutter--中间打孔底部导航栏

@override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(widget.title), ), drawer: Container( width: 100, color: Colors.red, ), body: SizedBox( he...

2022-02-10 16:46:53 1048 1

原创 Flutter--自定义内容选择器CupertinoPicker

Widget tempPicker(Function(int) onChanged) { int value = 30; List<int> list = []; for (int i = -20; i <= 120; i = i + 5) { list.add(i); } final FixedExtentScrollController scrollController = FixedExtentScrollController(.

2022-02-10 16:21:24 1668

原创 Flutter--拖拽组件（支持多组数据）

import 'package:flutter/material.dart';import 'package:flutter/rendering.dart';class DragGridView extends StatefulWidget { @override State<StatefulWidget> createState() => _DragGridState();}class _DragGridState extends State<DragG..

2022-01-07 16:56:19 2380

原创 Flutter--捕捉手势的弧度和角度

两个工具类import 'package:flutter/material.dart';class GestureAngleView extends StatelessWidget{ final double angel; final Function(double angel, bool end) onChanged; final List<Widget> Function(BuildContext context, Size size, double radi

2022-01-07 10:08:30 1292

原创 Flutter--画笔 CustomPainter

1.创建画板CustomPaint @override Widget build(BuildContext context) { return Scaffold( body: Center( child: SizedBox( width: 400, height: 400, child: CustomPaint(painter: TestPaint(),), ), ),.

2021-12-25 18:00:38 2702

原创 Flutter--自定义AppBar

class CustomAppBar extends StatefulWidget implements PreferredSizeWidget { final Widget child; CustomAppBar(this.child); @override State<StatefulWidget> createState() => _CustomAppBarState(); @override Size get preferredSize =&gt..

2021-11-26 11:39:19 2313

原创 Flutter--不同样式字符串拼接

Widget textSpan() { return Text.rich(TextSpan( children: [ TextSpan( text: "Home: " ), TextSpan( text: "https://flutterchina.club", style: TextStyle( col.

2021-10-30 09:33:58 3338

原创 Flutte-- 国际化l10n笔记

多语言插件l10nflutter_intl: enabled: true main_locale: "ko"main_locale 假如想复写引用的库中的某种多语言文件，这时候需要将该属性设置为你的目标类型，默认为英文，若果不同时设置英文，其他语言的文件也不会生效。...

2021-10-28 11:30:04 385

原创 Flutter--获取父组件约束大小

context可以获取当前组件的大小，但是有时候我们想要渲染子组件时需要依赖当前组件的尺寸，build第一次运行时渲染树还没生成，调用context.size会报错，此时就需要使用LayoutBuilder组件，它可以获取父组件的约束，用它包裹子组件，变相获得还未渲染的父组件尺寸。 @override Widget build(BuildContext context) { return UIContainer( width: double.infinity, h

2021-10-15 17:37:57 1600

原创 Flutter--自定义AppBar的actions中组件的大小

AppBar中指定了actions按钮的约束条件，必须通过UnconstrainedBox来 “去除” 父元素的限制。AppBar( title: Text(title), actions: <Widget>[ UnconstrainedBox( child: SizedBox( width: 20, height: 20, child: CircularProgressIndicator( s

2021-10-15 16:46:50 2165

原创 Flutter--Debug小技巧

打印渲染树1. 导入 import'package:flutter/rendering.dart';2. debugDumpRenderTree()统计应用启动时间$ flutter run --trace-startup --profile结果保存在 build/start_up_info.json

2021-10-15 11:34:41 405

原创 Flutter--根据context获取父Widget节点

class ContextRoute extends StatelessWidget { @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text("Context测试"), ), body: Container( child: Builder(builder: (context) { .

2021-10-15 10:41:30 1729

原创 Flutter--TextButton封装以及属性说明

import 'package:flutter/material.dart';class UIButton extends StatelessWidget { final Widget child; final VoidCallback onPressed; final Key key; final VoidCallback onLongPress; final Clip clipBehavior; final Color foregroundColor; final.

2021-10-12 11:49:37 541

原创 Flutter--毛玻璃组件封装UIBlurView

import 'dart:ui';import 'package:flutter/material.dart';class UIBlurView extends StatelessWidget { final Widget child; final BorderRadius borderRadius; final ImageFilter filter; UIBlurView(this.child, { this.borderRadius, this.filte..

2021-10-09 11:42:13 212

原创 Flutter--Text封装

import 'package:flutter/material.dart';class UIText extends StatelessWidget { final String text; final TextOverflow overflow; final TextAlign textAlign; final int maxLines; final double fontSize; final Color color; final FontWeight fon..

2021-10-09 11:40:30 286

原创 Flutter--TextButton简析以及分装

import 'package:flutter/material.dart';class UIButton extends StatelessWidget { final Widget child; final VoidCallback onPressed; final Key key; final VoidCallback onLongPress; final Clip clipBehavior; final Color foregroundColor; final.

2021-09-28 18:13:04 385

原创 Flutter--Container组件接口优化

记录一个思路，后续逐步完善class UIContainer extends Container { UIContainer({ Key key, Widget child, double width, double height, AlignmentGeometry alignment, Color backgroundColor, Color borderColor, double borderWidth, Bord.

2021-08-31 11:49:44 140

原创 Flutter待完美解决的问题

1.启动页iOS从原生启动页到flutter Ui启动过度期间有次白屏安卓是直接白屏启动，如何统一两个客户端的效果2.弹窗系统弹窗是Push一个弹窗页面进当前视图栈，当app逻辑复杂时非常混乱，同时安卓还会被返回按钮返回，难以限制。目前是在一个第三方组件的基础上修改的，之后打算做进一步封装和优化3.flutter使用频率较高的一些组件使用过于麻烦需要进一步封装，目前我的封装可以用但是不够完美...

2021-07-30 09:59:16 84

原创 Flutter等待异步内容

有时候需要弹出弹窗等待用户选择某条件后再执行后续代码，可以用Completer类。//事例 var c = Completer<bool>(); Dialogs.tipsCard(title, tip, failMsg: '', actions: [i18n.ok], callback: (index) => c.complete(true), dismissCallBack: () { if..

2021-07-28 09:09:06 1207

原创 Flutter 自定义Slider

enum SliderDirection { vertical, horizontal}class SliderBar extends StatelessWidget { final Size size; final Widget child; SliderBar({this.child, this.size = const Size(24, 24)}); @override Widget build(BuildContext context) { retu.

2021-06-18 18:17:04 1909 2

空空如也

空空如也