文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

深入详解iOS适配技术

开发app的时候，根本不用考虑同一个视图在不同尺寸的屏幕上显示的问题。iOS开发者完全可以用纯代码的方式把一个控件的frame写死。...三大适配技术 iOS屏幕适配主要有三个技术，分别是Autoresizing、AutoLayout、SizeClass。利用纯代码计算视图的frame我们在此就不多介绍。...AutoLayout自iOS6开始引入，但由于当时XCode4当时对AutoLayout的支持不是很好，所以在XCode5/iOS7及其之后，AutoLayout才开始被广泛应用。...sizeClass-W Regular H Compact.gif 从上图，你会发现，我们在W Regular H Compact状态下给控制器左上角添加的绿色的按钮只会显示在横屏状态下，切换到竖屏状态后...W Regular H Regular.png 2>和上面那个例子一样，我们切换了sizeClass后，storyBoard上的控制器也变了形状--变成了和iPad一样方方正正的一个控制器。

8.5K70
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    你不知道的Mac屏幕显示图像

    CPU 计算好显示内容提交到 GPU，GPU 渲染完成后将渲染结果放入帧缓冲区，随后视频控制器会按照 VSync 信号逐行读取帧缓冲区的数据，经过可能的数模转换传递给显示器显示。...在这种情况下，GPU 会预先渲染好一帧放入一个缓冲区内，让视频控制器读取，当下一帧渲染好后，GPU 会直接把视频控制器的指针指向第二个缓冲器。如此一来效率会有很大的提升。...当视频控制器还未读取完成时，即屏幕内容刚显示一半时，GPU 将新的一帧内容提交到帧缓冲区并把两个缓冲区进行交换后，视频控制器就会把新的一帧数据的下半段显示到屏幕上，造成画面撕裂现象 ios_vsync_off.jpg...卡顿产生的原因和解决方案 ios_frame_drop.png 在 VSync 信号到来后，系统图形服务会通过 CADisplayLink 等机制通知 App，App 主线程开始在 CPU 中计算显示内容...Autolayout Autolayout 是苹果本身提倡的技术，在大部分情况下也能很好的提升开发效率，但是 Autolayout 对于复杂视图来说常常会产生严重的性能问题。

    2K70

    iOS 性能优化

    为了同步显示器的显示过程和系统的视频控制器，显示器会用硬件时钟产生一系列的定时信号。...CPU 计算好显示内容（如：视图的创建、布局计算、图片解码、文本绘制）提交至 GPU，GPU 渲染完成后将渲染结果存入帧缓冲区，视频控制器会按照 VSync 信号逐帧读取帧缓冲区的数据，经过数据转换后最终由显示器进行显示...在这种情况下，GPU 会预先渲染一帧放入一个缓冲区中，用于视频控制器的读取。当下一帧渲染完毕后，GPU 会直接把视频控制器的指针指向第二个缓冲器。 ?...当视频控制器还未读取完成时，即屏幕内容刚显示一半时，GPU 将新的一帧内容提交到帧缓冲区并把两个缓冲区进行交换后，视频控制器就会把新的一帧数据的下半段显示到屏幕上，造成画面撕裂现象，如下图： ?...Autolayout Autolayout 是苹果本身提倡的技术，在大部分情况下也能很好的提升开发效率，但是 Autolayout 对于复杂视图来说常常会产生严重的性能问题。

    2.9K20

    iOS 关于Interface Building 的一些小技巧

    UIStackView StackView 是iOS9以后才有的，主要解决了组件排列布局复杂的问题，高效快速。 AutoLayout布局是不是遇到过一个均分排列的布局，还要隐藏显示其中一个。...Fill Spacing:该属性会保持子视图的宽高，所有子视图中间的间隔保持一致。 Fill Center: 该属性是控制所有子视图的中心之间的距离保持一致。...AutoLayout 优先级和动画 在没有UISatckView之前，我们可以利用优先级完成三个Tab删除一个的场景，但是再重新显示是比较困难的。 约束优先级 先看下演示效果： ?...基本属性： 属性 作用 identifier 字符串标识，区分页面不同Segue source 跳转之前的控制器 destination 需要跳转到的控制器 传值： 有时候我们需要判断是否满足跳转的条件...让开发iOS 更简单，高效。 抛砖引玉，希望有相同志向的人，能一起扩展完善。 第三方地址：XibKits

    1.8K31

    MyLayout和XIB或SB的混合使用方法

    取消对AutoLayout的支持 第二步就是将视图控制器中的根视图的类名转化为对应的布局视图类： ?...根视图的类名转换 第三步将类名转换后您可以切换到Show the attributes inspector 标签中进行布局视图特有属性的设置： ?...通过gravity属性设置了所有子视图均分高度和以及宽度和布局视图相等。设置完毕后我们分别按顺序添加3个高度一致的子视图如下： ?...既然我们可以把根视图转化为一个布局视图类，那么我相信您可以举一反三了。我们只要直接在根布局视图中，先添加一个UIView视图，然后把类名改为对应想要使用的布局视图就可以了。...而水平线性布局则有2个子视图： ? 布局套布局 上图中我将中间的视图的UIView类改为了MyLinearLayout。

    88640

    iOS 优化界面流畅的技巧

    Autolayout Autolayout 是苹果本身提倡的技术，在大部分情况下也能很好的提升开发效率，但是 Autolayout 对于复杂视图来说常常会产生严重的性能问题。...随着视图数量的增长，Autolayout 带来的 CPU 消耗会呈指数级上升。具体数据可以看这个文章：http://pilky.me/36/。...目前来说，iPhone 4S 以上机型，纹理尺寸上限都是 4096x4096，更详细的资料可以看这里：iosres.com。所以，尽量不要让图片和视图的大小超过这个值。...当然，这也可以用上面的方法，把多个视图预先渲染为一张图片来显示。...在这个预设内，你能查看到几乎所有与显示有关的数据，比如 Texture 数量、CA 提交的频率、GPU 消耗等，在定位界面卡顿的问题时，这是最好的工具。 参考：iOS 保持界面流畅的技巧

    1.5K10

    浅谈 iOS AutoLayout 中 Label 的抗拉伸和抗压缩

    使用场景： 当一个视图上有多个 intrinsic content size 的子控件，子视图的总和，不够填充父视图区域时，此属性可以控制优先拉伸哪个视图内容。...使用场景： 当一个视图上有多个 intrinsic content size 的子控件，并且子控件可能会超出父视图的区域时，此属性可控制哪些视图被内容被优先压缩，使其不超出父视图区域。...image.png 从最后的显示效果来看，中间的 Label 被压缩了。因为左右约束的优先级比固有内容相关的优先级要高，所以 Autolayout 布局的时候会优先满足左右两个约束。...抗压缩特性变强了，它更倾向于显示它固有内容 Size，这时候被压缩的就是左边和右边的约束。...抗拉伸特性变强了，它更倾向于显示它固有内容 Size，这时候被拉伸的就是左边和右边的约束。

    5.5K31

    如何把设计图自动转换为iOS代码? 在线等,挺急的!

    : M 的网络请求部分, V的数据显示部分, C的逻辑交互部分.对于controller控制器层,往往需要结合业务逻辑去处理,代码量并不算大;对于Model数据模型层,我们有 AFNetworing,...视图所在的控制器. @property (weak, nonatomic, readonly)NSLayoutConstraint * heightContronstraint; //!...: 或许借助masonry,建立一个纯代码的不依赖Xib的AutoLayout视图组件机制....目前能得到的效果 视图基于 AutoLayout; 视图自动适配不同屏幕尺寸; 视图完全独立于数据与业务逻辑; 视图严肃仅与父视图有位置关系; 可以将视图模块的元素与模块同名属性自动关联; 仅需知道父视图的宽高...核心理论基础: AutoLayout中,如何唯一确定元素在不同尺寸屏幕上的位置? 既定方案,必须基于AutoLayout,至于AutoLayout与Frame的区别于优势,不做赘述.

    1.4K60

    视错觉升级版：多个视错觉效果实现

    今天这篇博客是视错觉Demo的升级版，上篇博客发表后，好多小伙伴说使用Mask实现会更容易，其实使用Mask和之前的原理是一样的。...看完效果和视图层级后，接下来来看一下核心代码的实现，还是那句话核心代码就是AutoLayout的应用。下方代码就是上述效果的核心部分。...colorImageView也就是我们的彩色图片是加在小的MaskView上的，也就是上面我们选中的View，不过其约束是添加在整个视图控制器的self.view上的。...上图就是我们为我们的Label添加的Mask，添加后，文字就会出现渐变的效果。当然原理是一样的。下方就是上述效果的视图层级。也是两层不同的文字，通过mask来显示指定区域。...当然上面的Hello World是讲Mask添加在了Lable上了，而下方的效果是讲Mask添加在了上层视图上，上层视图的背景色是红色，上层视图上贴了一些列的白色Label，当然显示的只是mask区域内的东西了

    854100

    关于Autolayout和Masonry自动布局的几个坑

    关于Autolayout和Masonry自动布局的几个坑 自动布局 02 Mar 2016 0 Comments 前言 最近遇到一个复杂视图：根控制器里面有上下两个子控制器，子控制器中各自实现类似PageView...的视图，然后PageView的每一页是一个WebView，同时中间有个可拖拽的控件，实现上下两个控制器视图的大小调整。...参考： Debugging iOS AutoLayout Issues Autolayout Breakpoints 关于Masonry的使用 必须明确AutoLayout关于更新的几个方法的区别 setNeedsLayout...如果希望立刻生成新的frame需要调用此方法，利用这点一般布局动画可以在更新布局后直接使用这个方法让动画生效。...具体使用技巧参考Masonry自动布局详解九：复杂ScrollView布局、在UIScrollView中使用Autolayout布局以及iOS_autoLayout_Masonry。

    1.6K20

    iOS开发常用之UI模糊效果、自动版式

    使用DEMO 视图居中显示，子视图含边距，视图等距离摆放，计算ScrollView的内容。 Classy - Classy是一个能与UIKit无缝结合stylesheet（样式）系统。...ClassyLiveLayout - ClassyLiveLayout通过结合Classy stylesheets与Masonry一起使用，能够在运行的模拟器中微调自动布局约束实时显示效果的工具，砌体...Snap - Snap是砌体自动布局DSL的Swift版本，是一款轻量级的布局框架，使用了更好的语法封装了AutoLayout.Snap支持iOS和OS X....来自百度知道iOS小组的内部分享。 UIView-FDCollapsibleConstraints - 一个AutoLayout辅助工具，最优雅的方式解决自动布局中子查看的动态显示和隐藏的问题。...当前视图隐藏的时候也隐藏其autolayout的NSLayoutAttribute - 当前隐藏的时候也隐藏其autolayout的NSLayoutAttribute，从而不用大量的代码工作。

    1.6K30

    关于Autolayout和Masonry自动布局的几个坑

    自动布局 02 Mar 2016 Comments 前言 最近遇到一个复杂视图：根控制器里面有上下两个子控制器，子控制器中各自实现类似PageView的视图，然后PageView的每一页是一个WebView...，同时中间有个可拖拽的控件，实现上下两个控制器视图的大小调整。...参考： Debugging iOS AutoLayout IssuesAutolayout Breakpoints 关于Masonry的使用 必须明确AutoLayout关于更新的几个方法的区别...如果希望立刻生成新的frame需要调用此方法，利用这点一般布局动画可以在更新布局后直接使用这个方法让动画生效。...具体使用技巧参考Masonry自动布局详解九：复杂ScrollView布局、在UIScrollView中使用Autolayout布局以及iOS_autoLayout_Masonry。

    1.7K20

    【Hybrid开发高级系列】ReactNative(六) —— 与现有的应用程序集成（IOS）

    包装Objective - C代码，将加载脚本并创建一个RCTRootView 来显示和管理你的React Native组件 首先，为你的应用程序的React代码创建一个目录，并创建一个简单的 index.ios.js...// ReactView.h     #import     @interface ReactView : UIView     @end         在一个视图控制器中，想要管理这一视图，继续添加一个出口并将其连接...在实际产品中，你应该自己打开AutoLayout，并且设置约束。...1.5 为容器视图添加RCTRootView         在ReactView.m中，我们首先需要用index.ios.bundle的URI启动 RCTRootView。...这意味 着你所需要做的就是为 RCTRootView 实现你自己的容器视图或视图控制器—— RCTRootView 摄取了捆绑的JS并呈现出你的React组件。万岁!

    28420

    屏幕成像原理以及FPS优化Tips

    GPU渲染完成后将渲染结果（也就是一帧画面）放到屏幕的帧缓冲区（此处的帧缓冲区和离屏渲染的屏幕缓冲区、屏幕外缓冲区是一回事）；随后视频控制器会按照VSync（垂直同步信号）读取帧缓冲区的数据，经过数模转换传递给显示器显示...双缓冲机制下，GPU 会预先渲染好一帧放入一个缓冲区内，让视频控制器读取，当下一帧渲染好后，GPU 会直接把视频控制器的指针指向第二个缓冲器。如此一来效率会有很大的提升。...当视频控制器还未读取完成时，即屏幕内容刚显示一半时，GPU 将新的一帧内容提交到帧缓冲区并把两个缓冲区进行交换后，视频控制器就会把新的一帧数据的下半段显示到屏幕上，造成“画面撕裂”现象，我们称之为“screen...在 VSync 信号到来后，系统图形服务会通过 CADisplayLink 等机制通知 App，App 主线程开始在 CPU 中计算显示内容，比如视图的创建、布局计算、图片解码、文本绘制等。...GPU优化 尽量减少视图数量和层次。 尽量避免短时间内大量图片的显示，可以的话将多张图片合成一张显示。

    9.6K73

    iOS性能优化系列篇之“列表流畅度优化”

    * **渲染**这些可见的triangles，将结果提交到视频缓冲区 * 视频控制器以60hz频率读取缓冲区内容显示到显示器，如果在16.67ms内没有完成提交，则会被丢弃。...所以iOS12中，会把UIKit框架上所有的信息（滑动信息以及滑动frame的关键时间点）传递给底层CPU性能控制器，这样CPU可以更智能调度以在frame截止的时机内完成CPU计算。...在滑动列表（UITableView和UICollectionView）中强烈不建议使用Autolayout。随着视图数量的增长，Autolayout带来的 CPU 消耗会呈指数级上升。...* storyboard VS 代码创建view * frame VS autolayout autolayout性能度量，*iOS12优化了autolayout的性能，耗时由指数变为线性耗时*...当然，这也可以用上面的方法，把多个视图预先渲染为一张图片来显示。

    2.6K30

    【IOS开发基础系列】Autolayout自动布局专题

    虚线方块是根据自动布局显示视图的frame。实线方块是根据你在屏幕上放置的视图的frame。这两个应该吻合的，但是这里并没有。 Note：你可能会奇怪，为什么Xcode不为X轴方向自动增加一个约束。...Constraint问题 4.1.1 不能同时设置一个控件横向或纵向的相对间距后，又去设置绝对尺寸，否则会导致控件不能显示，也不会报错！.../www.cocoachina.com/industry/20131203/7462.html 【iOS开发】多屏尺的自动适配AutoLayout(纯代码方式) http://blog.sina.com.cn.../article/details/41844071 使用了Autolayout和约束后，无法用代码修改View的位置，怎么处理？...需要频繁变更的讨论 http://segmentfault.com/q/1010000002420050 实时显示iOS编写UI代码效果 http://blog.csdn.net/zhang_red/article

    34940
    点击加载更多

    扫码

    添加站长 进交流群

    领取专属 10元无门槛券

    手把手带您无忧上云

    扫码加入开发者社群

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2025 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 深公网安备号 44030502008569

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

      领券