首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

Flutter 上字体的另类玩法:FontFeature

image 我们知道 Flutter 默认在 Android 上使用的是 Roboto 字体,而在 iOS 上使用的是 SF 字体,但是其实 Roboto 字体也是分很多类型的,比如你去查阅手机的 system.../fonts 目录,就会发现很多带有 Roboto 字样的字体库存在。...image 所以 Roboto 之类的字体库是一个很大的字体集,不同的 font-weight 其实对应着不同的 ttf ,例如默认情况下的 Roboto 是不支持 font-weight 为 600...' 、 'Segoe UI' : 名称 值 Android,Fuchsia,Linux Roboto iOS .SF UI Display,.SF UI Text MacOS .AppleSystemUIFont...当然,前面我们说了那么多,主要是针对英文的情况下,而在中文下还是有差异的,之前的文章也介绍过: 默认在 iOS 上: 中文字体:PingFang SC 英文字体:.SF UI Text 、.SF

1.8K20

Flutter 上默认的文本和字体知识点

正如下图所示,它们的 G 字母在显示效果上会有所差异,比如 平方的 G 有明显的转折线。 ? image 这时候我不禁产生的好奇,在 Flutter 中引擎默认究竟是如何选择字体?...通过官方解释,在 typography.dart 源码中可以看到, Flutter 默认在 Android 上使用的是 Roboto 字体; 在 iOS 上使用的是 .SF UI Display 或者...SC 英文字体:.SF UI Text 、.SF UI Display 默认在 Android 上: 中文字体:Source Han Sans / Noto 英文字体:Roboto 也就是就 iOS...上除了 .SF 相关的字体外,还有 PingFang 字体的存在,这时候我突然想起在之前的 《Flutter完整开发实战详解(十七、 实用技巧与填坑二)》 中,因为国际化多语言在 .SF 会出现显示异常...macOS 或 tvOS 上运行使用,所以如果使用了 Cupertino 主题的话,在 Android 上运行时使用 fallback font。

