Круглый UIVisualEffectView

У меня есть карта. На карте я хотел бы нарисовать маленький, размытый круг. Я реализовал что-то вроде этого:

UIVisualEffect *visualEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];
self.visualEffectView = [[UIVisualEffectView alloc] initWithEffect:visualEffect];
[self addSubview:self.visualEffectView];

а затем в layoutSubviews:

[self.visualEffectView setFrame:CGRectMake(0.f, 0.f, 20.f, 20.f];

Теперь проблема заключается в том, чтобы сделать этот обзор круглым. Я пробовал:

[self.visualEffectView.layer setCornerRadius:10.f];

Однако ничего не происходит. Другая попытка заключалась в (на основе вопроса SOF):

CAShapeLayer *mask = [CAShapeLayer layer];
mask.path = [UIBezierPath bezierPathWithOvalInRect:self.visualEffectView.bounds].CGPath;
self.visualEffectView.layer.mask = mask;

Но в этом случае visualEffectView круглый, но не размывается:/. Есть ли способ заставить его работать?

Кстати: я пробовал FXBlurView, однако он работает очень медленно, я не могу принять приложение для загрузки только карты + размытие в течение ~ 1 минуты на iPhone 5.

ОТВЕТЫ

Ответ 1

Хорошо, так что есть возможность применить закругленные углы, как на обычном UIView. Однако UIVisualEffectView не будет выглядеть хорошо, потому что область, близкая к изогнутым "сторонам" круга, не будет размыта должным образом. Потому что это выглядит багги и уродливые, я не могу обойти раунд UIVisualEffectView.

Ответ 2

Tryout:

self.visualEffectView.clipsToBounds = YES;

Поместите это после того, как вы установите cornerRadius. Это должно быть. Вы можете оставить материал BezierPath. Надеюсь, это поможет:)

ИЗМЕНИТЬ

Я просто попробовал что-то подобное в своем собственном проекте. И хороший способ сохранить размытие с круглыми углами - просто поместить визуальный эффект в качестве ребенка нового вида с тем же фреймом, что и визуальный эффект. Теперь вы можете просто задать радиус угла этого нового родительского объекта UIView и установить его свойство clipsToBounds на YES. Затем он автоматически дает своим подзонам угловой радиус, поскольку он зажимается до его границ.

Попробуй, он работает в моем случае.

Ответ 3

Я понял это, если кто-то хочет знать, как это сделать, никакого кода не требуется:

  • Создайте представление и установите его фон "Очистить цвет" в редакторе атрибутов (он ДОЛЖЕН быть прозрачным цветом, но не по умолчанию.

  • Перетащите еще один вид поверх первого представления, размер его до размера, который вы хотите видеть в представлении визуального эффекта, и в редакторе атрибутов установите его фон в "Очистить цвет" и установите флажок "Подвижные клипы",

    Также в этом представлении перейдите к инспектору идентификации и в разделе "Определенные пользователем атрибуты времени выполнения" добавьте новый путь к ключу с именем "layer.cornerRadius", введите его "Number" и установите для него значение 9 или выше для приличный округлый край. (Там есть ошибка в Xcode, которая изменит путь Key на значение по умолчанию, как только вы измените Type, если это произойдет, просто вернитесь и повторно введите layer.cornerRadius).

  • Перетащите визуальные эффекты с размытием поверх представления на шаге 3.

  • Теперь запустите свою программу. У вас будут закругленные края, размытие и отсутствие артефактов.

Теперь я создал свою, где она соединяется с помощью segue, если вам нужно это для работы с segue, ваш segue должен быть установлен в Modal, а для презентации должен быть установлен OVER Full Screen (а не только полный экран).

Вот ссылка на файл проекта, который демонстрирует его. Обратите внимание на иерархию представлений во втором контроллере представления: Файл проекта в Dropbox

РЕДАКТОР: Моя фотография исчезла, поэтому я ее прочитал. Пример

Ответ 4

чтобы нарисовать круг, CornerRadius должен быть равен ширине /2 в вашем примере width = 30, то CornerRadius = 30/2 = 15;