ios开发之IPAD布局问题

1.项目可以通过设置Device来选择部署的平台

1> 选择iPhone(说明项目是用于在iPhone上展示的),该项目可以在iPad上运行,但是界面边缘有黑边,用户体验较差

2> 选择iPad(说明项目是用于在iPad上展示的),该项目不可以在iPhone上运行,体现在AppStore上,下载的APP不能安装在iPhone上

3> 选择Universal,该项目既可以在iPhone也可以在iPad上运行

#pragma mark - 一. UIStackView

#pragma mark 1. UIStackView介绍

概念: 一个用于堆叠视图的容器  iOS9的API

用途: StackView及其子视图可以进行界面自适应,主要用于"减少"设置约束的工作量

特点:

1> 类似containerView,不能在界面上进行渲染

2> stackView中的子视图只能朝一个方向进行排列  要么水平要么竖直

3> stackview可以进行嵌套

4> stackView自适应的优先级要低于手动设置约束(使用stackView后不能再通过frame来改变尺寸),可以通过设置约束来调整stackView进行的自适应处理

5> stackView支持属性动画

6> stackView不支持滚动

#pragma mark 2. UIStackView基本布局

Axis : 轴 用于设置子视图的排列方向  水平/竖直

Aligment : 对齐 用于设置子视图的对齐方式

Distribution : 分布 用于设置子视图的分布(排列方向上的填充)方式

Spacing: 设置子视图之间的间距

#pragma mark 3. UIStackView分屏适配(Sizeclass)

1.iPad的分屏技术  iOS9的API

1> 可以让iPad前台同时有两个APP运行 实现真正的多任务处理

2> 硬件要求 必须在iPad Air2及以上

3> Xcode Bug: 如果项目一开始选择的不是Universal,则修改成Universal以后也无法支持iPad分屏

2.iPad分屏适配

1> 分屏界面展示原则: iPad分屏时,会按照iPhone竖屏的展示样式(对应的SizeClass)进行展示

2> 抗压优先级: 当控件进行布局时,如果空间产生竞争关系,则抗压优先级越高,抗挤压能力越强,空间竞争时,就会先挤压其他优先级低的控件  默认750

3> 设置iPhone竖屏样式下StackView的的Axis属性

class ViewController: UIViewController {

//底部stackView

@IBOutlet weak var bottomStackView: UIStackView!

//展示大图

@IBOutlet weak var showImgV: UIImageView!

override func viewDidLoad() {

super.viewDidLoad()

// Do any additional setup after loading the view, typically from a nib.

}

//点击切换大图

@IBAction func clickShowImgBtn(sender: UIButton) {

//获取图片

let img = UIImage(named: "skirts_0\(sender.tag)")

//展示大图

showImgV.image = img

//动画渐变

showImgV.alpha = 0.5

UIView.animateWithDuration(0.3) { () -> Void in

self.showImgV.alpha = 1.0

}

}

//将底部stackView以动画的形式改成竖向排列

@IBAction func clickAddStarBtn(sender: AnyObject) {

UIView.animateWithDuration(0.3) { () -> Void in

self.bottomStackView.axis = .Vertical

}

}

//将底部stackView以动画的形式改成横向排列

@IBAction func clickBuyBtn(sender: AnyObject) {

UIView.animateWithDuration(0.3) { () -> Void in

self.bottomStackView.axis = .Horizontal

}

}

}

#pragma mark 4. UIStackView演练-点赞

1.stackView添加子视图

//创建星星

let star = UIImageView(image: UIImage(named: "star"))

//设置填充模式

star.contentMode = .ScaleAspectFit

//添加到stackView中  如果希望视图被其stackView来管理布局,则需要使用addArrangedSubview来添加视图

starsStackView.addArrangedSubview(star)

//设置autolayout动画

UIView.animateWithDuration(0.3) { () -> Void in

//对stackView进行立即布局

self.starsStackView.layoutIfNeeded()

}

2.stackView移除子视图

//取出最后一个星星

guard let lastStar = starsStackView.subviews.last else {

return

}

//从stackView中移除  removeArrangedSubview只会使stackView不再管理子视图的布局,但不是从视图层级上移除 想要从视图层级上移除需要使用removeFromSuperView

//        starsStackView.removeArrangedSubview(lastStar)

lastStar.removeFromSuperview()

//设置autolayout动画

UIView.animateWithDuration(0.3) { () -> Void in

//对stackView进行立即布局

self.starsStackView.layoutIfNeeded()

}

#pragma mark - 二. popover

#pragma mark 1. popover基本使用

1.SB中设置popover

1> 响应控件连线目标控制器 选择 Action as popover

2> 设置Popover的大小

