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

iOS15适配

想必都看过WWDC2021Session了,Session原版视频依然是最有效get新特性渠道,iOS15多特性就不说了,我就整理了我在适配iOS15路一些更改和调整。...适配以iOS15 beta6和xcode13 beta5为环境基础 UINavigationBar 用新xcode13编译工程后,导航栏问题比较明显,调试之后发现是UINavigationBar部分属性设置在...来实现,UINavigationBarAppearance是iOS13更新API,应该有人已经在用,我们应用兼容iOS10以上,对于导航栏设置还没有使用UINavigationBarAppearance...,如今在iOS15失效,所以对于呈现问题,做如下适配: 新代码 ...... if #available(iOS 15, *) { let app = UINavigationBarAppearance.init...UITabbar tabbar问题和navigationBar问题属于同一类,tabbar背景颜色设置失效,字体设置失效,阴影设置失效问题 旧代码 ...... self.tabBar.backgroundImage

2.3K30

IOS设计尺寸与字体

冬青黑体( Hiragino Sans GB ):听说又叫苹果丽黑,日文字体Hiragino KakuGothic简体中文版,简体中文有 常规体 和 粗体 两种,冬青黑体是一款清新专业印刷字体,小字号时足够清晰...Helvetica、Helvetica Neue:一种被广泛使用传奇般西文字体(这货还有专门记录片呢),在微软使用山寨货Arial时,乔布斯却花费重金获得了Helvetica苹果系统使用权,...细体、常规体、中黑体、中粗体。...San Francisco:同样是Mac OS X EL Capitan最新发布西文字体,感觉和Helvetica看上去差别不大,目前已经应用在Mac OS 10.11+、iOS 9.0+、watch...结论:Droid Sans为默认字体,并结合了中英文,无需单独设置。 4、iOS系统: iOS系统字体和Mac OS系统字体相同,保证了Mac字体效果,iOS设备就没有太大问题

1.8K00
您找到你想要的搜索结果了吗?
是的
没有找到

双管齐下:同时设计 iOS 和 Anroid

排版 iOS 系统默认字体是 Helvetica Neue,在 Android 则是 Roboto。尽管这两种字体在外观上有显著差异,但是这两个字体尺寸却是近乎相同。...比如如下几条: Android MD 设计需要用到更多空格来进行布局 在 MD 中字体大小变化会更加多样 在 iOS 字体没那么多大小差异,但是在字体重量(Font weight)有更多变化...,同样允许你创建主次结构 两个平台都使用比较细字体来现实正文内容,然而,在下面的例子中,Android 使用了轻(Lighr)和常规(Regular)字体,而 iOS 使用了粗体(Bold)和常规字体...比如,当我点击(或者长按)我想要分享、上传、复制或者删除图片时。 iOS 和 Android 用近乎相同方式解决这种问题。首先,动作表单都是出现在屏幕地步,然后在主要内容罩上一层阴影。...这里是两个平台上 icon 对比,你也可以点击这里链接查看 iOS 和 Android 下 icon 设计规范。 ? 13. 面包菜单、载入图片 不幸数字 13(注:最后晚餐在场人数)。

1.3K50

最新iOS设计规范七|10大视觉规范(Visual Design)

视图可能包含尺寸类型任意组合: 常规宽度,常规高度 紧凑宽度,紧凑高度 常规宽度,紧凑高度 紧凑宽度,常规高度 iOS会根据内容区域尺寸类型动态地进行布局调整。...将所有控件最小可触碰区域保持在44pt x 44pt。 ? 在多个设备预览你APP。你可以使用模拟器(Xcode附带)预览你APP,来检查裁剪以及其他布局问题。...iOS 13还引入了一系列六种不透明灰色颜色,你可以在半透明效果不佳极少数情况下使用它们。例如:交叉或重叠元素(例如网格中线条或条形)在不透明基础看起来更好。...为避免这些问题,您可以在Xcode项目的资产目录中提供不同图像和颜色,以确保在宽色和sRGB设备视觉保真度。 在实际sRGB和宽彩色显示器预览应用颜色。...当你做出这个选择时,请考虑: 较厚材质,可以为具有精细特征文本或其他元素等提供更好对比度 半透明可以通过对后台内容可见,来帮助用户记住其上下文 iOS13还定义了标签、填充和分隔符活力值,这些标签

7.9K30

Iconfont在教育平台实践

