iOS屏幕适配方案-Auto Layout

市场上的android手机五花八门。各种尺寸的屏幕让android程序员们比較头疼。

也有一些大神写了一些博客提出了自己的观点。iOS貌似也迎来了大屏6+,因此屏幕适配的问题也是有滴,因此苹果也有自己的方法-auto Layout 。

本人初学iOS。今天学了自己主动布局。在学习的过程中,毕竟还是有些知识点没有接触到的,因此写这篇博客来深入的了解一下Auto Layout。

官方解释:

Auto Layout 是一个系统,能够让你通过创建元素之间关系的数学描写叙述来布局应用程序的用户界面。——《Auto Layout Guide

Auto Layout 是一种基于约束的。描写叙述性的布局系统。——《Taking Control of Auto Layout in Xcode 5 - WWDC 2013

我们给布局添上约束 (Constraints)来给控件定位和控制大小。而不是像android和html5一样通过size等属性来控制布局。iOS控件貌似没有size概念,而是全然通过constraints来控制大小。

打开storyboard。我在顶部和底部拖了两个控件。看图一目了然。右边iPhone4底部控件看不到了。iPhone6+控件已经偏出。

接下来来看怎样解决,先看张图:

1、选中view controller

2、按住ctrl键。往上拉,选中 Top Space to Top Layout Guide

此时我们看到的线已变成orange颜色,说明加入的约束不够。继续往左和右边拉。

3、颜色变成绿色就算好了。

4、底部的控件一样加入约束。

測试结果:

适配成功。

总结:

直接说以后都应该使用storyboard+autolayout感觉是不负责的说法,可是深入思考autolayout是非常有必要的!

例如以下情况使用autolayout会有帮助:

当须要展示的内容非常多而且尺寸不固定;

程序需支持屏幕旋转(主要是iPad程序。iPhone程序横屏的场景有点非主流,也不排除..手游..);

但storyboard中使用autolayout有利有弊。优点当然是可视化,实现简单功能非常节省时间,但也有弊端,比如不小心移动一个控件就会让弄乱那些约束

时间: 2024-10-09 23:26:16

iOS屏幕适配方案-Auto Layout的相关文章

IOS界面适配二: Auto Layout的使用(上)

上一篇讲了IOS中基础的距离单位,链接为 IOS界面适配一: Pt与Px的关系 ,使用距离单位可以定义我们程序中View的大小,但是,仅仅使用Pt定义大小是远远不够的. 比如,我们想让一个button距离手机左边界为20pt,右边界为20pt,距上为30pt,高度自身为20pt,如果在iphone5中(为320pt*568pt),我们要在代码中这么定义 以下代码写在ViewController中的viewDidLoad方法中: UIButton * button = [[UIButton all

Unity2D多分辨率屏幕适配方案(转载)

一下内容转自:http://imgtec.eetrend.com/forum/3992 此文将阐述一种简单有效的Unity2D多分辨率屏幕适配方案,该方案适用于基于原生开发的Unity2D游戏,即没有使用第三方2D插件,如Uni2D,2D toolkit等开发的游戏,NGUI插件不受这个方案影响,可以完美和此方案配合使用. 先说明一些基本的概念: 1.屏幕的宽高比Aspect Ratio = 屏幕宽度/屏幕高度 2.Unity2D中摄像机镜头的尺寸决定了我们实际看到游戏内容的多少,在编辑器中我们

Android开发屏幕适配方案

Android屏幕适配方案总结 日常开发中,难免遇到屏幕适配的方案,网上也有很多方案,在这里本人只是做一个总结,以免日后使用 单位的概念 pt(point):磅,一个标准的固定长度单位,大小为1/72英寸,主要用于印刷与平面设计.1英寸=2.54厘米=72磅 1pt=0.03527cm px(pixel):像素,组成屏幕图像的最小点,一个相对大小单位.同尺寸屏幕中像素越小越多,代表屏幕分辨率越高,反之越高. 1pt=(ppi/72)*px 屏幕尺寸(screen size):屏幕物理尺寸,指屏幕

web屏幕适配方案

一个多月前水了一篇移动web屏幕适配方案,当时噼里啪啦的写了一通,自我感觉甚是良好.不过最近又有一些新的想法,和之前的有一些不同. 先说一下淘宝的方案,感觉现在好多的适配方案都是受了它的影响,上周六看了winter在一个会议的分享,讲到了这个方案.现在你谷歌一下移动 web适配,绝对可以看到很多类似的,切活动页的童鞋都忍不住试一把.这些方案和我的博客写的其实还是相似的,就是抛弃了那种viewport直接缩放, 然后给定html的初始font-size值,使用rem这个单位. 在屏幕的设备像素比上

JavaScript强化教程——cocosjs屏幕适配方案

本文为 H5EDU 机构官方 HTML5培训 教程,主要介绍:JavaScript强化教程 ——cocosjs屏幕适配方案 首 先说点题外话,对于任何大型项目来说,coding的规范重要,在cocos2dx-jsbinding这个框架中,javascript是一个绝对核心 的脚本语言,99%的游戏逻辑都由js完成.脚本的编写量绝对大于大多数的web项目,掌握javascript的扎实的基础至关重要. 入 正题,今天讨论的是如何使用jsb来处理移动平台的多分辨率适配问题.就目前的移动平台来讲,分辨

iOS Programming Introduction to Auto Layout 自动布局

iOS Programming Introduction to Auto Layout ? 自动布局 A single application that runs natively on both the iPad and the iPhone is called a universal application. 一个原生的能运行在iPad 和iPhone 的应用叫做universal application? Then select the Homepwner target in the pr

[原创]一种Unity2D多分辨率屏幕适配方案

此文将阐述一种简单有效的Unity2D多分辨率屏幕适配方案,该方案适用于基于原生开发的Unity2D游戏,即没有使用第三方2D插件,如Uni2D,2D toolkit等开发的游戏,NGUI插件不受这个方案影响,可以完美和此方案配合使用. ---------------------------------------正式开始的分割线----------------------------------------- 先说明一些基本的概念: 1.屏幕的宽高比Aspect Ratio = 屏幕宽度/屏幕

一种Unity2D多分辨率屏幕适配方案

此文将阐述一种简单有效的Unity2D多分辨率屏幕适配方案,该方案适用于基于原生开发的Unity2D游戏,即没有使用第三方2D插件,如Uni2D,2D toolkit等开发的游戏,NGUI插件不受这个方案影响,可以完美和此方案配合使用. ---------------------------------------正式开始的分割线----------------------------------------- 先说明一些基本的概念: 1.屏幕的宽高比Aspect Ratio = 屏幕宽度/屏幕

给你一个全自动的屏幕适配方案(基于SW方案)!—— 解放你和UI的双手

Calces系列相关文章:Calces自动实现Android组件化模块构建 前言 屏幕适配一直是移动端开发热议的问题,但是适配方案往往在实际开发的时候会和UI提供的设计稿冲突.本文主要是基于官方推荐的配置限定符方案(Smallest Width目前Android屏幕适配的最优方案)来实现一个接近完美的屏幕适配方案. 对于完美的适配方案笔者是这样定义的: 能完美适配UI稿. 适配完毕后,在高清设备上不会出现模糊的现象. 尽量减少对项目的侵入性. 下面我会从屏幕适配的一些基础知识入手,向你慢慢展现一