override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {

//获取目标控制器

let destVC = segue.destinationViewController

//设置Popover的大小  当控制器为popover的目标控制器时,使用preferredContentSize才可以改变Popover的大小

destVC.preferredContentSize = CGSize(width: 200, height: 100)

}

2.来源视图类型的popover

//Popover根据产生的控件类型分为两种: 一种是barButtonItem类型,还有一种非barButtonItem类型,统称为来源视图类型,来源视图类型popover的参考点(箭头)默认在来源视图的左上角

//修改Popover的参考点

//获取Popover对象

let popover = destVC.popoverPresentationController

/*

public var sourceView: UIView? 来源视图 SB中拖线时会自动将响应控件设置为来源视图

public var sourceRect: CGRect 用于设置参考点  当设置来源视图的bounds时,参考点会设置在来源视图的中心点

*/

popover?.sourceRect = (popover?.sourceView?.bounds)!

#pragma mark 2. iPhone实现popover

//Popover在iPhone上进行默认的全屏展示,原因iOS系统对modal展示进行了界面自适应

//解决办法: 取消界面自适应  设置代理

popover?.delegate = self

extension ViewController: UIPopoverPresentationControllerDelegate {

//设置自适应的代理方法不在 UIPopoverPresentationControllerDelegate中,而是在其父协议  UIAdaptivePresentationControllerDelegate中

//当进行modal展示的界面自适应时调用

func adaptivePresentationStyleForPresentationController(controller: UIPresentationController) -> UIModalPresentationStyle{

//取消自适应

return .None

}

}

#pragma mark 3. 代码实现popover

override func viewDidLoad() {

super.viewDidLoad()

// Do any additional setup after loading the view, typically from a nib.

//来源视图类型Popover

let btn = UIButton(type: .ContactAdd)

btn.center = view.center

view.addSubview(btn)

btn.addTarget(self, action: "clickPopover:", forControlEvents: .TouchUpInside)

//barButtonItem类型

let item = UIBarButtonItem(title: "功能", style: .Plain, target: self, action: "clickPopover:")

navigationItem.rightBarButtonItem = item

}

//点击进行Popover

func clickPopover(sender : AnyObject){

//创建目标控制器

let vc = UIViewController()

vc.view.backgroundColor = UIColor.redColor()

//设置modal展示样式

vc.modalPresentationStyle = .Popover

//代码设置Popover需要手动设置来源视图/barButtonItem  设置类型必须在设置modal展示样式之后

//获取popover对象

let popover = vc.popoverPresentationController

//判断控件类型

if let btn = sender as? UIButton {

//设置来源视图

popover?.sourceView = btn

popover?.sourceRect = btn.bounds

} else if let item = sender as? UIBarButtonItem {

//设置barButtonItem

popover?.barButtonItem = item

}

//进行modal展示

presentViewController(vc, animated: true, completion: nil)

}

#pragma mark 4. popover的其他用法

1.设置忽略外部点击

vc.modalInPopover = true

2.设置可穿透视图  在Popover打开的情况下,可以响应其他控件的事件

popover?.passthroughViews = [testBtn]

#pragma mark - 三. iPad-modal展示

#pragma mark 1. Modal简介和unwind介绍

1.iPad中的展示样式:

1> FullScreen 默认展示样式 全屏展示

2> FormSheet iPad中最常用的modal展示效果  在屏幕中心显示小窗体

3> PageSheet 几乎占满全屏,使用较少 场景: 显示用户权益/法律法规

4> CurrentContext 在当前控制器的界面范围中展示以原控制器同样的方式进行展示

5> Over CurrentContext 当前控制器视图如果是半透明的,则可以透出前一个控制器的界面内容

2.Unwind Segue 解除跳转  iOS7

1> 可以在SB中实现界面的返回 可以用在modal&push中

2> 想要使用unwind Segue,必须设置segue的响应方法

//segue响应方法必须满足两个条件: 1> 必须含有@IBAction关键字 用于进行关联  2> 参数必须传递 segue本身  用于传值

@IBAction func back(segue : UIStoryboardSegue){

}

3> Unwind Segue可以实现跨控制器的解除跳转

#pragma mark 2. FromSheet&PageSheet

#pragma mark 3. CurrentContext展现和跨控制器解除

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 157,298评论 4 360
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 66,701评论 1 290
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 107,078评论 0 237
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,687评论 0 202
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,018评论 3 286
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,410评论 1 211
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,729评论 2 310
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,412评论 0 194
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,124评论 1 239
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,379评论 2 242
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,903评论 1 257
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,268评论 2 251
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,894评论 3 233
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,014评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,770评论 0 192
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,435评论 2 269
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,312评论 2 260

推荐阅读更多精彩内容