详解iPad横竖屏切换解决方案是本文要介绍的内容,不多说,先来看内容。由于ipad的横竖屏不同,所以好的应用,横竖屏的页面布局也不一样。那么就需要横竖屏的整体解决方案。先看一个横竖屏布局不一样的界面。
上面两张图是来自同一个界面的横竖版的截屏。可以看出,横竖版显示的内容相同,但是界面布局不同。要实现上述布局,主要是运用UIView中layoutSubviews方法。当UIView设置为自动适配屏幕时,当用户旋转设备的时候,会调用layoutSubviews方法,我们只需重写这个方法,然后判断用户屏幕的方向。在调整每个空间的位置即可。
下面是实现上述界面的最简单的原型:
首先分析可以知道左面是图片,右面是一个图片加文字的视图。下面就实现一个左面视图右面是一个图加一段字的事例。
事例的截图如下:
其中右面的文字和绿色部分是用一个子视图封装的。
整个布局是我在主视图中添加了一个ContentView视图,在ContentView视图中添加了一个ArticleView视图。
其中ArticleView和ContentView的xib文件都打开了
在ContentView中重写layoutSubviews方法,然后根据stausbar的方向判断当前视图的横竖屏。具体代码:
- -(void)layoutSubviews{
- [super layoutSubviews];
- UIDeviceOrientation interfaceOrientation=[[UIApplication sharedApplication] statusBarOrientation];
- if (interfaceOrientation == UIDeviceOrientationPortrait || interfaceOrientation == UIDeviceOrientationPortraitUpsideDown) {
- //翻转为竖屏时
- [self setVerticalFrame];
- }else if (interfaceOrientation==UIDeviceOrientationLandscapeLeft || interfaceOrientation == UIDeviceOrientationLandscapeRight) {
- //翻转为横屏时
- [self setHorizontalFrame];
- }
- }
- -(void)setVerticalFrame
- {
- NSLog(@"竖屏");
- [titleLable setFrame:CGRectMake(283, 0, 239, 83)];
- [leftView setFrame:CGRectMake(38, 102, 384, 272)];
- [rightView setFrame:CGRectMake(450, 102, 282, 198)];
- }
- -(void)setHorizontalFrame
- {
- NSLog(@"横屏");
- [titleLable setFrame:CGRectMake(183, 0, 239, 83)];
- [leftView setFrame:CGRectMake(168, 122, 384, 272)];
- [rightView setFrame:CGRectMake(650, 122, 282, 198)];
- }
在具体的横竖屏方法中,从新设置各个组件的坐标即可。
接下来在ContentView中添加ArticleView视图。
- -(id)initWithCoder:(NSCoder *)aDecoder
- {
- if ((self = [super initWithCoder:aDecoder])) {
- NSArray *arrayContentView =[[NSBundle mainBundle] loadNibNamed:@"ArticleView" owner:self options:nil];
- rightView=[arrayContentView objectAtIndex:0];
- [self addSubview:rightView];
- }
- return self;
- }
由于我用的是xib,所以初始化方法为initWithCoder,在这个中添加新的视图。
同样在ArticleView中设置横竖屏相应空间的坐标即可。
- -(void)layoutSubviews{
- [super layoutSubviews];
- UIDeviceOrientation interfaceOrientation=[[UIApplication sharedApplication] statusBarOrientation];
- CGRect rect=self.frame;
- rect.size.width=282;
- rect.size.height=198;
- [self setFrame:rect];
- if (interfaceOrientation == UIDeviceOrientationPortrait || interfaceOrientation == UIDeviceOrientationPortraitUpsideDown) {
- //翻转为竖屏时
- [self setVerticalFrame];
- }else if (interfaceOrientation==UIDeviceOrientationLandscapeLeft || interfaceOrientation == UIDeviceOrientationLandscapeRight) {
- //翻转为横屏时
- [self setHorizontalFrame];
- }
- }
- -(void)setVerticalFrame
- {
- NSLog(@"竖屏");
- [contentView setFrame:CGRectMake(12, 6, 250, 125)];
- [textLable setFrame:CGRectMake(50, 139, 182, 39)];
- }
- -(void)setHorizontalFrame
- {
- NSLog(@"横屏");
- [contentView setFrame:CGRectMake(12, 6, 106, 158)];
- [textLable setFrame:CGRectMake(135, 11, 147, 39)];
- }
源代码:http://easymorse-iphone.googlecode.com/svn/trunk/IpadLayOut/
小结:详解iPad横竖屏切换解决方案的内容介绍完了,通过ipad屏幕切换的内容,是不是以及很清楚了,最后希望本文对你有所帮助。