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还有许多,在这就不做一一赘述了,以后有机会回慢慢的介绍的,在博客的最后呢给大家分享一下我萌萌的桌面吧~然而这个桌面对于你的技术的提高并没有什么卵用~,愿大家天天快乐,工作开心呢!

时间: 2024-11-14 23:52:10

iOS开发之使用Storyboard预览UI在不同屏幕上的运行效果的相关文章

iOS开发之使用Storyboard预览UI在不同屏幕上的运行效果_IOS

        在公司做项目一直使用Storyboard,虽然有时会遇到团队合作的Storyboard冲突问题,但是对于Storyboard开发效率之高还是比较划算的.在之前的博客中也提到过,团队合作使用Storyboard时,避免冲突有效的解决方法是负责UI开发的同事最好每人维护一个Storyboard, 公用的组件使用轻量级的xib或者纯代码来实现.这样不但提高了开发效率,而且可以有效的避免Storyboard的冲突.如果每个人维护一个Storyboard, 遇到冲突了就以你自己的为准就OK

AppleWatch开发入门六——Glance(预览)扩展的应用

AppleWatch开发入门六--Glance(预览)扩展的应用 一.简介         Glance是watchOS中类似iOS的today插件一样的预览扩展.提供了Glance功能的WatchApp可以在手表主页上唤起Glance,展示app相关信息,然而这个扩展只能作为展示作用,并不能进行太多的交互,界面的布局也有很大的限制,因此,Glance的应用主要在于展示备忘信息等.特点如下: 1.扩展的样式布局我们并不能完全个性化,只能通过系统模板来布局. 2.扩展中不能添加交互功能,只能展示信

java web-海康视频javaweb开发调用NetVideoActiveX23.cab预览返回41资源分配错误

问题描述 海康视频javaweb开发调用NetVideoActiveX23.cab预览返回41资源分配错误 如题!海康视频javaweb开发调用NetVideoActiveX23.cab预览返回41资源分配错误,跪求各路大神帮忙.....急!!! 解决方案 http://bbs.csdn.net/topics/390879798

海康威视sdk-海康威视ocx控件开发,实时视频无法预览

问题描述 海康威视ocx控件开发,实时视频无法预览 20C 控件测试时能够登录,但是实时预览失败,报错误代码107.几天没找到原因,该引用的SDK文件都已近引用了.一下为实时预览代码 HWND _Hwnd=AfxGetMainWnd()->m_hWnd; NET_DVR_CLIENTINFO ClientInfo={0}; ClientInfo.hPlayWnd =_Hwnd; ClientInfo.lChannel = 33; ClientInfo.lLinkMode = 0; ClientI

android开发-能不能截图把listview未显示在屏幕上的item也截取

问题描述 能不能截图把listview未显示在屏幕上的item也截取 开发-能不能截图把listview未显示在屏幕上的item也截取-listview item 高度"> 我现在要做的就是点击button截图保存到相册功能,但是截出来的效果是显示所有item(包括屏幕上未加载的),在item未展开的情况下,截出来的图片上是要全部展开的效果. 求哪位大神给个思路,谢谢! 解决方案 iOS 截图 截取屏幕 解决方案二: 那你自己写吧,或者你捕捉截屏动作,先展开 解决方案三: 就是要在没展开的

OpenGL ES 背面消隐特性在 iOS 设备与模拟器上的运行效果细微差异

OpenGL ES 背面消隐特性在 iOS 设备与模拟器上的运行效果细微差异 太阳火神的美丽人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一致"创作公用协议 转载请保留此句:太阳火神的美丽人生 -  本博客专注于 敏捷开发及移动和物联设备研究:iOS.Android.Html5.Arduino.pcDuino,否则,出自本博客的文章拒绝转载或再转载,谢谢合作. 2014-01-09补充 ---------------------

IOS开发之获取Storyboard创建的ViewController

前面的两篇博客都是学习有关屏幕适配也就是相对布局的东西,这篇博客中将会学习视图间的切换.视图间的切换我们可以用代码完成或者用storyboard来建立各个视图控制器间的关系.在需要用到代码进行切换时会用代码进行视图间的跳转.下面的东西我们会主要介绍到NavigationController来进行视图间的切换.下面也是和之前一样把代码和storyboard结合起来学习. 下面介绍一下我们要实现的功能和效果: App打开的第一个界面是登陆页面,登陆页面由用户名和密码以及一个登陆按钮构成.当登陆成功时

浏览器图片选择预览、旋转、批量上传的JS代码实现_javascript技巧

工作中遇到的业务场景,和同事一起研究了下,主要是为了兼容IE版本 其实就是一些琐碎的知识点在网上搜集下解决方式,然后集成了下,主要有以下点: 1. IE input type=file的图片预览要用IE的filter css     progid:DXImageTransform.Microsoft.AlphaImageLoader    chrome/firefox则用File api的file reader 2. 图片旋转,IE用progid:DXImageTransform.Microso

苹果计划在iOS 8中加入分屏操作功能,在一个iPad屏幕上同时运行两个应用

摘要: iOS 8中可能会加入全新的分屏操作功能,只适用于横屏模式下的iPad.你可以在iPad屏幕上打开两个应用,一边一个.微软的Surface也可以在一个屏幕上进行多任务操作,方便企业用户的工 iOS 8中可能会加入全新的分屏操作功能,只适用于横屏模式下的iPad.你可以在iPad屏幕上打开两个应用,一边一个.微软的Surface也可以在一个屏幕上进行多任务操作,方便企业用户的工作. 另外,iOS 8中同此功能配套的,还有让应用之间的互动变得更容易,比如可以把一个应用中的内容拖拽到另一个中去