首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

初学者的 Flutter bloc

首先,我们应该通过官方文档,阅读相关的基础内容,在本文中,我们尝试解析这些基础点,如果需要深入了解,推荐去看官方文档。 它是怎么工作的?...Category 挂件 展示通过调用 getGenres 方法 API 返回的不同的类型。...// home_layout_games.dart import 'package:flutter/material.dart'; import 'package:infogames/ui/home/widgets...当存储库返回有效数据,bloc 将返回放射成功信息,比如状态或者一份列表的副本或者分类名字,相反的,如果结果无效,bloc 需要返回错误的状态。...this.status, ); } } AllGamesBloc 这里我们调用存储库,当有可用的数据的时候,bloc 发射一个游戏列表副本的成功值,相反的,如果存储库返回无效值,bloc 会发射一个错误的状态

10210

写代码也要看颜值!推荐两个高逼格Pycharm主题插件

所谓工欲善其事,必先利其器 ,Pycharm是我一直推荐大家使用的Python编辑器,功能强大,插件丰富。但唯独自带的主题有点单调,眼睛看久了,确实有点视觉疲劳了。...当然了,官方已经给全系JetBrains IDE提供了丰富的主题插件,其中Material Theme UI、One Dark theme是下载量最高的两个主题,推荐大家也尝试下这两个,我个人更喜欢One...Material Theme UI Material Theme UI 是JetBrains IDE(IntelliJ IDEA,WebStorm,Android Studio等)的插件,可将原始外观更改为...虽然下载速度也不快,但是插件包本身也不大,等几分钟就ok了: https://plugins.jetbrains.com/plugin/8006-material-theme-ui/versions/stable...好了,工具毕竟是为人来服务的,不管是哪种主题,自己觉得舒服最重要,如果你是颜值派,不妨尝试下。

11.3K30

Flutter 3.7更新详解

你也可以尝试 Material 3 示例,其中展示了所有主题的特性。 图片 菜单栏和级联菜单 Flutter 现在可以创建菜单栏和级联菜单了。...此外,对于所有其他的平台,你可以定义一个 Material Design 菜单,它提供了级联菜单栏 (MenuBar),或者使用UI 界面元素触发的 (MenuAnchor) 来创建一个级联菜单。...现在你可以按照类或者内存类型对当前的内存分配进行分析,可以在运行时分析哪些代码调用了哪些部分的内存,也可以对比两个不同时间点的内存快照之间的差异来了解内存使用的细节。...如上所述,当这些图像资源不再被需要已由框架手动释放,如果这时继续按照 GPU 内存大小的 GC 策略上报至 Dart,会导致不必要的堆内存压力并进一步触发无效的 GC。...具体来说,Flutter 现在会使用 Dart VM 中 RAIL 风格 的 API,让 路由转场渲染延迟更低,即让堆内存在转场保持增长而不是进行 GC,避免造成动画的卡顿。

3.1K00

Gatsby还是Next.js,微言码道官网折腾事记

在最初的技术选型,有考虑过hexo以及Wordpress两个选项。...升级Material UI至最新的MUI 5 微言码道官网的UI是选择的Material UI,一个非常好的React UI框架,与antd design相比,它更适合TO C互联网及移动设备,而antd...我的myddd starter的UI也是基于Material UI的。 Material UI最近升级到了MUI,一个重新品牌命名的全新版本。...这一次折腾,我在想着要不要从Gatsby迁移至next.js,并且再尝试着换成tailwind css 在经历了一翻尝试后,最终放弃,原因如下: next.js SSG开发体验较差 next.js确实非常不错...而MUI则有一整套组件可供使用。 所以,在尝试与权衡后,决定仍然使用了Gatsby+MUI的搭配。 永不停止的折腾 当然,微言码道的官网不会就折腾到此为止。对它的折腾仍然是永不停止的。

2.2K30

你不知道的33个令人惊艳的React开发库

material-ui image.png MUI 提供了一套全面的 UI 工具,可帮助您更快地发布新功能。...从 Material UI(我们完全加载的组件库)开始,或者将您自己的设计系统引入我们的生产就绪组件中。...react-icons image.png 使用react-icons可以轻松地在React项目中使用流行的图标,它利用ES6导入,支持按需打包。...storybook image.png Storybook 是一个用于独立构建 UI 组件和页面的前端研讨会。成千上万的团队使用它进行 UI 开发、测试和文档编制。它是开源且免费的。...比以往更快地构建功能齐全、可访问的 Web 应用程序 – Mantine 包括 100 多个可定制组件和 40 个挂钩,可满足您在任何情况下的需求 react-leaflet image.png 支持地图的

28720

【建议收藏】Jetpack Compose编程知识全汇总 (含详细实例讲解)

