Blur в iOS7

в 12:15, , рубрики: Без рубрики

С седьмой версией iOS многие элементы UI стали выглядеть привлекательнее (см. Session 226, Implementing Engaging UI on iOS).

Например, теперь поп-оверы, большинство баров и алерты имеют размытый фон.

Blur в iOS7

Что делать, если хочется добавить блюр в свой контрол, подскажет эта статья.

Блюр бывает разный

Есть два типа блюра: статический и динамический. Как и следует из названия, первый размывает контент единожды, а второй обновляется через небольшие промежутки времени.

Реализовать блюр несложно. Общая схема такая: сделать снимок фона за view, (например, при помощи renderInContext), размыть его и установить полученное изображение в качестве фона view. В случае динамического блюра все вышеперечисленные действия выполняются по таймеру. Как пример такого подхода рекомендую глянуть FXBlurView.

Главным плюсом 7-ки в плане блюра является высокая скорость работы. Например, можно смотреть видео и при этом панель с регулировкой громкости будет блюриться в реальном времени без каких-либо лагов.

Итак, способы реализовать быстрый блюр в iOS 7.

Кража лейера

Идея довольно проста. Раз у UIToolbar есть прозрачность, то можно взять и использовать его лейер в качестве фона.

UIToolbar *toolbar = [[UIToolbar alloc] initWithFrame:[self bounds]]];
[toolbar setBarTintColor:[UIColor greenColor]];
[self.layer insertSublayer:[self.toolbar layer] atIndex:0];

Подход хорош, работает стабильно и очень прост.
Уже есть готовая реализация под названием iOS-blur (доступна через CocoaPods).

Использование drawViewHierarchyInRect:afterScreenUpdates

Если стоит задача наворотить хитрый блюр, то придется самим брать фон и размывать его.
К счастью, в iOS 7 появился чрезвычайно быстрый способ создания снимков view drawViewHierarchyInRect:afterScreenUpdates.

Blur в iOS7
На картинке из презентации видно, что скорость получения снимка view возросла в 15 раз!

Использовать довольно просто (готовая реализация):

-(UIImage *)blurredSnapshot
{
    UIGraphicsBeginImageContextWithOptions(self.bounds.size, NO, self.window.screen.scale);
    [self drawViewHierarchyInRect:self.frame afterScreenUpdates:NO];
    UIImage *snapshotImage = UIGraphicsGetImageFromCurrentImageContext();
    UIImage *blurredSnapshotImage = [snapshotImage applyLightEffect];
    UIGraphicsEndImageContext();
    return blurredSnapshotImage;
}

Как пример реализации динамического блюра рекомендую глянуть 7blur.

Заключение

Блюр на iOS7 работает очень быстро, и его несложно реализовать. Так что смело используйте его в своих приложениях, не боясь потерять производительность.

Автор: Fanruten

Источник

* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js