iOS开发实例（五）- 自动旋转

iOS开发实例（五）- 自动旋转

自动旋转屏幕有3种常用方法：

一、自动调整属性（适用比较简单的界面）。

       1、创建一个项目Autosize，系统是默认支持Portrait（纵版）、Landscape Left（向左横向）、Landscape Right（向右横向），不支持Upside Down（倒过来），如下图：

2、打开.xib文件，在IB中拖出6个Round Rect Button，按下图摆放和命名：

这个时候Run一下程序，然后在菜单处找到硬件->向左旋转。然后得到如下图结果：

你会发现只有UL位置是对的，其他的都有问题。

3、选中按钮，在属性处找到大小检查器，如下图：

方块里面箭头（→）：实线表示可在调整窗口大小时自由更改对象的宽度，虚线表示将对象尽可能的保持原始值。

方块周围的“I”形：表示选定对象的边与包含它的视图的同侧边之间的距离。虚线表示距离是可以灵活可变的，实线表示间距的指应尽可能的保持不变。

4、根据上面的规则修改，如下图：

然后我们在Run一下程序，然后依次点击硬件->向左旋转，如果得到如下图结果，那就证明你成功了。

 

二、看到视图旋转提示时，手动调整视图中的对象位置。

1、选中6个按钮，同时把他们的高度和宽度设置成125点，然后效果图如下：

2、这个时候我们Run一下程序，然后旋转就会得到如下面的效果：

好混乱，感觉不会再看了。这样的问题要怎么样去解决呢？

3、手动调整视图位置：按住control键分别把6个按钮拖到.h文件的@end前，依次分别命名为：buttonUL，buttonUR，buttonL，buttonR，buttonLL，buttonLR。生成的代码如下：

@property (weak, nonatomic ) IBOutlet UIButton *buttonUL;
@property (weak, nonatomic ) IBOutlet UIButton *buttonUR;
@property (weak, nonatomic ) IBOutlet UIButton *buttonL;
@property (weak, nonatomic ) IBOutlet UIButton *buttonR;
@property (weak, nonatomic ) IBOutlet UIButton *buttonLL;
@property (weak, nonatomic ) IBOutlet UIButton *buttonLR;

4、在旋转时移动代码：在.m文件@end前写一个旋转开始之后的方法，最后的旋转动画发生之前自动调用。代码如下：

-( void )willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)interfaceOrientation duration:( NSTimeInterval )duration{
    if (UIInterfaceOrientationIsPortrait(interfaceOrientation)){
        buttonUL.frame = CGRectMake(20, 20, 125, 125);
        buttonUR.frame = CGRectMake(175, 20, 125, 125);
        buttonL.frame = CGRectMake(20, 168, 125, 125);
        buttonR.frame = CGRectMake(175, 168, 125, 125);
        buttonLL.frame = CGRectMake(20, 315, 125, 125);
        buttonLR.frame = CGRectMake(175, 315, 125, 125);
    } else {
        buttonUL.frame = CGRectMake(20, 20, 125, 125);
        buttonUR.frame = CGRectMake(20, 155, 125, 125);
        buttonL.frame = CGRectMake(177, 20, 125, 125);
        buttonR.frame = CGRectMake(177, 155, 125, 125);
        buttonLL.frame = CGRectMake(328, 20, 125, 125);
        buttonLR.frame = CGRectMake(328, 155, 125, 125);
    }
}

所有的视图的大小位置都在frame属性中指定，CGRectMake函数支持通过指定的x和y的位置以及width和height来轻松创建CGRect。然后我们Run一下程序，得到如下效果：

其实这样做的有点复杂的。

 

三、在IB中为视图设计两个不同的版本，一个适用于纵版，一个适用于横板。

1、需要我们新建一个Swap项目。我们需要在nib文件中添加两个视图。默认的就是第一个视图，然后我们可以按住 option 键复制另一份视图，然后在属性检查器中的 Simulated Metrics 找到Orientation 菜单把 Portrait 改为 Landscape ，如下图所示：