尝试使用Jetpack Compose 示例应用 创建支持Jetpack Compose 的新应用 现有项目中支持Jetpack Compose 基于现状,我主要介绍第三种方式: 配置Kotlin...包含了基本组件compose.uiMaterial Design 组件、动画组件等众多UI组件,在此我就不赘述了,在对应的文档中大家都可以参阅,此处我重点讲解一下关于Compose的关键点 ####...并且@Compose跟协程的Suspend的使用方法比较类似,被@Compose的注解的方法只能在同样被@Comopse注解的方法中才能被调用。...相关的代码,会显示如下图的一个横条通知,点击Build&Refresh即可更新显示所更改代码的UI。...,所以只要连续调用想要使用的方法即可。

6.2K60

UI2Code 之 利用 antd.sketchapp 生成训练数据

类似的基于 Material Design 我们也可以实现一个 MD.sketchapp 。...Code2UI 这件事实现起来还算简单,UI2Code 这件事就显得有点难度了,基础的工作有 MD 的 sketch 插件,设计师可以很方便的在 sketch 里生成 Material Design 的...CNN 需要大量的训练数据,我们可以尝试下利用 antd.sketchapp 大量生成 Code 及 UI 图像的成对数据。...所以训练数据集,需要设计一套 DSL ,利用 Sketch.app 生成大量配对的数据,并把 DSL 转化为 CNN 训练使用的 Label 数据。...为了这个目的,你完全可以 利用已有的语言(比如 JavaScript ),通过动态调用它们的编译器来达到这个目的,而 不需要创造新的 DSL 。

1.4K70

第三方平台可以通过微信公众平台素材管理接口实现同步了

(4.29更新第三方平台也能为未微信认证的订阅号调用自定义菜单接口和素材管理接口)   微信公众平台素材管理接口具体如下: 新增临时素材 公众号经常有需要用到一些临时性的多媒体素材的场景,例如在使用接口特别是发送消息...接口调用请求说明 http请求方式: POST/FORM,需使用https https://api.weixin.qq.com/cgi-bin/media/upload?...access_token=ACCESS_TOKEN&type=TYPE 调用示例(使用curl命令,用FORM表单方式上传一个多媒体文件): curl -F media=@test.jpg "https...获取临时素材 公众号可以使用本接口获取临时素材(即下载临时的多媒体文件)。请注意,视频文件不支持https下载,调用该接口需http协议。 本接口即为原“下载多媒体文件”接口。...https协议 接口调用请求说明 http请求方式: POST,https调用 https://api.weixin.qq.com/cgi-bin/material/get_material?

3.1K50

webstorm插件集合

文件 – 设置 – 如图 就可以了 插件 Sexy Editor 我用来设置右下角的图 效果如下 设置步骤: 文件 – 设置 – 其他设置 – 如图 保存即可,若无效果...图标插件 Atom Material Icons Enable File Icons 文件图标 Enable Directory Icons 目录图标 Enable UI Icons 顶部UI 图标...使用也很方便,可以直接选中中文右键翻译,也可以直接选中用快捷键Ctrl+shift+Y。 彩色括号 Rainbow Brackets 可以实现配对括号相同颜色。...代码缩略图 CodeGlance2 正则插件 any-rule 安装好后使用方法: 法一:右键->AnyRule 法二:Alt+a 会打开下图弹窗就可选择对应或搜索正则即可 换主题插件...Material Theme UI Lite Material Theme UI 主题 Atom One Dark 更推荐这个 a.

1.8K20

Mac开发跬步积累(五): Dark Mode下适配你的UI界面

,典型的案例就是设置控件的icon(比如一个播放或者暂停的按钮).这种方法需要配合使用图片编辑软件(项目中的话通常就是UI设计师来处理)制作图片模版,具体使用仅需两个步骤即可: UI设计师需要根据场景设计图片...变化时自动调用drawingHandler中的代码进行图片创建,从而实现适配效果; 0x03: 自定义View 适配(NSView) 当改变当前的appearance,AppKit会自动调用NSView...的下面几个方法(根据情况调用) updateLayer() draw(_:) layout() updateConstraints() 这样我们就有机会在变更appearance,通过重载上面的方法来实现自定义...Deprecated NSVisualEffectView.Material.ultraDark Deprecated 0x06: 当appearance 切换,应避免耗时操作 当切换系统的...Appearance,AppKit会同时更新UI控件,这部分工作通常都是自动完成的.但有时也会调用开发者编写的代码,例如你使用了NSImage的draw handler 方式创建图片对象,又或者使用

2.2K20

Material Design技术分享

