给iPhone程序创建Splash欢迎界面

Posted by Elton's Blog on June 23, 2009

看到很多iPhone的程序都有一个欢迎页面,看到网上有篇文章,参考结合自己的实际做了一个例子。

官方SDK最简单的方法

最简单的方法就是做一个全屏的欢迎页的图片,把它命名为Default.png,然后放在Xcode工程的Resource里面。 执行就可以看到你的这个默认图像在程序完全加载之前显示在屏幕上。

但是这个方法有个问题,如果你的程序很快载入了,这个图片会立刻消失,导致还没有看清楚图片上的内容。 而且有些内容虽然程序已经载入了,但是有些程序需要的资源是要从服务器上加载的,所以直接进入程序,用户还是无法使用这个应用。

自定义model view方法

这个方法的大体思路就是创建一个model view,在程序载入完成后调用这个model view,显示其中的图片。当你的资源载入完成后,再完全移除这个model view。 具体方法为:

  1. 随便建立一个iPhone的工程,例如叫Splash。
  2. 在SplashAppDelegate.m中,在applicationDidFinishLaunching方法的最后加入:
  3. [viewController showSplash];
    
    以在加载程序完成后,显示欢迎页
  4. 在SplashViewController.h加入以下属性和方法
  5. #import <uikit/UIKit.h>
    
    @interface SplashViewController : UIViewController {
    	IBOutlet UIView *modelView;
    
    }
    
    - (void) showSplash;
    - (void) hideSplash;
    
    @end
    
    其中*modelView就是我们要用到的model view,用来显示splash图片的。 另外两个方法是控制显示和隐藏这个splash的
  6. 在SplashController.m加入上面定义的两个方法的实现
  7. -(void)showSplash
    {
    	UIViewController *modalViewController = [[UIViewController alloc] init];
    
    	modalViewController.view = modelView;
    
    	[self presentModalViewController:modalViewController animated:NO];
    
    	[self performSelector:@selector(hideSplash) withObject:nil afterDelay:2.0];
    
    }
    
    //hide splash screen
    
    - (void)hideSplash{
    
    	[[self modalViewController] dismissModalViewControllerAnimated:YES];
    
    }
    

  8. 创建视图
  9. 在Interface builder中给SplashView添加一个view视图,在工具栏里面拖拽一个view视图到Splash VIew中 [caption id="attachment_120" align="alignnone" width="272" caption="view视图"]view视图[/caption] [caption id="attachment_121" align="alignnone" width="225" caption="添加view视图"]添加view视图[/caption] 链接File's Owner中的modelview到新建的view上 [caption id="attachment_122" align="alignnone" width="281" caption="链接modelview到新建的view上"]链接modelview到新建的view上[/caption]
  10. 添加imageView到新建的view上
  11. 拖拽一个imageview到刚建立的view中 [caption id="attachment_123" align="alignnone" width="272" caption="添加imageview"]添加imageview[/caption] 选中这个imageview,修改其中的image属性为你指定的图片,我这里选择了之前导入的Default.png [caption id="attachment_124" align="alignnone" width="285" caption="指定图片"]指定图片[/caption]

之后你就可以运行了,应该是2秒后,splash图片自动消失。