和尚继续尝试 Flutter 的基本按钮；今天和尚学习 MaterialButton 系列相关 Button；该系列以 MaterialButton 为父类，衍生出 RaisedButton...和尚测试发现 hight 可以设置 MaterialButton 高度，但 shape 按钮形状却不适用；其父类 RawMaterialButton 却正常；和尚尝试网上大神的处理方式是外层依赖...，和尚准备同时对两类 Button 进行尝试，比较两者的不同； 案例尝试 和尚首先尝试最基本的 RaisedButton / FlatButton 可点击和不可点击样式； // 可点击 RaisedButton...使用 RaisedButton 时会自带阴影效果，阴影的高度和高亮时的阴影高度均可自由设置；但是阴影的颜色应该如何处理呢，官方暂未提供阴影效果属性；和尚尝试了网上大神的方式，RaisedButton 外层依赖带模糊阴影效果的...Container；和尚借鉴并稍微调整一下，解决方案并非最佳，仅作尝试； 初始时定义一个默认的高度 height 作为阴影高度，监听按钮的 onHighlightChanged 方法更改
Dialog 在日常开发中应用广泛，大家也对此很熟悉；和尚以前也整理过关于自定义 Dialog 的小博客，今天和尚系统的学习一下最基本的 Dialog； Dialog 一般不直接使用，Flutter...和尚尝试对上述 Dialog 添加一些个性化； a. titleTextStyle 和 contentTextStyle 不能改变标题和内容中已设置过的样式； b. shape 为对话框样式，如果设置为...UnconstrainedBox + SizedBox Flutter 的对话框中均未提供更改宽度的属性，高度可以自适应；和尚采用 UnconstrainedBox + SizedBox 可以实现对话框的宽度更改...，默认的遮罩层颜色和渐进渐出的动画效果； showGeneralDialog 源码分析 Future showGeneralDialog({ @required BuildContext...；而实际也是对 Navigator.push 的封装； 案例尝试 和尚重现以前博客中实现的简易对话框：由底部弹出且透明度由 0.0 到 1.0；测试 barrierColor 进入和退出时都是渐变符合动画效果
✨flutter_easyloading: 一个简单易用的Flutter插件，包含23种loading动画效果、进度条展示、Toast展示。纯Flutter端实现，支持iOS、Android。...比如说这篇文章即将讲到的，如何在Flutter应用内简单、方便的展示Toast或者Loading框呢？...探索 起初，我也在pub上找到了几个比较优秀的插件： FlutterToast: 这个插件应该是很多刚入坑Flutter的同学们都使用过的，它依赖于原生，但对于UI层级的问题，最好在Flutter端解决...Duration displayDuration; /// 文本的颜色, 仅对[EasyLoadingStyle.custom]有效....如果有child但是想指定画布为特定大小，可以使用SizeBox包裹CustomPaint实现。 isComplex：是否复杂的绘制，如果是，Flutter会应用一些缓存策略来减少重复渲染的开销。
Button 在日常中是必不可少的，和尚尝试过不同类型的 Button，也根据需求自定义过，今天和尚系统的学习一下最基本的 Button； Flutter 中没有 Button Widget，但提供了很多不同类型的...和 onPressed 是必须要设置的，其余属性根据需求而适当调整； 案例尝试 和尚首先尝试最基本的 IconButton；长按会由 tooltip 提醒，点击为默认主题色； IconButton(icon..., duration: Toast.LENGTH_SHORT, gravity: Toast.BOTTOM)); 和尚尝试其中几个属性；其中 icon 颜色为 cyan，点击高亮背景色为 deepPurple...('IconButton', context, duration: Toast.LENGTH_SHORT, gravity: Toast.BOTTOM)); 和尚尝试不可点击时，icon 颜色为 disabledColor...，可根据 padding 或外层依赖 Container 适当调整位置和大小；默认最小尺寸为 88px * 36px； 案例尝试 和尚定义了一个基本的按钮，并监听其高亮改变时状态，与我们常见的按钮基本一致
和尚最近在学习基础的 Flutter Widget，原因在于很多基础的组件有很多容易忽视的注意事项，了解并熟悉后对整体的开发认知会有所提升；今天和尚学习一下 TextField 文本输入框；...，自定义化较高，实践中需要合理利用各种回调； 案例尝试 和尚尝试最基本的 TextField，区分默认状态和获取焦点状态； return TextField(); ?...和尚尝试了光标的相关属性；cursorColor 为光标颜色，cursorWidth 为光标宽度，cursorRadius 为光标圆角；其中 Radius 提供了 circle 圆角和 elliptical...； dependencies: flutter: sdk: flutter flutter_localizations: sdk: flutter 在 MaterialApp 中设置本地化代理和支持的语言类型...文本框是日常开发中必不可少的组件，和尚还在探索过程中，如有问题请多多指导！ 来源： 阿策小和尚
Flutter的widget是不可改变的因此不能直接更新，而必须使用Widget的状态。Flutter的widget分为有状态和无状态两种。...布局 Flutter中通过Row和Column来实现线性布局，类似于Android中的LinearLayout控件 row水平，Column竖直 对于线性布局，有主轴和纵轴之分，如果布局是沿水平方向，...(是从左往右还是从右往左)，默认为系统当前Locale环境的文本方向(如中文、英语都是从左往右，而阿拉伯语是从右往左)。...Navigator可以通过push和pop route以实现页面切换。 在Flutter中，导航器管理应用程序的路由栈。将路由推入（push）到导航器的栈中，将会显示更新为该路由页面。...hashCode()方法因为Object 提供了这些方法，但是如果你尝试调用o.foo()时，静态类型检查会运行报错。
Flutter AppBar 是根据Material Design指南构建的应用程序组件。它通常位于屏幕顶部，并且能够在其布局中包含其他小部件。...Flutter AppBar 布局 leading leading 接受一个小部件，可以分配任何东西——文本、图标，甚至一行中的多个小部件。...AppBar 包含各种属性，包括颜色、大小、图标主题、文本主题等等。 背景颜色 以下代码将 AppBar 的背景颜色更改为深橙色。500添加以访问颜色的特定阴影，900即最暗和最亮50。...: IconThemeData(color: Colors.green, size: 36), ), 文字主题 假设您想将文本颜色更改为带有较浅阴影的琥珀色，200并将字体大小设置为24： AppBar...的布局和添加小部件 如何为 AppBar 的图标、文本、背景、高度、阴影颜色和工具栏设置主题 所以我们有了！
在web前端中我们使用图标可以自己定义字体与SVG，使用阿里图标上面的图标。在Flutter中，google则为我们集成了一些常用的图标。...Color textColor, //按钮文字的颜色 Color disabledTextColor, //按钮禁用时候文字颜色 Color color, //按钮背景色 Color...: Text("textColor文本的颜色，color背景颜色，highlightColor按钮按下的颜色"), textColor: Color(0xffff0000), color...backgroundColor AppBar的背景色。如果flexibleSapce设置了背景色，这个背景色将会被覆盖。...在下面的课程中，我们将会介绍一些Flutter的中高级的Widget。
和尚前段时间学习了一下 Flutter 与原生 Android 之间的交互；是以 Android 为主工程，Flutter 作为 Module 方式进行交互；今天和尚尝试一下 Flutter...中嵌入 Native View 的交互方式；Android 端采用 AndroidView iOS 端采用 UiKitView；和尚仅学习了 AndroidView 的基本用法； ?...； 两个 Container 背景色均未展示，和尚理解是 AndroidView 是填充满 Container 的，只是 AndroidView 中展示效果跟原生 View 尺寸相关； AndroidView...中未填充满的部分会展示白色或黑色背景色，与 Android 主题版本 或 设备 相关； 2. creationParams / creationParamsCodec creationParams...5. hitTestBehavior 和尚尝试了数据绑定和手势操作，但重要的一点是数据透传，和尚在 Flutter / Android 两端添加了 Toast 进行测试； a. opaque
背景设置有两个构造函数，分别对应设置 color 背景色和 brush 渐变色；与 Flutter 等大部分语言类似，color 和 brush 不能同时使用；Text( text = "$name...用于设置文本字体样式，包括 Normal 和 Italic 斜体两类；style 用于设置文本内容样式，style 方法中的多种属性与 Text 属性重叠，当两者均设置时，以 Text 属性为准；Text...，允许在文本布局完成后执行自定义操作；但需要注意的是：onTextLayout 回调函数将在每次文本布局更改时被调用，因此请确保避免在该函数中执行耗时的操作，以确保性能； 和尚通过 TextLayoutResult.layoutInput... inlineContent 用于替换范围内容的映射存储；可以在 Text 中添加占位等操作；用于在文本中添加内联内容，并提供自定义的渲染逻辑；内联内容可以是特殊标记或占位符，用于在文本中插入自定义的组件或视图...；对 Text 全属性进行了分析和拆解，并进行了案例尝试。
但是这种全局方法单独放置比较零散，维护起来有点麻烦。Dart 中提供了 extension 关键字拓展类方法，可以为一个类附加额外的方法....此时 hide 方法可以访问 String 类中的公开成员和方法： extension TolyStringExt on String { String hide(){ String p0...BuildContext 的拓展方法 Flutter 中 BuildContext 是一个非常重要对象，它作为 Element 的顶层接口，负责维护构建过程中的上下文信息，可以通过它来向上层查找元素节点...很多状态管理、路由的类库中，都可以看到对它复写的身影。这里以一个简单的 Snack 弹框为例，看一下对 BuildContext 的拓展。...并提供三种颜色作为成功、失败、警告三种场景的背景色： import 'package:flutter/cupertino.dart'; class Toast{ static void success
为了继续提高 Flutter 的工作效率，我们对 Visual Studio Code 的 Flutter 扩展进行了更新，该扩展将 Dart DevTools 直接带入的 IDE 中，在移动文件时会自动更新了导入语句...在我们的UTF-8解码基准测试中，我们发现，在低端ARM设备上，英语文本的全面改进从近200％提高到中文文本的400％。...自动填充移动文本字段 一段时间以来，最受用户欢迎的功能之一是为 Flutter 程序中对文本自动填充在 Android 和 iOS提供支持。...框架本身的元数据，它提供以下内容的机器可读数据文件： 当前所有Flutter小部件的目录（395个小部件）; Material 和 Cupertino 颜色集的 Flutter 框架[颜色名称到颜色值的映射...Typesafe platform channels for platform interop 为了响应用户调查中插件作者的普遍需求，最近我们一直在尝试如何使 Flutter 与主机平台之间的通信对于插件和
将之前的flutter_smart_dialog，在保持api稳定的基础上，进行了各种抓头重构，解决了一系列问题 现在，我终于可以说：它现在是一个简洁，强大，侵入性极低的pub包！...问题 使用系统弹窗存在一系列坑，来和各位探讨探讨 必须传BuildContext 在一些场景必须多做一些传参工作，蛋痛但不难的问题 loading弹窗 使用系统弹窗做loading弹窗，肯定遇到过这个坑比问题...，关闭loading弹窗的方法，同时也能关闭正常使用的页面，本身就是一个隐患 本菜狗不具备大厂大佬们魔改flutter的能力，菜则思变，我只能从其它方向切入，寻求解决方案 系统的Page就是基于Overlay...，toast自己会动态的调整自己和屏幕底部的距离 这样就能起到一个，键盘不会遮挡toast的效果 [toastSmart] 自定义Toast 参数说明 toast暴露的参数其实并不多，只提供了四个参数...例如：toast字体大小，字体颜色，toast的背景色等等之类，我都没提供参数 一是觉得提供了这些参数，会让整个参数输入变的非常多，乱花渐入迷人眼 二是觉得就算我提供了很多参数，也不一定会满足那些奇奇怪怪的审美和需求
，后经过大佬提醒，是不是vc环境的问题，网上搜索一波，果然有思路了 先找了个有异常的电脑，在电脑上打开控制面板\程序\程序和功能，查看它的vc环境如下 另外找了个不会报错的电脑，vc环境如下 看起来...问题 Android跟ios都可以很方便的弹出toast提示，也不依赖buildContext，但是在Windows平台就不行了，着实烦恼，toast功能都是依赖flutterToast这个库，所以只能采用带...buildContext的方式弹toast，使用局限性大了许多，也是确实没办法 我是采用封装mixin的方式来使用，新建一个文件叫ToastMixin，然后实现toast初始化和展示逻辑 mixin ToastMixin...的地方，继承ToastMixin就可以了，最大不方便的就是，不能在网络请求等没有buildContext的地方弹出toast了 图片加载问题 图片加载是一款软件基础的功能，不管是app还是Windows...1%的工作，剩余的99%都是基于前人已经做好的框架和组件去开发...
2018年10月的PR 22330中增加了对新配置的选择加入支持，但不对新名称提供支持。现有的文本样式名称未更改，因为这样做是一个重大的API更改，可能会影响大多数应用程序。...Google字体允许开发人员在其应用中轻松地尝试和使用fonts.google.com中的任何字体。...在此版本中，我们已完成了全部工作，包括滚动，文本字段和其他输入小部件的辅助功能修复。您将在GitHub上看到此发行版中关闭的可访问性问题的完整列表。...进行此更改后，分析错误不足以阻止Hot Reload正常运行，而取决于VM的编译器错误。...重大变化 与往常一样，我们尝试在每个Flutter的新版本中尽量减少重大更改的数量，同时仍在平衡我们的能力，以确保Flutter提供直观，灵活的API来支持新平台上的新用法。
主题定制 主题，又叫皮肤、配色，一般由颜色、图片、字号、字体等组成，我们可以把它看作是视觉效果在不同场景下的可视资源，以及相应的配置集合。...因此在App开发中，我们通常不关心资源和配置的视觉效果好不好看，只要关心资源提供的视觉内容能不能用。...下面的例子中，我们将icon的颜色调整为黄色，文字颜色调整为红色，按钮颜色调整为黑色： MaterialApp( title: 'Flutter Demo',// 标题 theme: ThemeData...), home: MyHomePage(title: 'Flutter Demo Home Page'), ); 运行一下，可以看到，图标、文字、按钮的颜色都随之更改了。...比如，我们想要为某个子Widget的背景色复用App的主题色，我们就可以通过 Theme.of(context) 方法，取出对应的属性，应用到这段文字的样式中。
布局中的按钮分配一个方法，而不是对Activity中对按钮实现onClickListener。...此方法必须是公共的，并且接受一个视图作为它的唯一参数。...状态列表可绘制是在XML中定义的可绘制资源，它根据按钮的当前状态更改其图像。一旦定义了一个可以用XML绘制的状态列表，就可以将它应用到具有 android:background属性的按钮上。...方法二：在Java代码里给 button设置背景色（ setBackgroundColor中以下两种方法任意一种即可） btnClickMe.setBackgroundColor(getResources...） stroke：描边属性，可以定义描边的宽度，颜色，虚实线等（ width描边的宽度、 color描边的颜色） 方法一：在xml布局里直接设置自定义 shape背景，如果想给按钮内部文字设置边距还可以自己设置
highlightColor - 用于类似墨水喷溅动画或指示菜单被选中的高亮颜色。 hintColor - 用于提示文本或占位符文本的颜色，例如在TextField中。...sliderTheme - SliderThemeData类型，用于渲染Slider的颜色和形状。 textTheme - TextTheme类型，与卡片和画布对比的文本颜色。...用于确定放置在突出颜色顶部的文本和图标的颜色（例如FloatingButton上的图标）。 brightness - Brightness类型，应用程序整体主题的亮度。...typography - Typography类型,用于配置TextTheme、primaryTextTheme和accentTextTheme的颜色和几何文本主题值。...themeData = new ThemeData.dark(); // 主题为暗色 } 然后我们正常的执行代码： import 'package:flutter/material.dart'; import
对于iOS 14，我们对Flutter进行了很多更改，以确保它可以按照开发人员的方式工作： Xcode 12需要iOS 9.0或更高版本，因此我们的默认模板将其默认值从8.0增加到9.0 iOS 14特定崩溃和字体渲染问题已在...您可以在iOS 14上尝试使用Flutter的另一个功能是App Clips，它是iOS 14的一项新功能，它支持10MB以下轻量级应用程序的快速，无安装应用程序执行。...Flutter框架和引擎已更新，以支持最新版本的Android中引入的两个新功能。 首先，Flutter现在支持多种屏幕适配（比如瀑布屏）。 ?...您可以在OnPopPage回调中更新状态，例如，如果用户弹出，则表示他们已“取消选择”当前颜色，因此我们不再希望显示该页面。...但是，如果您尝试使用Navigator 2.0，我们认为您会喜欢的。 预览：Android的状态还原 在此版本中可供您试用的新功能是对Android状态恢复的支持。
为了应对复杂的业务场景，同时降低侵入性，在保持api稳定基础上，全面重构了SmartDialog底层 我现在可以自信的说：它现在是一个简洁，强大，侵入性极低的Pub包 请使用Flutter 2.0及其以上的小伙伴们移步...前言 系统自带的Dialog实际上就是Push了一个新页面，这样存在很多好处，但是也存在一些很难解决的问题 必须传BuildContext loading弹窗一般都封装在网络框架中，多传个context...看了其中源码，穿透背景解决方案，和预期想要的效果大相径庭、一些dialog库自带toast显示，但是toast显示却又不能和dialog共存（toast属于特殊的信息展示，理应能独立存在），导致我需要多依赖一个...] 引入 Pub：查看flutter_smart_dialog插件版本 自2.0版本开始，本库已适配空安全 dependencies: flutter_smart_dialog: any 注意：该库已迁移空安全...内部已进行相关实现，使用show()方法中的isUseExtraWidget区分 最后 这个库花了一些时间去构思和实现，算是解决几个很大的痛点 如果大家对返回事件有什么好的处理思路，麻烦在评论里告知，谢谢
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储
