Хитрости разработчика под iOS. Splash Screen

Вступление

Приветствую, читатели!

В ходе разработки приложений под iOS у меня накопились некоторые хитрости, которыми я хотел бы поделиться с Вами.

Сразу предупрежу, что я стараюсь шагать в ногу со временем, поэтому примеры будут под iOS >=5.0 и использовать Storyboard и ARC, но ничего не мешает их портировать на 4.*.

Если вы давно разрабатываете под iOS — для вас бОльшая часть сказанного мною будет очевидной, но при этом я хотел бы, чтобы вы присоединились к обсуждению и рассказали, как вы реализуете подобное.

Заинтересовавшимся — прошу под кат (Пост содержит скриншоты областей Interface Builder-а, поэтому предупреждаю о траффике).

Splash screen

По умолчанию, iOS предоставляет механизм отображения картинки загрузки приложения в виде указания png-файлов под определённые разрешения, этим сейчас никого не удивишь. Но iOS славится своими transition-ами, анимациями и прочим, это смотрится прикольно и благодаря API Core Animation делается совсем не сложно.

Мне всегда нравился стартовый экран у Skype.app, когда логотип приложения после загрузки уходил вверх, а на экране появлялись элементы ввода. Красиво и легко.

Используя Storyboard, задача становится тривиальной:

Допустим, у нас есть некоторый экран, на который мы попадаем при старте приложения:

А наш Default.png выглядит примерно так:

Если сейчас запустить приложение, то сначала мы увидим Default.png, а потом сразу же попадём на стартовый экран. Выглядит не очень, согласитесь? Чтобы исправить это, мы создадим ещё один экран, начальное состояние которого будет идентично по виду нашему Default.png и будет содержать outlet UIImageView. сделаем его стартовым и укажем базовый класс, например, SplashScreenViewController:

View очень простой, фон + UIImageView с логотипом по центру. Он будет связан с SplashScreenViewController посредством аутлета с именем imageView.

Теперь создадим Segue от только что созданного экрана к стартовому экрану.

Для тех, кто только изучает Storyboard, или просто забыл, напоминаю, что чтобы создать Segue не по событию, а просто как связь, вы должны начать тянуть его от StatusBar-а исходного ViewController-а и вызывать его вручную (как — покажу дальше в коде):

Параметры:

• identifier: splash
• Style: Custom
• Segue Class: SplashSegue (мы создадим этот класс чуть позднее)

Код для этого примера будет выглядеть примерно так:

@interface SplashSegue : UIStoryboardSegue
@end

@interface SplashScreenViewController : UIViewController

@property IBOutlet UIImageView *imageView;

@end

@implementation SplashScreenViewController

- ( void ) viewDidAppear:(BOOL)animated
{
	[super viewDidAppear:animated];

	// Анимируем стандартными средствами Cocoa
	[UIView animateWithDuration:1.0 delay:0.2 options:0
					 animations:^
					 {
						 // Сделаем простую анимацию смещения логотипа вверх (в моём примере
						 //  логотип встаёт на позицию, которая совпадает с онной в стартовом экране,
						 //   чтобы переход не был заметен
						 CGRect frame = self.imageView.frame;
						 frame.origin.y = 15.0;
						 self.imageView.frame = frame;
					 }
					 completion:^( BOOL completed )
					 {
						 // По окончанию анимации выполним наш переход к стартовому экрану
						 [self performSegueWithIdentifier:@"splash" sender:self];
					 }];
}

@end


@implementation SplashSegue

- ( void ) perform
{
	// Для перехода к стартовому экрану будем использовать стандартный presentModalViewController.
	// Обратите внимание на параметр animated, я намеренно установил его в NO, т.к. анимацию перехода
	// мы выполнили заранее. 
	[[self sourceViewController] presentModalViewController:[self destinationViewController] animated:NO];
}

@end

Теперь если мы запустим наше приложение, то сначала мы увидим логотип с Default.png, потом (незаметно для пользователя) экран сменится на наш SplashScreen, проиграет анимация движения логотипа вверх, после чего так же незаметно экран сменится на стартовый.

Данная простая по виду задачка анимации перехода от экрана загрузки к стартовому учит нас:

• Программно создавать переходы (Segue) между экранами в Storyboard-е
• Реализовывать собственную логику Segue
• Не бояться пользоваться встроенными средствами Cocoa и выполнять то, что оценивается человекоднями, за человекочасы:)

Я сам данной платформой занимаюсь относительно недавно и порой мне не хватает таких вот уроков, и я уверен, что найдутся те, кому это так же будет полезно, так что не судите строго, если для вас он оказался бесполезным;)

UPD:
Добавил видеодемонстрацию эффекта в эмуляторе

Автор: bsideup

Источник