2、创建两个视图：打开辅助编辑器，按住 Control 把视图拖到.h文件中，创建一名为 portrait 的输出口，Storage 为 Strong，如下图：

为横向视图重复以上操作，创建一名为 landscape 的输出口。

3、在IB库中拖出Round Rect Buttons，分别放入每个视图中，然后是大小检查器中将Width和Height属性改为125，然后移动位置，并且将标签改为Foo 和 Bar。结果如下图所示：

4、创建和关联按钮的输出口：按住control 把横向视图中的Foo按钮拖到.h文件中，将Connection 弹出菜单的值从Outlet 改为Outlet Collection，并且命名为foos。从纵向视图中的Foo 按钮拖至已存在的foos 输出口，与之关联。

对Bar 按钮进行以上重复动作，命名为bars。

5、创建一个操作方法，将四个按钮关联起来：按住control 键从横向视图的Foo按钮拖到.h文件，关联类型从Outlet 改为Action，操作名为buttonTapped 。然后将其他三个按钮都关联至该操作，然后保存。

 

6、开打.m文件在文件顶部添加如下C宏：

#define degreesToRadians(x) (M_PI * (x) / 180.0)//用于角度与弧度之间转换的宏

然后在最后一个@sythesize 之后添加如下方法（修改willAnimateRotationToInterfaceOrientation方法）：

- ( void )willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)
interfaceOrientation duration:( NSTimeInterval )duration {

    if (interfaceOrientation == UIInterfaceOrientationPortrait) {
        self .view = self .portrait;
        self .view.transform = CGAffineTransformIdentity;
        self .view.transform =
        CGAffineTransformMakeRotation(degreesToRadians(0));
        self .view.bounds = CGRectMake(0.0, 0.0, 320.0, 460.0);
    }
    else if (interfaceOrientation == UIInterfaceOrientationLandscapeLeft) {
        self .view = self .landscape;
        self .view.transform = CGAffineTransformIdentity;
        self .view.transform =
        CGAffineTransformMakeRotation(degreesToRadians(-90));
        self .view.bounds = CGRectMake(0.0, 0.0, 480.0, 300.0);
    }
    else if (interfaceOrientation ==
             UIInterfaceOrientationLandscapeRight) {
        self .view = self .landscape;
        self .view.transform = CGAffineTransformIdentity;
        self .view.transform =
        CGAffineTransformMakeRotation(degreesToRadians(90));
        self .view.bounds = CGRectMake(0.0, 0.0, 480.0, 300.0);
    }
}

其实到这里，你Run一下程序，然后再旋转一下屏幕结果如下的话，你就成功了。

 

下面的步骤就是为了验证一下这个方法

7、在.m文件中找到buttonTapped 这个方法，添加一些代码，结果代码如下：

- ( IBAction )buttonTapped:( id )sender {
     NSString *message = nil ;

     if ([ self .foos containsObject:sender])
     message = @ "Foo button pressed" ;
     else
     message = @ "Bar button pressed" ;

     UIAlertView *alert = [[UIAlertView alloc] initWithTitle:message
     message: nil
     delegate: nil
     cancelButtonTitle:@ "Ok"
     otherButtonTitles: nil ];
     [alert show];
}

效果就是点击按钮会弹出一个对话框。

8、为了验证对元素进行更改时，纵向版本和横向版本都是相同的。我们把buttonTapped 方法换成如下代码：

- ( IBAction )buttonTapped:( id )sender {
    if ([ self .foos containsObject:sender]) {
        for (UIButton *oneFoo in foos) {
            oneFoo.hidden = YES ;
        }
    }
    else {
        for (UIButton *oneBar in bars) {
            oneBar.hidden = YES ;
        }
    }
}

效果就是你点击一下按钮，按钮就会隐藏。（横向的时候点击按钮隐藏一个按钮之后，纵向之后那个按钮也为隐藏的）

 

四、小结

这次讲了实现自动旋转调整大小的三种方法，第一种只要点点鼠标，很简单，但不适合复杂的视图；第二种要重新设置控件的大小和位置，代码量会比较大；第三种是创建两种视图，旋转时调用不同的视图，比较适合复杂的视图。