Part1:什么是Material design   自2014年谷歌在I/O大会发布Material Design,至今已经两年多,其遵循纸片与墨水的视觉设计,并将物理运动带入到UI设计中,google...因为Material Design本是一种考虑事物本质的设计,将电子屏幕里的UI元素看成是一种不存在于现实世界的新的材质,并赋予它类似纸片与墨水的物理特性。...enterAlwaysCollapsed:当你的视图已经设置minHeight属性又使用此标志,你的视图只能以最小高度进入,只有当滚动视图到达顶部才扩大到完整高度。   ...,因为官方文档提供有限,在做项目期间尝试了很多动画,有些动画出来以后存在体验BUG或者是动画效果不符合预期,这些都需要一点一点的改进,不过google也一直致力于完善Material Design的设计规范...的设计初衷,Be Together,Not The Same.我们需要做的就是不断尝试于不断突破~也希望官方能提供给开发者更多的支持与更健全的开发平台,真正实现Material Design everywhere

2.1K60

Flutter Provider状态管理---八种提供者使用分析

Provider Provider是最基本的Provider组件,可以使用它为组件树中的任何位置提供值,但是当该值更改的时候,它并不会更新UI,下面我们给出一个示例 第一步:创建模型 class UserModel...第一步:创建模型 细心点我们可以发现这里定义的模型有两处变化,如下: 混入了ChangeNotifier 调用了notifyListeners() 因为模型类使用了ChangeNotifier,那么我们就可以访问...notifyListeners()并且在调用它的任何时候,ChangeNotifierProvider都会收到通知并且消费者将重建UI。...], ), ), ); } } 复制代码 运行结果 FutureProvider 简单来说,FutureProvider用于提供在组件树中准备好使用其值可能尚未准备好的值...方法时会改变UserModel5里面的name,当然我们在实际开发的过程中并不是这么简单,这里只是演示模型依赖如果使用ProxyProvider import 'package:flutter/material.dart

4.1K00

解决Material Theme UI插件收费问题

前言 webstorm 2021.1 版本更新后,一直使用Material Theme UI主题开始收费了,如果不付费的话,文件树那里格外的小,看起来十分的难受。...Material Theme UI介绍 这是jetbrains公司旗下所有软件(webstorm、idea、datagrap等)都可以使用的一款主题插件,它有10几种主题可以选择,可以让你的编辑器看起来十分美观...Theme和Atom One Light Theme主题,分别对应的是夜间模式和白天模式,此处给大家展示下两种模式下的效果,如下图所示: image.png image.png 上述效果图中除了使用了...Material Theme UI插件外,我还安装了Atom Material lcons插件,这个是用于图标美化的。...解决方案 在Material Theme UI插件官网上找了下它的历史版本,都尝试了下,发现5.7.0版本是最后一个免费版本,且支持最新的webstorm。

5.7K30

想做前端开发?推荐几个必备珍品组件库

://material-ui.com/ GitHub仓库地址:https://github.com/mui-org/material-ui 维护团队:material-ui material-ui 是基于...Google Material Design[1] 设计语言开发的 React UI 组件库。...material-ui 团队维护频率很高,下图是 material-ui 主要的开发者的Github首页 基本上每天的都会有提交,而且最多一天有36次的提交。...组件数量上基本覆盖了中台日常需要使用的组件 代码层面:文件结构清晰,组件的定义简洁明了,适合学习 生态:mint-ui[3] (Mobile UI elements for Vue.js) element-angular...生态:官网提供了物料市场,组件库,如果写小程序可以推荐尝试 References [1] Material Design: https://material.io/design/ [2] 设计原则:

2.7K50

【Flutter】自定义滚动开关

switch是两个状态的UI组件,用于在ON(选中)或OFF(未选中)状态之间切换。通常,它是带有拇指滑块的按钮,用户可以在其中来回拖拉以选择其他选项,例如“开”或“关”。...为了保持状态,它将调用onChanged属性。假设此属性的价值回报为true,则此开关为ON,为OFF则为false。当此属性无效,开关小部件会失效。...它显示了自定义滚动开关如何在flutter应用程序中使用lite_rolling_switch包工作。...LiteRollingSwitch有一些属性是: **onChanged:**当用户打开或关闭开关,将调用此属性。 **value:此属性用于确定此开关是打开还是关闭。...img 完整实现 import 'dart:ui'; import 'package:flutter/material.dart'; import 'package:lite_rolling_switch

33.3K60

聚焦 Android 11: UI 与 Compose

要了解响应式思维方式以及如何使用 Compose 构建应用,可以观看视频 了解 Compose 的编程思想。...要了解如何将其添加到您的应用中,欢迎访问相关 视频、博文 以及 示例应用… Material Design 组件 我们 建议 您参考 Material Design 指南,确保应用一致运行,以及应用的使用习惯可以延续...官方文档介绍了使用 Material Design Components (MDC) 库 的 Material Theming (颜色、类型 和 形状)、深色主题以及 Material 的 动效系统。...采用 MDC 可以使您的代码库为以后尝试 Jetpack Compose 做好准备,他们使用了相同的概念、设计词汇以及组件。...知识点 无论您是使用当前的 UI 工具包进行构建,还是为下一代做准备,我们都希望本期分享的资源能够帮助您打造深受用户喜爱的 UI 界面。感谢大家收看或加入我们的 AMA。

1.7K30
领券