资源中心
免费商用字体:斗鱼追光体2.0下载,适合用于标题的加粗斜黑体
这个字体比较适合运用在标题的字数比较少的场景。形态上和优设标题黑比较类似,不过更加圆滑自然一下。 斗鱼追光体,是由斗鱼武汉研发部UED提供指导,品牌组设计成员主导设计的全新品牌字体。很多人会问,斗鱼为什么要设计自己的字库,我们并非心血来潮,作为一个在国内知名的直播平台公司,我们需要统一的字体来发声,来表现企业自身的风格,并且向外界传递我们自己的品牌特质。我们也想统一公司内所有的子品牌标志与各项目的宣传形象,在视觉上用同一种声音来凸显斗鱼。我们希望用户想到斗鱼公司时,是会联想到一个具有活力、上进,且具有娱乐性质的科技型公司。我们设计团队也是秉承着这些,来设计这套字体。 斗鱼追光体同步上线斗鱼官网和字由平台,所有用户均可免费下载,可在不同平台上使用。 斗鱼追光体是符合GB2312简体中文编码字符标准的专属品牌字体。是拥有一种标准版字重,包含6763个中文字符,100个西文及数字符号。随着斗鱼品牌场景的日益丰富,斗鱼追光体能逐渐适配平台的各种场景。 关于版权:斗鱼追光体,允许任何个人和企业免费使用,包括商用用途,但禁止用于商标注册或违法用途。 字体预览 下载地址官网地址:去 ...
资源中心
免费商用字体:MiSans 下载,小米Sans黑体全字重10种字重下载
MIUI 13 采用全新系统字体 MiSans; 笔型平直有力,设计更加简约,减少视觉负担,更有利于屏幕显示。共包含29,093个字符,支持多种语言。MiSans 提供了多种 OpenType 功能,可根据特定需求来选择不同形态的字符,例如某些标点符号可以根据周围字母的形态自动调整至合适的位置。MiSans字重齐全,层级清晰,10个字重全部开放下载,供全社会免费商用。 字体展示 字体功能调用及实现font-feature 属于 Opentype 中的高级排版功能,也就是可以让字体排版更加精致,符合实际设计、开发需求,可根据特定设计需求选择不同的字体形态。大部分软件都可以通过 Opentype 面板访问此功能。 下载地址MiSans提供了非常多的十种字重,基本涵盖了全部场景。 MiSans-Heavy.ttf MiSans-Semibold.ttf MiSans-Thin.ttf MiSans-Medium.ttf MiSans-Normal.ttf MiSans-Regular.ttf MiSans-Light.ttf MiSans-Demibold.ttf MiSans-Ex ...
经验分享
SwiftUI打开Mac系统偏好面板方法,打开指定偏好设置面板指定设置
mac程序经常会用到要求用户更改安全设置、隐私设置等问题的情况,所以需要弹出系统设置界面让不精通mac操作的用户能够轻而易举的修改偏好设置。 使用URL Scheme首先我们想到的就是使用urlScheme来打开窗口。在swiftUI下使用urlScheme非常容易。 我们需要在结构体中引用 1@Environment(\.openURL) var openURL 之后我们来打开url 1openURL(URL(string: "https://blog.zhheo.com/")!) 我们就完成了一个打开网页的操作。将网页url更换成urlScheme同样可用。 那么需要更改成什么url呢? URL Scheme 格式部分控制面板支持通过 URL Scheme 进行访问。在各个控制面板对应的 .prefpane 文件里的 Info.plist 中,如果有下面这一键值对,则表示这个面板支持 URL Scheme: 12<key>NSPrefPaneAllowsXAppleSystemPreferencesURLScheme ...
我的开发
神秘新品 - 已无法上架,好可惜
这个应用还未出生就已经夭折了,好可惜。 热门图标 图标采用的是Apple推出的SFSymbols,你可以到苹果的官方网站下载图标库自定义你喜欢的图标。或者你可以在下面的图标推荐列表中选择你喜欢的图标进行使用。 自定义你的图标你可以到在线网站中方便的查看图标的名称。 如果你无法访问网站或者想要使用最新的图标,你可以下载SFSymbols查看更多图标的名称。(注意,SF符号中包含了只有macos12才可以使用的图标,如果发现输入了图标没有显示,则意味着这个图标不支持你当前的系统,macos11用户请下载SFsymbols2)。 找到喜欢的图标之后,左键单击选中后再右键单击选择「拷贝名称」 粘贴到App中 新建窗口我们就能看到全新的图标效果啦! 灵感来源:Loaf
经验分享
未能打开文稿,文件与 QuickTime Player 不兼容,mac无法空格预览XMF视频文件解决方法
今天处理了一个比较棘手的问题,有一台机器无法空格预览XMF文件,并且QuickTime Player也无法播放,提示文件与QuickTime Player不兼容。这可就太烦了。众所周知,专业录像用的都是XMF格式文件,但是只能用第三方播放器播放不仅需要双击,而且没有预览图,没有办法快速的去找素材。旧系统的电脑都能正常浏览,但是新系统的电脑却无法播放,所以排除了系统更新和QuickTime Player版本的原因。联系苹果客服苹果客服也不知道什么情况。 专业视频格式其实这个问题我首先想到的是电脑的视频解码器不兼容的原因造成的,谷歌搜了半天也没找到解码器(只发现一堆垃圾视频软件网站写的水文教程)。 后来还是看了苹果的官方文档才看到,如果需要浏览XMF格式,需要电脑有专业视频格式这个软件。(其实就是个编码器)从这个版本更新中我们可以看到专业视频格式的作用。 首先我们来判断一下这个问题是否是电脑没有配备「专业视频格式」造成的。首先我们进入系统信息。按option点击苹果 在系统信息中我们可以看到历史安装的软件,看看有没有「专业视频格式」,如果没有「专业视频格式」说明你的电脑并没有支持X ...
经验分享
Intel芯片Mac安装Windows双系统教程,记录一次帮别人装windows系统过程
最近帮别人装了一次windows双系统,感觉mac装windows简直不要太简单,就来简单说一下安装方法和安装的过程吧。 下载windows镜像首先我们需要下载windows操作系统,说起下载系统我们首先自然想到的就是MSDN了(无广告和捆绑软件),MSDN作者做了一个新的站用来存放最新的镜像,所以我们可以到新的网站去下载windows镜像。 登录后进入首页,点击使用。 选择windows10,不建议mac安装windows11。 我们可以看到下载地址了,我们复制ED2K地址,粘贴到支持ED2K下载的软件(推荐迅雷)。 迅雷添加任务粘贴链接即可。 我们将安装包保存在「下载」文件夹中。就可以开始下一步了。 启动转换助理在启动台的「其他」文件夹中有一个「启动转换助理」App,你可以通过这个软件轻松的安装和卸载windows。 我们点击继续。 如果遇到外置设备提示,我们就需要检查一下是否插着U盘或者移动硬盘,将它们推出之后再重试。 稍微等待一会,如果你开启了time machine,可能需要等待更长的时间。 如果你的windows镜像在「下载」文件夹,它可以自动识别wind ...
网站公告
Heo202112更新日志:设计师的比例计算工具推出,新增波吉等表情
比例计 1.1在 App Store 中的 比例计 因为定好了很多图片的比例,例如部分人像给了2:3的比例,但是在UI图绘制的时候就需要遵循这个比例。根据屏幕宽度设置好宽度之后,却不知道高度应该是多好,还需要运算。比例计可以解决这个麻烦,让你不需要计算,通过图片比例可以计算另一个参数。 额外支持输入长宽数据来计算比例。 Heo-Sticker 0.15在 Blog 中的 Heo-Sticker 新增恶魔系列,并将猪头移动到动物系列中 HeoMusicTop在 Blog 中的 HeoMusicTop 新增「天地龙鳞」等10首歌曲。
经验分享
中文可变字体:思源黑体升级版,opentype使用教程,免费可商用字体下载
才发现思源黑体是可以支持opentype可变字体,之前一直用的都是不支持可变字体的思源黑体,在这里提供一个支持opentype版本的思源黑体下载地址,方便下载使用。 Sketch使用可变字体Sketch支持opentype可变字体,并且提供一个单独的「可变字体选项」用于调节可变字体。 你可以在窗口内调整可变字体能够调节的参数。 Photoshop使用可变字体在「属性」窗口中你可以自由的调节opentype可变字体的参数。 并且如果你的字体支持更多属性时可以使用「字符」窗口来调节字体的特征。 下载地址蓝奏云下载 百度网盘 公众号回复:思源黑体获取提取码
经验分享
Sketch如何给组件黑白效果?将指定元素调整黑白或者调整颜色
在国家公祭日的时候我们可以看到很多应用的首页都是黑白效果。我们平常也经常使用黑白效果来表达这个组件已经失效。那么组件我们可以通过制作一个单独的黑白组件来进行替换,但是这个方法不适用与开发去表达。 需求我有一个卡片,卡片整体是图片传过来的,但是我想通过黑白效果来表达这个卡片已经失效了。这是一个黑白效果的典型用法,但是总不能每种卡片都添加一个黑白的样式图吧,所以就用到了混合模式。 在需要的元素上绘制混合层在我举的例子中,一个正常的卡片是这样的 背景层的图片是后端直接传到前端的(包括颜色也是属于卡片)。前端对于卡片的编辑只剩下文字。那么不同种类的失效卡片都需要黑白效果时,就需要用到混合模式了。 我这里以做黑白效果为例,其他效果可自行探索。 绘制一个覆盖卡片的纯黑矩形。 调整混合模式选中黑色层,点击混合模式按钮,选择任意一个色彩相关的混合模式。 我们就可以直接看到颜色的变化了。 组件制作我们也可以将这个黑色层放入卡片的组件中,然后将黑色层设置为组件,这样的话我们就可以直接调整卡片一键切换是否黑白了。
经验分享
批量去视频片头,利用ffmpeg批量剪切视频时间,批量去片头片尾
有个需求就是想要能够批量去除100个视频的前8秒片头广告。找了一圈没有比较好的免费工具(为什么都好贵啊,500多块钱我真的望而却步,收1块我觉得最高了),那就只好用ffmpeg来搞一下了。步骤看似复杂,需要代码,但是实际操作下来还是比较容易的,没有编程经验的小伙伴也不要被代码吓倒。 windows端下载beizi1754提供的ffmpeg去片头片尾批处理文件 原作者分享链接 密码:6fpt 防丢博主备份链接 移动文件将ffmpeg和bat文件复制到视频所在文件夹,右键编辑bat文件 设置好片头片尾的时长 双击运行即可 mac端mac端的话因为ffmpeg没有提供一个固定片尾的方法,我这因为windows已经解决需求了就没深入研究。这里只提供去片头的方法。 安装Homebrew首先我们需要安装Homebrew。homebrew是一个安装工具,通过homebrew我们可以轻松的安装和管理程序。 打开启动台,在「其他」文件夹中打开「终端」App,输入: 1/bin/zsh -c "$(curl -fsSL https://gitee.com/cunkai/HomebrewC ...
翻译内容
潘通 2022 年度色发布:PANTONE 17-3938 长春花蓝
少废话,先用上长春花蓝1234sRGB:102 103 171Hex:#6667ABLAB:45.75, 12.21, -36.75CMYK:70 63 9 0 数据来自官网 潘通发布2022年度代表色 一个新的彩通色彩,以勇气十足的风貌激发个人的创意与创作力。 var player = new DogePlayer({ container: document.getElementById('player'), userId: 3011, vcode: 'ae87d9847d44aabd', autoPlay: false }); 我们生活在一个彻底转变的时代。PANTONE 17-3938 长春花蓝正是此时此刻全球精神的象征,也代表着我们正在经历的转换。当我们脱离了一段密集隔离的时期,我们的想法与标准都在改变, 我们的实体与数码生活也以新的方式结合在一起。数码设计协助我们扩展现实的局限,打开大门迎向充满活力的虚拟世界,探索与创造新的色彩可能性。随着电子游戏的潮流,元宇宙观念的日益热门以及数码空间里艺术社群的兴起,PANTONE 17-39 ...
经验分享
js控制Gif动态图片的播放,鼠标悬浮状态开启GIf播放
我的博客右下角有一个小Guli的形象,他一直在看左上方的文章。这个是当初设计这个元素的原因,也是在边缘视觉给予用户的焦点暗示。当用户出现分心的时候,因为人类对眼球的视觉捕捉一般都是最快(即便是guli这个形象眼睛与人类相比很奇怪),所以人们在分心的时候看到Guli后很容易拉回视觉焦点到文章上。 情景但是感觉有点缺少灵魂,首先就是对于鼠标的交互太少了,最开始的时候只有一个css写的鼠标悬浮状态变小,感觉没有交互。后来发现可以通过js重新设置图片src地址来重置播放。 1document.getElementById('guli_gif').src = document.getElementById('guli_gif').src 那么就容易多了。 代码首先一个只播放一遍的Gif+触发事件重新播放的js。 我这里设置成了鼠标悬浮状态会触发 1234var gulitop=document.getElementById('guli_gif'); gulitop.onmouseover=function(){ docum ...
经验分享
适老化设计的看法,app如何进行适老化设计
国家鼓励应用推出适老化模式,针对大龄人群进行独立的设计。一方面迎合社会的老龄化日益严重,一方面疫情让更多老年人接触到手机和互联网,也算是帮助国家更多的互联网边缘人口连接起来。对于应用的适老化设计,以下是几个设计的思考方向。 用的人是谁相比于前一阵强制的青少年模式,很多人深恶痛绝的点就在于:明明知道用的这个人是个成年人,但是还是会天天弹出使用青少年模式的弹窗,让人不胜其烦。相比容易被家长借手机的青少年不同,老年人一般会具备使用设备的所有权。所以第一次安装时的选择非常重要。适老化最需要的就是第一步的提示。 让用户知道:他是否需要适老化模式。 如果以60岁以上的年龄层为用户画像的话,找到适老化模式的入口非常不易。但是对于整个app的用户体量来说,老年人的用户量并不庞大,带来的经济效益也非常低。一般来说入口就会放置在不起眼的位置,甚至需要点击「我的」滑动很久或者跳转多个页面才可以进入这个模式。 解决方法就是需要在用户安装这个应用的第一刻起知道为用户提供什么模式,开启了,就不会变更。(如果变更了,就说明其他问题,后面再说)。 应用需要提供非常显著差异的提示、包括模式切换适用于什么样的人群。并不代 ...
翻译内容
掌握 SwiftUI 中的 FocusState 属性包装器,输入框焦点判断
本文为翻译内容,来自swiftwithmajid翻译:张洪Heo推荐访问原文地址:立即访问 SwiftUI 在上次 WWDC 期间变得非常强大。我们获得了许多新功能,其中之一是全新的FocusState属性包装器。FocusState属性包装器允许我们读取和写入视图层次结构中的当前焦点位置。本周我们将学习如何使用FocusState属性包装器和聚焦视图修饰符在 SwiftUI 应用程序中管理焦点。 关于FocusStateSwiftUI 提供了一个新的FocusState属性包装器,适用于所有 Apple 平台,并允许我们专注于特定视图或检查该视图是否已经获得焦点。使用起来毫不费力。让我们看看如何使用它。 12345678910111213141516171819import SwiftUIstruct SignInView: View { @FocusState private var isEmailFocused: Bool @State private var email = "" var body: some View ...
经验分享
Xcode13软件使用自定义字体方法,swiftUI使用otf、ttf文件方法
在项目中不可避免使用到自定义字体,但是Xcode13将配置自定义字体的info.plist文件移除了。虽然我们可以通过各种奇怪的操作将文件恢复回来,但是时代总是在进步,总不能一直用旧的吧。 其实Xcode13已经给我们提供了编辑info的方法,就在target的配置中。 将字体文件拷贝到项目中首先打开字体册app,找到需要的字体,选择在访达中显示 拖拽到项目中,勾选target 编辑info 添加自定义字体配置在Custom iOS Target Properties中点击加号新建一个第一层级的配置项。 填写Fonts provided by application 展开后在item后面填写字体文件名和扩展名 查看字体全名我们使用之前需要知道这个字体叫什么。在访达中查看字体信息。右键单击文件选择显示简介。 在SwiftUI中使用12Text("自定义字体") .font(.custom("字体名称",size:27)) 参考链接Adding custom font to Xcode 13 ...
网站公告
Heo202111更新日志:DelSpace支持自动化,轻节食支持自定义能量
很高兴能为大家带来一些令人兴奋的更新。本次带来了非常多的更新,我已经迫不及待分享这些项目进展给大家了。 Acrylic 3.12在 浏览器 中的 Acrylic 示例网站 博客的界面一直备受欢迎,为很多同样喜欢Hexo魔改的朋友提供了一些思路和灵感,这应该是Acrylic的使命。 本版本在视觉上更新了全新的角标风格,你可以在很多地方看到它。在必要的情况下做提醒、在不必要的情况隐藏。首页的文章分类部分因为点击率过低,并且阻碍视觉路径而被隐藏;友情链接推荐标签可以将上百份友链添加视觉着陆点,避免表格元素过多引起的眩晕感。 虽然是个比较小的努力,但是终于被解决,这个问题就是导航栏的卡顿问题。现在滚动页面时,你可以看到流畅的移动动画。 因为原有的分类需要悬浮状态打开,所以现在封面会被更完整地展现。 还有更多更新: 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152### v3.12- 导航栏新增前往张洪Heo主页(zhheo.com)的按钮【突破性更 ...
经验分享
SwiftUI 格式化数字方法,Double转String去除0的占位,防止科学计数法
数字和文本之间的转化是我们经常用到的,例如TextField只能是String的Bing(当然Xocode13 for iOS15/mac os 12以上已经支持其他格式)。 常用的转换形式我们经常使用字符串格式说明符来更改格式,例如 1234567import Foundationvar number = 123.239var stringNumber = String(format: "%.2f", number)print(stringNumber)//输出 123.24 在SwiftUI的Text中我们也可以使用specifier来格式化显示的文本 1Text("\(number, specifier: "%.2f")") 常用的数据格式一般来说我会常用%.2f这种固定小数点位数的,代表小数点后固定两位。整数直接转基本没什么问题。麻烦就在于Double转String时,去除小数点后多余的0。例如使用%f会产生多余占位符,使用%g当数字很大时会用科学技术法表示。 123456var number: Double = ...
经验分享
子级a标签href避免触发父级onclick的方法,子元素阻止冒泡
因为点击超链接是个特别麻烦的事情,需要鼠标移动到指定的标题才可以(这真的是太累了)。所以博客的文章卡片、分类页面都是不需要鼠标移动到标题就可以点击进入跳转页面的。我是通过给父级元素添加onclick的方式来添加跳转。但是这就出现了一个问题,点击标签的时候会从子元素的事件触发一遍,然后再触发父元素事件。也就是说点击标签的时候会跳转两个页面。 如何解决这个问题呢? 添加事件给子元素添加下面的onclick事件: 1window.event.cancelBubble=true; 可以阻止子元素的点击事件触发父元素的事件。我们使用html的时候可以添加: 1onclick="window.event.cancelBubble=true;" 完整例子(子元素): 1<a class="article-meta__tags" href="/tags/%E5%BF%85%E7%9C%8B/" event.cancelbubble="" onclick="window.event.cancelBubbl ...
经验分享
AE插件AutoSway下载及使用方法,AE随风摆动效果生成插件
AutoSway是一个非常棒的随风摆动动态效果生成的插件,广泛应用于B站等视频插画领域。比如经常可以在拜年祭的mv中看到裙子衣服随风摆动,大多数情况下就是插画师画完用AutoSway直接生成的。方便快捷,效果很棒。 使用环境 下载地址关注张洪Heo公众号回复AutoSway获取蓝奏网盘下载链接。 操控点模式最简单的使用方式就是打点然后一键生成。首先我们使用「人偶位置控点工具」从运动起始点开始向外标记。Guli站在地面,所以以地面为基准点,向头部标记打点。 点击「窗口」,打开AutoSway 框选所有点,点击apply添加。(所有点也可以直接保持一条竖线,这里打点的位置没有限制) 添加完成之后播放你就可以看到效果了! 效果演示 当然同一个图层你可以添加多套标记。 调整参数你还可以调整摆动的参数,来让摆动更符合你所需要的。调整的图层是第一个点所对应的图层。 调整后效果。 图层模式另外支持图层绑定的方式。例如我们创建了很多个灯笼(图来自emoji🏮)。注意图层的选中顺序为基准图层到最外面的图层。 我们需要调整每个图层的旋转中心。这个案例中,我们需要将每个图层旋转中心调整 ...
经验分享
Photoshop去除文档中的半透明水印,彩色水印,色阶去水印方法
我们通常是使用补颜色、补像素的方式来去除水印。但是对文字较多的场景,例如文档,我们可以看到一旦通过补像素的方式去水印就会影响文字的可读性,所以文档去水印不能使用做选区,补像素的方式。 色阶去除水印使用Photoshop打开图片,我们新建一个色阶的调整图层 将文档的水印部分设置为白场。点击「在图像中取样以设置白场」,在激活状态下点击水印。 然后我们将文档的文字部分加深,激活「在图像中取样以设置黑场」,点击中间的文字部分 如果只需要黑白文档的话效果会更好。通过增加一个「黑白」调整图层。 效果预览 感谢@小魏提供的素材
经验分享
SwiftUI中ForEach如何获取当前的index,获取foreach循环排序号
foreach的view循环是比较常用的循环方式,有的时候例如list/form项目需要点击时,需要告诉下一层级我们点击的是哪个东西。所以这个时候我们就需要获取点击项目的index信息。 使用数组范围1234567891011121314struct ContentView: View { @State private var array = [1, 1, 2] func doSomething(index: Int) { self.array = [1, 2, 3] } var body: some View { ForEach(0..<array.count) { i in Text("\(self.array[i])") .onTapGesture { self.doSomething(index: i) } } }} 使用索引索引属性 ...