iOS开发之使用Storyboard预览UI在不同屏幕上的运行效果
在公司做项目一直使用Storyboard,虽然有时会遇到团队合作的Storyboard冲突问题,但是对于Storyboard开发效率之高还是比较划算的。在之前的博客中也提到过,团队合作使用Storyboard时,避免冲突有效的解决方法是负责UI开发的同事最好每人维护一个Storyboard, 公用的组件使用轻量级的xib或者纯代码来实现。这样不但提高了开发效率,而且可以有效的避免Storyboard的冲突。如果每个人维护一个Storyboard, 遇到冲突了就以你自己的为准就OK了。
言归正传,接下来就介绍一下如何使用Storyboard来预览UI在不同那个分辨率屏幕上的运行效果,这就很好的避免了每次调整约束都要Run一下才能看到不同平面上运行的效果,今天的博客就来详述一下如何使用Storyboard来进行Preview运行效果。接下来就一步一步的来看一下如何进行效果的预览。
一、创建工程添加测试使用的UIImageView
创建一个测试工程,在ViewController上添加4个不同尺寸的UIImageView, 并且添加上不同的约束,最后添加上不同的文艺小清新的图片,最终Storyboard上的控件和约束如下所示。

二、打开预览界面
1.点击Storyboard上左上角的按钮 -> 点击Preview -> 按着potion + shift键 点击相应的Storyboard, 具体操作如下图所示:

2.经过上面的操作后, 你会看到如下操作界面,在这个界面中你可以点击右边的加号按钮来添加预览窗口,如下图所示:

三、添加预览设备
1.双击上面加号的按钮回出现预览窗口,在预览窗口左下方有一个加号按钮,通过加号按钮你可以添加不同尺寸的屏幕进行预览,从3.5到iPad应有尽有,添加是的截图如下所示。

2.把上述所有设备添加上以后的预览效果如下图所示,这种预览效果仅限于使用Storyboard实现的控件,然而用纯代码写的UI就没有这么幸运了。预览效果如下:

Storyboard的还是蛮强大的,类似这种小的技巧,Storyboard还有许多,在这就不做一一赘述了,以后有机会回慢慢的介绍的,在博客的最后呢给大家分享一下我萌萌的桌面吧~然而这个桌面对于你的技术的提高并没有什么卵用~,愿大家天天快乐,工作开心呢!
iOS开发之使用Storyboard预览UI在不同屏幕上的运行效果的更多相关文章
- 李洪强iOS开发之苹果使用预览截图
李洪强iOS开发之苹果使用预览截图 01 在预览的图片中选中你要截得区域 02 - command + C 03 - Command + N 04 - Command + S (保存)
- iOS开发笔记7:Text、UI交互细节、两个动画效果等
Text主要总结UILabel.UITextField.UITextView.UIMenuController以及UIWebView/WKWebView相关的一些问题. UI细节主要总结界面交互开发中 ...
- Android中实时预览UI和编写UI的各种技巧
一.啰嗦 之前有读者反馈说,你搞这个所谓的最佳实践,每篇文章最后就给了一个库,感觉不是很高大上.其实,我在写这个系列之初就有想过这个问题.我的目的是:给出最实用的库来帮助我们开发,并且尽可能地说明这个 ...
- 适用于各浏览器支持图片预览,无刷新异步上传js插件
文件上传无疑是web应用中一个非常常用的功能,不管是PHP.jsp还是aspx.mvc等都会需要文件上传,但是众所周知当使用自带的文件上传功能时总会出现页面刷新的情况.当然现在有了html5这个好东西 ...
- 安卓开发实用技巧:TextView预览
背景: 使用TextView时,为了方便在开发工具中预览效果,需要在TextView中设置文字(如:android:text="Hello World"),但是等到后面提交时,为了 ...
- iOS开发之--使用storyboard进行跳转
iOS开发中使用故事板进行开发是非常高效的一种方式,虽然有这样那样的问题,但是不得不承认,使用sb可以在最短的时间内完成整个项目的布局,节约开发者大量的时间,而且便于修改,非常直观,虽然可能不太灵活, ...
- iOS开发教程:Storyboard全解析-第一部分
本文转载至http://blog.csdn.net/chang6520/article/details/7945845 感谢原文作者分享 故事版(Storyboard)是一个能够节省你很多设计 ...
- 微信小程序开发之真机预览
1:真机预览时上传组件的坑: 当在真机里面使用上传组件,当进入选择相片或者拍照的时候,小程序会进入后台,调用APP onHide()方法,选择完返回小程序是会调用App Onshow()方法,然后调用 ...
- [js开源组件开发]-手机端照片预览组件
手机端照片预览组件 可怜的我用着华为3C手机,用别人现成的组件都好卡,为了适应我这种屌丝,于是自己简化写了一版的照片预览效果,暂时无缩放功能,以后可能有空再加吧,你也可以自己加下,这是个github上 ...
随机推荐
- 安装WampServer时出现的问题(丢失VCRUNTIME140.dll或MSVCR110.dll)以及解决办法
今天,在安装WampServer时,刚开始提示了"丢失VCRUNTIME140.dll"的问题. 我就网上查了一下,结果大家说是没有安装VC++,然后我就按照网友们提供的网址去下载 ...
- webform 组合查询
界面: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx ...
- 异常处理_Maven多模块web项目整合ssm+dubbo
异常如下: [ERROR][org.springframework.web.context.ContextLoader.initWebApplicationContext(ContextLoader. ...
- 设置DataGridView的某个单元格为ComboBox
怎么将DataGridView的 某个单元格设为ComboBox的样式而不是整列都改变样式? 1.最简单的方法:利用DataGridView提供的DataGridViewComboBoxCell. 写 ...
- dialog
function showDialog(){ var $by = $(window), obj = $('.dialog'), brsW = $by.width(), brsH = $by.heigh ...
- .Net 跨平台可移植类库PCL可用于任何平台包括Mono
Microsoft 在 .NET Framework 4 中添加了一个名为可移植类库 (PCL) 的新功能. 利用 PCL,您可以有选择性地面向 .NET Framework.Silverlight ...
- Java工作环境笔记
环境 1. Jvm最简生存指南: http://www.importnew.com/10127.html 2. 所有路径中,不要出现中文,即使开始的时候,调试Tomcat时,路径有中文也可以,你真不知 ...
- windows下 安装Kali Linux到 U盘的方法
作者:玄魂工作室 \ 2016年10月20日 把Kali Linux安装到U盘好处很多,可以从U盘启动使用整个电脑的硬件资源, 可以随身携带,减少对自己电脑的影响. 今天要给大家讲的是如何在windo ...
- 自己动手写一个简单的MVC框架(第二版)
一.ASP.NET MVC核心机制回顾 在ASP.NET MVC中,最核心的当属“路由系统”,而路由系统的核心则源于一个强大的System.Web.Routing.dll组件. 在这个System.W ...
- IEEE754、VAX、IBM浮点型介绍和.NET中互相转换
[题外话] 最近在做C3D文件的解析,好奇怪的是文件中竟然存储了CPU的类型,原本不以为然,结果后来读取一个文件发现浮点数全部读取错误.查了下发现虽然在上世纪80年代就提出了IEEE754要统一浮点数 ...