3.5K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    macOS下由yarn与npm差异引发的Electron镜像地址读取问题

    记录macOS下由yarn与npm差异引发的Electron镜像地址读取问题 写在前面:该问题仅仅出现在Linux和macOS上,Windows上不存在该问题!...笔者由于是新的机器,还没有配置改值,所以找到.npmrc文件的配置了上述的镜像后,便开开心心的准备进行项目搭建了。...: 找到这个包的缓存(macOS上的路径为:~/Library/Caches/Yarn/v6/npm-@electron-get-xxxx): 找到上述indexjs代码,并添加一段日志打印: 准备完毕以后...然而,如果我们使用npm进行安装的时候: npm install -D electron 又能够很快安装。Why?!难道npm和yarn下的运行环境有差异吗?...macOS解决方式 终于,我们能解释为什么当我们在.npmrc配置大写的ELECTRON_MIRROR的时候,使用yarn add -D electron安装electron的时候,二进制镜像地址没有生效了

    44620

    【CSS】955- 你该知道的字体 font-family

    是一种特定的字体吗? 字体基础知识 在继续之前,我们先简单回顾关于字体的一些基础知识。 衬线字体与无衬线字体 就 Web 常用的一些字体而言,其实大体上分为衬线字体和无衬线字体。...无衬线字体 -- 关键字为 sans-serif,也就是无衬线的意思。专指西文中没有衬线的字体,与汉字字体中的黑体相对应。...与衬线字体相反,该类字体通常是机械的和统一线条的,它们往往拥有相同的曲率,笔直的线条,锐利的转角。...Roboto Roboto 是为 Android 操作系统设计的一个无衬线字体家族。Google 描述该字体为“现代的、但平易近人”和“有感情”的。...[14] ,持续更新,欢迎点个 star 订阅收藏。

    5K20

    Web 字体 font-family 再探秘

    是一种特定的字体吗? 字体基础知识 在继续之前,我们先简单回顾关于字体的一些基础知识。 衬线字体与无衬线字体 就 Web 常用的一些字体而言,其实大体上分为衬线字体和无衬线字体。...无衬线字体 -- 关键字为 sans-serif,也就是无衬线的意思。专指西文中没有衬线的字体,与汉字字体中的黑体相对应。...与衬线字体相反,该类字体通常是机械的和统一线条的,它们往往拥有相同的曲率,笔直的线条,锐利的转角。...value (only on macOS) 考虑到不同平台及向后兼容,在 macOS 和 iOS 上,我们需要使用 -apple-system 及 BlinkMacSystemFont来兼容适配 system-ui...Roboto Roboto 是为 Android 操作系统设计的一个无衬线字体家族。Google 描述该字体为“现代的、但平易近人”和“有感情”的。

    2.5K10

    jupyter notebook 主题自定义

    ✅作者简介:人工智能专业本科在读,喜欢计算机与编程,写博客记录自己的学习历程。 个人主页:小嗷犬的博客 个人信条:为天地立心,为生民立命,为往圣继绝学,为万世开太平。...---- jupyter notebook 是我们常用的 Python 编辑环境,但是它的配色风格与字体风格却有些单调,使用久了难免有些厌倦,本文将教大家更改 jupyter notebook 的主题和字体...进入以下路径: 你的Python位置\Lib\site-packages\jupyterthemes\fonts 选择你刚刚添加的字体类型: 进入对应分类子文件夹下,创建与你字体同名的文件夹...4.自用主题字体分享 以下为笔者自己在用的主题和字体: 设置命令(需要Consola字体): jt -t onedork -f consola -fs 14 -cellw 80% -ofs...14 -dfs 14 -T

    60620

    fonts.googleapis.com访问太慢导致站点加载很慢

    虽然最后能看到网站,但实际上谷歌字体依然加载失败了,这个体验就非常差劲了。 解决方法 实际上这个谷歌字体是可以不需要去访问的,当然有强迫症的可以靠访问国外网站等某些操作来达到快速加载的目的。...个人建议是直接屏蔽掉这个谷歌字体的访问,一般都会在浏览器安装adblockplus等广告拦截插件,可以在这些广告拦截插件添加新的拦截规则: 1 ||fonts.googleapis.com 这样就可以拦截谷歌字体的访问...方法一 使用360提供的cdn,将需要加载的谷歌字体的url放到360的Google 字体库搜索,会得到一串css代码,将代码拷贝到一个css文件中然后站点直接引入该css文件即可。...family=Roboto+Mono|Source+Sans+Pro:300,400,600这个谷歌字体,那么前往360的Google 字体库搜索得到如下代码: 1 2 3 4 5 6 7...甚至还可以将css文件里的字体文件woff或者ttf等下载下来,然后把css代码里的字体文件链接全改为本地的字体文件,之后依然是在站点中引入css文件即可。

    4.3K10

    微软 Outlook 如何修改邮件列表中的字体或字号

    因为电脑的操作系统是默认英文的,默认的字体实在是太难看了。 解决方案 我们是可以对字体进行修改的。 例如修改成下面的方案。 选择视图 首先,先选定顶部的视图。...当前,我们选择的字体为 Open Sans,这个字体是 Google 的字体,但是这个字体不能支持简体中文,也不能支持 CJK。...如果需要选择支持中文的字体,可以选择 Noto Sans 这个字体。 这个字体是能够支持中文的(CJK)。 Noto Sans Noto Sans 这个字体的中文名称为:思源黑体。...因此Noto的开发宗旨即为消除所有无法显示的字符,实现“No tofu”的目标。 Noto和Roboto都是在Android新接口Material design的设计指南中所提及的建议字体。...macOS Big Sur默认安装了Noto部分字体。 至此,我们已经完成了字体的修改。 https://www.ossez.com/t/outlook/14272

    2.4K20

    绘图技巧 | 第七次全国人口普查数据还能这么玩!?技巧都在这了

    地图数据可视化展示 全国人口数据可视化绘制 这一部分小编就使用人口排名前14的数据绘制我们常见的柱形图,可视化代码如下(重要的部分会单独说明): library(tidyverse) library(...全国人口排名前14的可视化展现结果 小编提醒: 这里使用了forcats包中的fct_reorder() 函数对数据进行了排序。使用tidyverse就可以避免重复导入了。...prop==max(prop)) 字体导入。...ggplot2在window上导入字体确实比较麻烦,这里再说一下,小编是通过以下代码导入所需字体的: windowsFonts( kaiti = windowsFont("STKAITI"),...Cinzel = windowsFont("Cinzel"),#这里使用的是字体的主题名称 Poppins = windowsFont("Poppins"), IBMPSBold = windowsFont

    93520

    关于flutter中的TextStyle详解

    String fontFamily 使用的字体名称(例如,Roboto)。...如果字体是在包中定义的,那么它将以'packages / package_name /'为前缀(例如'packages / cool_fonts / Roboto') double fontSize 字体大小...(pt、sp),默认为14个逻辑像素(14pt、14sp) double letterSpacing 水平字母之间的空间间隔(逻辑像素为单位)。...double height 文本行与行的高度,作为字体大小的倍数(取值1~2,如1.2) Locale locale 此属性很少设置,用于选择区域特定字形的语言环境 Paint background 文本背景色...// 文本行与行的高度,作为字体大小的倍数(取值1~2,如1.2)             height: 1,             //对齐文本的水平线:             //TextBaseline.alphabetic

    1.9K30

    绘图技巧 | 不同样式华夫饼图(Waffle charts)绘制技巧

    主要内容如下: R-waffle包简介 R-waffle包样例介绍 R-waffle包简介 使用R绘制华夫饼图最简单的方法是使用waffle包进行绘制(当然,你也可以使用ggplot2的geom_tile...scale_label_pictogram():与geom_pictogram()一起使用,使用Font Awesome字体映射标签。 接下来,通过各种例子介绍上述介绍的绘图函数。...data.frame( parts = factor(rep(month.abb[1:3], 3), levels=month.abb[1:3]), vals = c(10, 20, 30, 6, 14...,例子如下(样例中使用的字体获取方式见文末): #导入字体:比较重要的一步 library(showtext) font_add(family = "FontAwesome5Free-Solid", regular...Awesome字体作为labels的这一功能,同时,小伙伴们也注意下字体的引用哈

    1.6K10

    Material design无需照搬Google

    我们的邮件app最后用了相对简单、接近的配色,采用投影和渐变来区别于Google,同时创造并传达其意义。 字体 ? Google显然具有运用字体传播品牌的力量。...通过创造和统一使用他们的Android预留字体,Droid Sans和Serif,如今则是Roboto和Noto,他们不仅创造了清晰的界面,也强调了品牌。...我们要一套简洁、现代的外观,类似于Roboto——但不尽然。Google Fonts上对的Roboto描述 表现了他们试图让它适用于所有人——他们用了少量词句描述,比如混搭、人文主义还有几何学。...于是我们选了Avenir字体,另一种跨界字体,它源于无装饰的Futura字体,但融入了更多人文主义曲线。不像Roboto或Apple的挚爱Helvetica,它不是混搭字体。...Google的动画效果能给人启发,让人思考事物相互间如何关联与转变,UI元素如何帮助用户接受与登录,界面元素如何取悦用户(而非令他们分心)。 但要确保它最终确有启发性。

    1.2K60

    1.Android系统源代码目录与系统目录

    1.Android源代码的目录中包含了Android系统所有的源代码,从底层驱动到上层应用,Android系统对所有文件都进行了详细管理; 2.而在手机中,Android系统的目录与源代码的目录并不是一一对应的...,而是源代码编译之后,与打包生成的Image文件的结构相同; 3.了解这些目录的结构,对于认识整个Android系统有很好的帮助。...其界如下: 每个目录都具有不同的功能和目的,整个结构关系图如下所示: 2.Android系统目录 在Android手机里,系统的目录结构与源代码目录结构还是有所不同的,.../system/fonts/ 系统字体存放目录,root后可下载TTF格式字体替换原字体,达到修改系统字体的效果: 127|root@vbox86p:/system/bin # cd .. root@...Roboto-BoldItalic.ttf -rw-r--r-- root root 263056 2018-02-15 13:57 Roboto-Italic.ttf -rw-r

    2.6K21

    ​Chrome 87新功能:支持操作相机、访问本地字体

    Chrome 87 稳定版已对外发布,本次主要带来三个重大更新: 相机操作AP:平移,倾斜,变焦 范围请求的service worker支持 字体访问API 下面是 Chrome 开发者 Pete LePage...范围请求的service worker支持 HTTP 范围请求允许服务器只发送 HTTP 消息的一部分到客户端。范围请求在传送大的媒体文件,或者与文件下载的断点续传功能搭配使用时非常有用。...字体访问API Figma,Gravit 和 Photopea 都是非常棒的设计软件,他为我们设计出了非常多优秀的内容,对于许多设计师来说,他们的计算机上安装了一些对他们的工作至关重要的字体。...借助字体访问API,站点现在可以枚举计算机中已安装的字体,从而使用户可以访问其系统上的所有字体。...(Roboto Black) // Roboto (Roboto Black Italic) // Roboto (Roboto Bold)

    1.1K10

    突破限制,CSS font-variation 可变字体的魅力

    从而无需再将不同字宽、字重或不同样式的字体分割成不同的字体文件。我们只需通过CSS与一行 @font-face 引用,即可获取包含在这个单一文件中的各种字体变体。...与可变字体对应的,是标准(静态)字体。...而如果我们想引入一个字体家族(譬如 Roboto 字体族),它可能包含了 “Roboto Regular”(常规字重)、“Roboto Bold”(粗体),或是 “Roboto Bold Italic”...加载可变字体的语法与其他 web 字体非常相似,但有一些显著的差异,这些差异是通过对现代浏览器中可用的传统 @font-face 语法的升级提供的。...等级轴 'GRAD':“等级”一词指的是字体设计的相对重量或密度,但与传统的“重量”不同之处在于文本占据的物理空间不会改变,因此改变文本等级并不会改变文本或其周围元素的整体布局。

    1.2K10

    数据可视化设计指南

    图表类型 用法 Y轴(基准值)* 折线图 呈现少量数据的差异 任何数值 条形图 为了呈现数据中的较大变化,单个数据点与整体的占比情况以及呈现数据排名情况 零 面积图 总结数据集之间的关系,各个数据点占比情况...不要使用多个饼图来显示数据趋势的变化。上图使用了两个饼图表示上个季度与本季度的数据,很难比较每个扇形的大小差异。...规模类别 字体 字形 尺寸 图表标题 Roboto Regular 18pt 图表副标题 Roboto Regular 14pt 数据释义标签 Roboto Regular 22pt 子标签 Roboto...Regular 14pt X、Y轴数值标签 Roboto Regular 12pt 图例标签 Roboto Regular 12pt 图表标题 RobotoRegular18pt图表副标题RobotoRegular14pt...标题和不同的字体权重可以传达哪些内容重要(或不重要)。

    6.1K31

    「深度学习一遍过」必修14:基于pytorch研究深度可分离卷积与正常卷积的性能差异

    本专栏用于记录关于深度学习的笔记,不光方便自己复习与查阅,同时也希望能给您解决一些关于深度学习的相关问题,并提供一些微不足道的人工神经网络模型设计思路。...self.fc2(x)) x = self.fc3(x) return x 模型结构 3 性能比较 参数量 训练时间(秒/百轮) 模型大小 验证集准确率Top 正常的卷积...1,608,722 191.03 6,293 KB 0.9785 深度可分离卷积 60,290 151.77 246 KB 0.9586 训练集与测试集上的 及 曲线比较:(灰线:正常卷积...;绿线:深度可分离卷积) 欢迎大家交流评论,一起学习 希望本文能帮助您解决您在这方面遇到的问题 感谢阅读 END

    67620
    领券