前言 针对不能将类型“HTMLElement | null”分配给类型“HTMLElement” 错误,可根据实际情况使用!
文章目录 一、List 集合的 map 方法说明 ( 生成 ListView 组件集合 ) 二、ListView 垂直列表 三、ListView 水平列表 四、相关资源 一、List 集合的 map 方法说明...卢俊义', '吴用', '公孙胜', '关胜']; 调用 List 集合的 map 方法 , 可以遍历操作集合中的每一项 , 返回一个新的数组 ; map 方法的原型如下 ; Iterable...组件 , 那么上述原型中的泛型 T 就是 Widget 类型 ; 下面的方法中 , map 方法传入了一个匿名函数 , 参数是 name , 类型是 String , 返回值是 _generateWidget...函数的返回值 , 其中 _generateWidget 函数返回 Widget 类型 , 最终 map 方法的返回值是 IterableWidget> 类型 , 然后调用 toList() 方法 ,...将其转为 ListWidget> 类型 ; NAMES.map((name) => _generateWidget(name)).toList(); 二、ListView 垂直列表 ---- 完整代码示例
MaterialApp属性详解 属性 类型 简述 home Widget 主页。...onUnknownRoute RouteFactory onGenerateRoute 无法生成路由时调用 navigatorObservers List 导航的监听器列表...如果为null则使用当前系统区域 localizationsDelegates Iterable> 本地化委托，用于更改Widget默认的提示语... 传入支持的语种列表 showPerformanceOverlay bool 用于性能测试。...); }, ); Scaffold Scaffold是App的页面框架，将整个页面分为如下的几个部分 [l0p8slqyns.jpeg] Scaffold属性 属性 类型
options (Iterable) Labels for the select options in an Iterable....然后，它使用st.radio函数创建了一个单选框，让用户选择他们喜欢的电影类型。单选框有三个选项，分别是喜剧、戏剧和纪录片。每个选项都有一个标签，用于描述这种类型电影的特点。...然后，它使用`st.radio`函数创建了一个单选按钮，用于让用户选择他们最喜欢的电影类型。...，以便从列表中选择项目。...通过传递一个双元素元组或列表作为值，还可以显示一个范围滑块。
上面一篇文章我们学习完了 字母的列表的显示，但是里面我们点击一个字母 马上跳到该字母对应的城市，并且在视图上面显示一个自定义吐司 这些事件的处理是怎么样完成的呢？...我们知道很多的widget都有监听事件，比如说btn.setOnClickListener()等等，当我们想去实现它的时候，我们必须重载OnClick(View view)方法 自定义构件也是一样的原理...，还记得 在上节的自定义26个字母列表的构件中 我们定义了一个接口吗？...= null) {// 根据上篇文章的分析，我们知道这个函数传递过来的参数是一个字母，那么根据这个字母我们得到列表的索引 [] int position = alphaIndexer.get(s)...因为上一步触摸导致这个线程处于运行中 // 延迟1.5秒后执行，让overlay为不可见 handler.postDelayed(overlayThread, 1500);//先让文本显示1.5秒，然后调用线程告诉它不能再显示了
wordPair.asPascalCase), // With this highlighted text. ), ), ); }}Stateless widgets 是不可变的, 这意味着它们的属性不能改变...继承(extends)Flutter中的继承和Java中的继承是一样的：Flutter中的继承是单继承构造函数不能继承子类重写超类的方法，要用@override子类调用超类的方法，要用superFlutter...LocalizationsDelegate>localeResolutionCallback（区域分辨回调）LocaleResolutionCallbacksupportedLocales（支持区域）Iterable...某个类从普通类型转换成枚举类型，或者类型的泛型参数列表变化，都会使热刷新失败。...actions → List - 一个 Widget 列表，代表 Toolbar 中所显示的菜单，对于常用的菜单，通常使用 IconButton 来表示；对于不常用的菜单通常使用 PopupMenuButton
MaterialApp基于WidgetsApp 如果对MaterialApp不熟悉，可先看我上一篇文章： Flutter之MaterialApp使用详解 与MaterialApp相比 18个相同字段: 字段 类型...onGenerateTitle（生成标题） GenerateAppTitle color（颜色） Color locale(地点) Locale localizationsDelegates（本地化委托） Iterable...LocalizationsDelegate> localeResolutionCallback（区域分辨回调） LocaleResolutionCallback supportedLocales（支持区域） Iterable...showSemanticsDebugger（显示语义调试器） bool debugShowCheckedModeBanner（调试显示检查模式横幅） bool WidgetsApp特有的字段： 字段 类型...bool inspectorSelectButtonBuilder（审查员选择按钮生成器） InspectorSelectButtonBuilder MaterialApp特有的字段： 字段 类型
Localizations.of(context, AppLocalizations); } Localizations.of 源代码： 这段代码是获取 Type 类型...（App 传入的类型为 AppLocalizations）的资源，看一下 resourcesFor 的源代码： 关键在 _typeToResources ： _typeToResources 是一个 Map...类型， _typeToResources 初始化数据的： widget.delegates 的类型是： /// This list collectively defines the localized... supportedLocales，在较新的Android系统中可以设置语言列表，List locales就表示这个语言列表， supportedLocales为当前应用支持的...locale列表，是在MaterialApp中设置supportedLocales的值。
(七) Flutter中的widget 注：鉴于目前网上还没有比较规范、系统的整理，该学习手册中的内容都是根据笔者的一个框架在网上进行的搜集整理。...HashMap Map、HashMap、LinkedHashMap、SplayTreeMap区别 命名构造函数from和of的区别以及使用建议 …… 第七章 Dart语法篇之集合操作符函数与源码分析(三) Iterable... Iterable类关系图 Iterable类方法图 forEach 介绍 使用方式 源码解析 map any every …… 第八章 Dart语法篇之函数的使用(四) 函数参数 匿名函数(闭包...(七) 可选类型 接口类型 泛型 类型具体化 …… 第十二章 Flutter中的widget Flutter页面-基础Widget Widget StatelessWidget Stateful Widget...State生命周期 基础widget 文本显示 …… 最后 希望这份资料可以给想要了解 Flutter 并快速上手的朋友一些帮助以及一个参考方向。
, ), ), ], ), ], ), ); } Iterable...Widget> _detailItemsFor(Section section) { final IterableWidget> detailItems = section.details.map...使用它有两个关键点： 自定义MultiChildLayoutDelegate来自己实现布局 他的每个child都需要用layoutId来包裹，并且分配给他们的id，都必须是唯一的。...一个是当滚动到中间位置后，就不能左右切换了。 监听 将NotificationListener包裹在pageView之外，就可以监听PageView的滚动事件了。 //省略代码......它将会导致页面不能滚动。 反之，就设置为PageScrollPhysics().像页面一样滚动。
和尚今天主要测试作为普通列表时的基本用法。...默认 List 和尚理解默认 List 方式，是把数据 Iterable 添加到列表中，之后直接添加到 ListView 即可；如下： ListWidget> _list = new List...ListView.builder 和尚理解 builder 方式很像对话框类型逐个添加需要的属性；需要在 builder 中添加列表数据；而添加分割线的方式更让和尚体会到 Flutter 一切都是...主要源码 ListWidget> _list = new List(); @override Widget build(BuildContext context) { for (int i...---- Tips: 列表中有一个属性很有意思：reverse 是否反转，如果设为 true，列表默认滑倒底部而且数据也是倒叙排列；若设为 false，则一切正常。
MaterialApp 传入 routes 和 onGenerateRoute 等参数，MaterialApp 的 state 是 _MaterialAppState 它构建的是 WidgetsApp 类型的..., routes: widget.routes, initialRoute: widget.initialRoute, onGenerateRoute: widget.onGenerateRoute...WidgetsApp extends StatefulWidget { WidgetsApp({ // can't be const because the asserts use methods on Iterable..., ); } Widget result; if (widget.builder !...这个解释了在 Flutter路由管理和页面参数的传递（获取&返回） 这篇文章末尾说的 onGenerateRoute 方式进行的参数传递，必须不能进行 routers 的注册。
我们都知道 Dart 里一切都是对象，就连基础类型 int 、double 、bool 也都是 class 。...{core::Iterable::iterator}; for (; :sync-for-iterator....让我们看新编译出来的代码，如下所示，可以看到对了 core::int* index = idx; 这段代码，然后回忆下前面所说的，Dart 里基本类型都是对象，而 operator 操作符运算后返回新的对象...{core::Iterable::iterator}; for (; :sync-for-iterator....{core::Iterable::iterator}; for (; :sync-for-iterator.
String Function(String) 是 一个函数「类型」 ，带有 String 参数 并且返回 String类型。...使用命名构造函数 和 初始化列表使API更简洁. 比如我们要定义一个温度的类。...然后再定一个final类型的类静态实例。 从此，只能通过instance变量访问这个类。...如果把set定义为 const ,代码将产生错误，并且不能编译成功: // set is const, doesn't compile const citiesSet = { 'London',...Sync and Async Generators 我们可以定义一个 「synchronous」 generator（同步生成器） 函数的返回类型定义为 Iterable: Iterable
R.32: Take a unique_ptrwidget> parameter to express that a function assumes ownership of a widget R....32: 通过unique_ptrwidget>类型参数表示函数试图获取widget的所有权 Reason（原因） Using unique_ptr in this way both documents...Example（示例） void sink(unique_ptrwidget>); // takes ownership of the widget void uses(widget*);...// just uses the widget Example, bad（反面示例） void thinko(const unique_ptrwidget>&); // usually not what...CppCoreGuidelines.md#r32-take-a-unique_ptrwidget-parameter-to-express-that-a-function-assumes-ownership-of-a-widget
这意味着 Key 是分配给 Widget 的唯一标识，通过 key 可以与其他 Widget 区分开来。对于 Widget 在 Widget 树中改变位置的情况，Key 帮助保留它们的状态。...在添加、删除或重排同一类型的 widget 集合时，Key 非常有用。这些 widget 保持某些状态，并且在 widget 树中处于相同的级别。...② 关于改变的判断条件 ： widget 类型 和 key 值 ，若在没用 key 的情况下，若类型相同则表示新旧 widget 可复用 static bool canUpdate(Widget oldWidget...至此，这就是 key 如何在内部工作以及其在修改集合中有状态 widget 方面的用处。 键类型 Key 一般分两种类型： 本地类型 全局类型 本地键 在拥有相同父元素的元素中必须是独特的。...它们通常用于子列表中，其中每个子项的值是唯一且恒定的。 对象键 与值键相同，唯一的区别是它接受一个包含数据的类对象。
2.RawAutocomplete Flutter 为我们提供了这一个Widget， 在名字看来，是可以自动完成填充代码的Widget，我们来看看它的参数 类型 属性 介绍 AutocompleteOptionsViewBuilder...material.dart'; void main() { runApp(MyApp()); } class MyApp extends StatelessWidget { // This widget...@override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo',...= [ 'int', 'double', 'String', 'num', 'void', 'extends', 'class', 'Widget...optionsViewBuilder: ( BuildContext context, AutocompleteOnSelected onSelected, Iterable
如果需要实现一个垂直的滚动列表，可以直接通过 SingleChildScrollView 包裹 Column 来实现，列表内容全部塞到 Column 即可 class SingleChildScrollDemoPage...body: ListView( // 通过修改滑动方向设置水平或者垂直方向滚动 scrollDirection: Axis.vertical, // 通过 iterable.map...separated 方法用来快速构建带有分割线的 ListView 加入我们的 item 之间的分割线需要如下样式：奇数位和偶数位之间用黑色分割线，偶数位和奇数位之间用红色分割线 // 需要分割线的时候才使用，不能指定...那么实现折叠列表也就是通过 ListView 创建一个 ExpansionTile 列表即可，先准备下模拟的数据 final _keys = ['ParentA', 'ParentB', 'ParentC...childAspectRatio: 1.0 // item 的宽高比 ), // 需要根据 index 设置不同背景色，所以使用 List.generate，如果不设置背景色，也可用 iterable.map
22个参数 字段 类型 navigatorKey（导航键） GlobalKey home（主页） Widget routes（路由） Map<String, WidgetBuilder...GenerateAppTitle color（颜色） Color theme（主题） ThemeData locale(地点) Locale localizationsDelegates（本地化委托） Iterable...LocalizationsDelegate> localeResolutionCallback（区域分辨回调） LocaleResolutionCallback supportedLocales（支持区域） Iterable...OnePage(), //.... }, onGenerateRoute: (setting){ //setting.isInitialRoute; bool类型...'), const Locale('meg'), ], ); 17 . debugShowMaterialGrid debug模式下是否显示材质网格，传入bool类型
下面是一些定义匿名函数并将其分配给sayHi变量的代码： void main() { final sayHi = (name) => 'Hi, $name'; welcome(sayHi, 'Andrea...在读取值时需要使用断言运算符 ( )，因为 Dart 不能保证给定键的值存在。 8. 使用命名构造函数和初始化列表以获得更符合人体工程学的 API。 假设您要声明一个表示温度值的类。...使用集合而不是列表。 Dart 中最常用的集合类型是List....同步和异步生成器 在 Dart 中，我们可以将同步生成器定义为一个返回 的函数Iterable： Iterable count(int n) sync* { for (var i = 1;...这些将Iterable在函数完成时返回。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
云直播