教育平台项目除了常规web性能优化外,图片资源站到了流量70%+,因此图片性能优化是个重中之重。除了常规图片优化外,课程封面和机构上传图片采用了webp格式,之前已介绍过,不再赘述。...在选择绘制图标大小上有了几次尝试,因为图标大多数是12px/16px/24px/32px/48px,最后我们经过多次测试确认绘制svg大小为480px,左右留白30px这个标准 字体跨域问题 这个是遇到最简单一个问题...,之前也研究过,设置cors即可: Access-Control-Allow-Origin: * 对齐问题字体都会涉及到行高问题,icon font当然也不例外,默认我们设置line-height:...也不例外 有一定虚边,这个跟字体本身有关系,所有的文字字体渲染都有一定虚边 兼容问题 网上和iconfont.cn给出推荐写法是: [@font-face](/user/font-face) {...遗留问题 IE8中,如果字体文件加载失败,则整个页面空白,虽然其他资源正常加载,逻辑正常运行。 iOS、Andriod中,字体文件或阻碍其他资源下载。

1.5K70

Iconfont在教育平台实践

教育平台项目除了常规web性能优化外,图片资源站到了流量70%+,因此图片性能优化是个重中之重。除了常规图片优化外,课程封面和机构上传图片采用了webp格式,之前已介绍过,不再赘述。...在选择绘制图标大小上有了几次尝试,因为图标大多数是12px/16px/24px/32px/48px,最后我们经过多次测试确认绘制svg大小为480px,左右留白30px这个标准 字体跨域问题 这个是遇到最简单一个问题...,之前也研究过,设置cors即可: Access-Control-Allow-Origin: * 对齐问题字体都会涉及到行高问题,icon font当然也不例外,默认我们设置line-height:...也不例外 有一定虚边,这个跟字体本身有关系,所有的文字字体渲染都有一定虚边 兼容问题 网上和iconfont.cn给出推荐写法是: [@font-face](/user/font-face) {...遗留问题 IE8中,如果字体文件加载失败,则整个页面空白,虽然其他资源正常加载,逻辑正常运行。 iOS、Andriod中,字体文件或阻碍其他资源下载。

1.2K20

iOS学习——UIAlertController详解

这两天项目中统一对已经被iOS API废弃UIAlertView和UIActionSheet进行替换,我们知道,UIAlertView和UIActionSheet都已经被iOSAPI所废弃了。...UIAlertController是在iOS8.0中出现一种统一提示风格界面,代替原来UIAlertView和UIActionSheet两种类别。...typedef NS_ENUM(NSInteger, UIAlertActionStyle) { UIAlertActionStyleDefault = 0, //常规类型,默认蓝色字体...} NS_ENUM_AVAILABLE_IOS(8_0);   常规用法示例如下: //创建对象 UIAlertController *alert = [UIAlertController alertControllerWithTitle...but,在某些情况下,万恶UI会要求你修改显示文字大小、颜色,虽然系统自带有一种红色字体UIAlertAction,但是这种Action并不能放在Cancel位置,所以,更多时候,需要我们自己修改文字字体和颜色

2.6K170

Flutter 字体另类玩法:FontFeature

image 我们知道 Flutter 默认在 Android 使用是 Roboto 字体,而在 iOS 使用是 SF 字体,但是其实 Roboto 字体也是分很多类型,比如你去查阅手机 system...Features 都是一样,比如 iOS 支持 sups 上标显示和 subs 下标显示,但是 Android Roboto 并不支持,甚至很多第三方字体其实并不支持 Features...最后,如果对 FontFeature 还感兴趣朋友,可以通过一下资料深入了解,如果你还有什么关于字体问题,欢迎留言讨论。...字体,对应还有PingFang TC 和 PingFang HK 繁体集,而关于这个问题在 Flutter 之前还出现过比较有意思 bug : 用户在输入拼音时,iOS 会在中文拼音之间添加额外...当然后续 #16709 修复了这个问题 ,而在以前文章我也讲过,当时我遇到了 “Flutter 在 iOS 系统,系统语言是韩文时,在和中文一起出现会导致字体显示异常" 问题 : image.png

1.5K20

Android、IOS文字居中偏离解决方案

前言 移动端开发,经常会遇到问题,就是文字居中。一般都只能往css方向去fix这个问题。 自己以前也用过position:relative;top:-*px方式去解决。?...导致这个问题本质原因可能是Android在排版计算时候参考了primyfont字体相关属性(即HHead Ascent、HHead Descent等)。...所以渲染时候出现偏差。 那么,解决这个问题就要在font-family里显式申明中文,或者通过什么方法保证所有字符都fallback到中文字体。...blink早期内核在fallback机制存在问题,Android 7.0+才能ok,早期内核下会导致英文fallback到Noto Sans Myanmar,这个字体非常丑。...这个方案就是显式申明中文方案,MIUI在8.0+内置了小米兰亭,同时在fonts.xml里给这个字体指定了family name:miui,所以我们可以直接设置。

1.9K20

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

前言 有些网站需要加载谷歌字体,由于网络问题或者某些问题,fonts.googleapis.com访问太慢会导致站点加载很慢。...虽然最后能看到网站,但实际谷歌字体依然加载失败了,这个体验就非常差劲了。 解决方法 实际这个谷歌字体是可以不需要去访问,当然有强迫症可以靠访问国外网站等某些操作来达到快速加载目的。...,以避免访问站点过慢问题。...按照这个思路,理论直接改hosts文件,把这个地址重定向到localhost应该也是可行。 补充 如果是自己搭建站点需要加载谷歌字体,那么有两种方法。...解决页面中引用了谷歌字体库访问缓慢问题 警告 本文最后更新于 March 2, 2021,文中内容可能已过时,请谨慎使用。

3.4K10

Flutter包大小治理上探索与实践

动态下发 对于静态资源,理论是Android和iOS都可以做到动态下发。而对于代码逻辑部分编译产物,在Android平台支持可执行产物动态加载,iOS平台则不允许执行动态下发机器指令。...3.1 iOS侧方案 在iOS平台上,由于系统限制无法实现在运行时加载并运行可执行文件,而在上文产物介绍中可以看到,占比较高App及Flutter这两个均是可执行文件,理论是不能进行动态下发,实际对于...不对常规编译模式(debug、profile、release)引入影响。 对于iOS平台来说,AOT模式Flutter产物编译关键工作流程图如下图9所示。...图12 Flutter iOS端集成插件修改 3.1.2.3 运行阶段 运行阶段所处理核心问题包括资源下载、缓存、解压、加载及异常监控等。一个典型瘦身模式下engine启动过程如图13所示。...图13 iOS侧瘦身模式下engine启动流程图 为了方便业务方使用、减少其接入成本,MTFlutter将该部分工作集成至MTFlutterRoute中,业务方仅需引入MTFlutterRoute即可将

1.7K21

iOS 9人机界面指南(一)上篇:UI设计基础 - 腾讯ISUX

内置应用使用了同系列系统颜色,这样一来,无论在深色或浅色背景看起来都很干净,纯粹。 ? 通过使用系统字体确保易读性。...无论你是使用系统字体还是自定义字体,一定要采用动态类型,这样一来当用户选择不同字体尺寸时,你应用才可以及时做出响应。 ? 使用无边框按钮。默认情况下,所有的栏(bar)按钮都是无边框。...例如,用户应当无需水平滚动就能看到重要文本,或不用放大就可以看到主体图像。 准备好改变字体大小。用户期望大多数应用都可以响应他们在iOS设置中设定字体大小。...为了适应一些文本大小变化,你也许需要调整布局;想要得到更多文本显示相关信息,请查阅下文“颜色与字体”中相关内容。 尽量避免UI不一致表现。在一般情况下,有着相似功能控件看起来也应该类似。...重启需要花费时间,同时也会让人觉得你应用不可靠且很难使用。 如果你应用有内存使用或其它问题,导致不重启就无法流畅运行,你必须声明这些问题

1.8K41

iOS 1.0到 iOS 14,一文看完iPhone14年变迁史

熟悉/usr用户目录来了。 可以看到,iOS刚开始跟macOS差不多,框架占用了超过三分之一大小,而字体竟然占了25%! 如果再细分一下: ? 这回我们看到了iOS 1.0所有特性: ?...可以看到UIkit占总体大小13% 以上, 墙纸和手机铃声占6%, ICU 需要超过5%,SpringBoard大约是2%。 接下来我们看看为啥字体占了这么大地方?...然而,两者还是有一些很大区别: iOS14包含了很多Preinstalled Assets 及Linguistic Data,这些组件用于设备机器学习: 语言检测器、声音、标记词、发声器; Dyld...虽然现在很难列出所有的功能,但是有一些明显趋势: iOS 14设备添加了更多机器学习技术: 人脸检测,深度卷积网络,视觉框架,文本识别,神经网络等等; 许多组件与相机和照片有关: 效果,记忆,视频处理...为了更好比较,我们将 iPhone OS 1.0与 iOS 14按一定比例放在一起,你会发现整个 iPhone OS 1.0基本就只是 iOS 14壁纸大小: ?

93220

DarkMode(1):产品应用深色模式分析

然而,这样做法带来了一系列问题,尤其是 iOS 作为一个平台,需要考虑平台化统一标准,以及尽可能地方便第三方开发者适配工作。...引入字体化图标 在 iOS 13 中,苹果还为了 Dark Mode 引入了多达 1500 余个字体化图标 SF Symbols。...如果我们希望获得良好效果,往往需要针对深浅外观重新填充图标的颜色,准备两套图标素材。 而字体化图标彻底解决了这个问题,还带来了一系列优势。什么是字体化图标呢?...你可以在这里下载苹果官方提供    iOS 13设计模板 Sketch 文件,其中包含了 iOS 13 最新范式、内置语义色彩、材质等元素。...Dark Mode 在 iOS 13    呈现感不错,但距离完美还有一定距离。这其中既有客观因素,也有系统主观原因。

1.8K20

收藏!UI Tabbar底部标签栏设计全攻略

苹果 iOS 标签栏 对于 Apple iOS,导航选项容器大小等于 390x49。...(也可以是375) 苹果iOS标签栏 容器中图标的大小为: 25x25 pt 用于常规标签栏 18x18 pt 用于紧凑标签栏 对于方形字形,图标应该是: 23x23 pt 用于常规标签栏 17x17...pt 用于紧凑标签栏 对于文本标签,Apple iOS 使用 SF 字体,中文使用思源黑体或者苹方,大小 10 和中等粗细。...如果您有五个以上导航选项,则很有可能并非所有选项都是最重要。您可以评估导航选项,如果您仍然有五个以上目的地,您可以使用像汉堡菜单这样控件。 3....不要使用“灰+灰”颜色组合 图标颜色对比度差和标签字体小是标签栏设计两个常见问题。 始终检查文本和图标的颜色对比度。

1.8K30

BurpSuite抓IOS设备HTTPS流量

在 PC 浏览器直接配置代理就行了,本篇文章就来介绍一下如何用 Burp 抓 IOS 设备流量,很多文章都介绍过怎么抓包,但是很多坑都没有说到,这里一些要避免坑我都记录了下来。...常规步骤 第一步,首先要在电脑开启 Burp,并且将监听地址选择成 LocalIP(也就是 ipconfig 出来那个 ip,并不是本地环回),在 Burp 上下拉就可以知道当前 IP 是多少了...然后就可以抓到 IOS 设备 HTTPS 流量了,害,应该没有什么别的坑了。...misc 顺带一提,Burp 在 Windows 默认编码并不是 UTF-8 ,所以会出现对中文字符显示乱码问题,因此我们需要将默认编码格式改成 UTF-8 ,在 User option 里面修改...,有些字体也可能不支持中文显示,最好用微软雅黑 reference https://portswigger.net/support/configuring-an-ios-device-to-work-with-burp

1K10

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

随着 iOS 9 更新面世,在 WatchOS 中随 Apple Watch 一起悄然发售,并且还将在 Apple TV 新 tvOS 中使用。...San Francisco Fonts 在 iOS 系统用于替代升级另外一款西文字体 Helvetica Neue。Apple 做了一些重要改变,使其成为平台上更好, 甚至是完美的西文字体。...看看 system-ui 兼容性,Can i Use -- system-ui[8](图片截取日 2019-08-13): ?...value (only on macOS) 考虑到不同平台及向后兼容,在 macOS 和 iOS ,我们需要使用 -apple-system 及 BlinkMacSystemFont 来兼容适配 system-ui...``-apple-system`, 在一些稍低版本 Mac OS X 和 iOS ,它针对旧版 Neue Helvetica 和 Lucida Grande 字体,升级使用更为合适 San Francisco

3.8K20

文字如何实现完美UI?文本排版设计告诉你

对于iOS,使用至少11sp字体大小,而对于Android,请选择14 sp为主文本。请注意,这是主文本通常使用标准,不是强行唯一标准。...此外,在设计手机端字体大小时,需要留意设计字体大小要比常规、使用在桌面端略大一些。 ? 2. 间距 1) 行间距 行间距是一排文字和另一排文字之间空间。...许多人认为,1.4em是标准行间距,但在手机屏幕,仍然有显得几分紧密,用户可能会感到文字仿佛在收紧。在设计,标准行间距应该是字体大小120%。...对比度 在手机屏幕,文本数量远远小于Web界面,于是同等设置对比值,在手机界面上会放大。手机文本排版设计对比度问题,最大原则就是削弱对比。...例如, iOS 7使用了(Pro)Light,iOS 9使用SF-UI,而在iOS 10中,San Francisco字体版本是SF UI Text 和 SF UI Display。 ? 10.

2.5K70
领券