Я хочу пользовательский UIView
...: я просто хотел чистый белый вид с закругленными углами и легкой тенью (без эффекта освещения). Я могу сделать каждый из них один за другим, но происходят обычные clipToBounds
/ maskToBounds
конфликты.
iphone
ios
cocoa-touch
uiview
rounded-corners
Адитья Вайдям
источник
источник
Ответы:
Следующий фрагмент кода добавляет границу, радиус границы и тень к
v
, aUIView
:Вы можете настроить параметры в соответствии с вашими потребностями.
Кроме того, добавьте платформу QuartzCore в свой проект и:
Смотрите мой другой ответ относительно
masksToBounds
.Запись
Это может работать не во всех случаях. Если вы обнаружите, что этот метод мешает выполнению других операций рисования, см. Этот ответ .
источник
стриж
Изучение вариантов
Проблема 1: Тень отсекается
Что если есть подслои или подпредставления (например, изображение), содержимое которых мы хотим обрезать до границ нашего представления?
Мы можем сделать это с
(Альтернативно,
blueView.clipsToBounds = true
дает тот же результат .)Но нет! Тень также была обрезана, потому что она выходит за границы! Что делать? Что делать?
Решение
Используйте отдельные виды для тени и границы. Базовый вид прозрачен и имеет тень. Представление границы обрезает любой другой субконтент, который у него есть, к его границам.
Это дает следующий результат:
Проблема 2: низкая производительность
Добавление закругленных углов и теней может нанести удар по производительности. Вы можете улучшить производительность, используя предопределенный путь для тени, а также указав, что он должен быть растеризован. Следующий код может быть добавлен к примеру выше.
Смотрите этот пост для более подробной информации. Смотрите здесь и здесь также.
Этот ответ был протестирован с Swift 4 и Xcode 9.
источник
baseView.backgroundColor = UIColor.clear
удаляет тень. Только если вы установите цвет фона, вы увидите его.Один из способов сделать это - поместить вид с закругленными углами в вид с тенью.
Затем вы можете добавить shadowView куда угодно.
источник
Посмотрите пример проекта на GitHub, чтобы убедиться, что вы используете компонент правильно.
Решение Simple Swift 5 без каких-либо дополнительных подпредставлений или подклассов:
Обратите внимание, что вы должны настроить свой вид с угловым радиусом и другими свойствами перед вызовом
addShadow
.После этого просто позвоните вот
viewDidLoad
так:Конечный результат:
Супер просто и просто!
источник
layer.shadowPath = UIBezierPath.init(roundedRect: layer.bounds, cornerRadius: layer.cornerRadius).cgPath
. Хотя не могу объяснить, почему у кого-то есть объяснение этому?Это сработало для меня. Хитрость заключалась в том, чтобы переместить цвет фона с основного вида на слой.
источник
UIView extension
здесь - stackoverflow.com/a/43295741/1313939 спасибо за вдохновение!Я решил проблему, используя следующий прием при назначении теневого пути для представления контейнера:
Обратите внимание, что путь к тени представляет собой скругленный прямоугольник с тем же радиусом угла, что и фон, который содержит ячейка:
источник
Если вы боретесь из - за округляемой
corners
противsubviews
противmasksToBounds
, то попробуйте использовать свою функцию:назовите это на ваш взгляд. имеет ли ваш вид закругленные углы, независимо от его размера, формы - будет нарисована хорошая тень.
Просто сохраните возвращаемое значение функции, чтобы вы могли обращаться к нему, когда хотите удалить таблицу (или, например, использовать
insertSubview:aboveView:
)источник
shadow.userInteractionEnabled = NO; // Modify this if needed
линию? Так что это тот случай, когда это необходимо.userInteractionEnabled
является основным и популярным свойством, с которым вы уже должны быть знакомы :-)Используя Swift 4 и Xcode 9 , это рабочий пример округления
ImageView
с тенью и границей.Если вы хотите, чтобы изображение было круглым: (и показано без рамки)
источник
Я создал помощника на UIView
Вы можете назвать это так
Вот реализация
источник
После одного целого дня исследования кругового обзора с тенью я рад опубликовать здесь свой пользовательский класс uiview, надеясь закончить этот вопрос:
RoundCornerShadowView.h
RoundCornerShadowView.m
поэтому, НЕТ необходимости добавлять подпредставление в представлении или ниже в целевом представлении, просто добавьте один слой в текущем представлении и сделайте 3 шага, чтобы завершить его!
внимательно посмотрите на комментарии в коде, это полезно для понимания компонента!
источник
Что-то быстрое испытано в Swift 4
Производит
Если вы включите его в Инспекторе, как это:
Он добавит пользовательский атрибут времени выполнения, в результате чего:
(Я добавил ранее
cornerRadius = 8
):)
источник
Вы должны использовать
shadowView
и использоватьroundView
shadowView
roundView
shadowView
немного внутри, и его тень должна светиться. Отрегулируйтеinsets
так, чтобыshadowView
сзади было полностью не видноroundView
Roundview
Код
Или вы можете просто сделать ниже без указания
clipToBounds/maskToBounds
источник
Swift 3 & IBInspectable решение:
вдохновлено решением Ade
Сначала создайте расширение UIView:
Затем просто выберите свой UIView в настройке интерфейса, установив тень и радиус угла , как показано ниже:
Результат!
источник
Вот решение проблемы конфликта с masksToBounds, оно работает для меня.
После установки corderRadius / borderColor / shadow и т. Д. Установите для masksToBounds значение NO:
источник
Тень + Граница + Угловой Радиус
источник
Вот моя версия в Swift 3 для UIView
источник
Swift 4: создание подкласса UIView
С помощью..
источник
Хорошо, если вы не хотите менять свои кончики и просматривать иерархию, как предложено Дэвидом С., этот метод сделает это за вас. Чтобы добавить закругленные углы и тень к вашему UIImageView, просто используйте этот метод, например:
(!) По соображениям производительности я не думаю, что было бы хорошей идеей использовать этот код в чем-то вроде UITableView, так как этот код меняет иерархию представления. Поэтому я предлагаю изменить ваше перо и добавить контейнерное представление для эффекта тени и использовать код Davic C.
источник
Старый поток все еще актуален ...
Я отредактировал метод Даниэля Джинди, чтобы сделать возможным использование его с кнопками и т. Д. Если кому-то нужны скругленные углы или они хотят объединить закругленные углы и границу, это должно быть установлено на слое вида, который передается этому методу. Я также установил растеризацию, чтобы немного ускорить ее.
источник
Следующее работает лучше всего для меня (этот код находится в расширении UIView, поэтому self обозначает некоторый UIView, к которому мы должны добавить тень и закругленный угол)
Основное различие между этим и другими примерами кода заключается в том, что это добавляет теневое представление как одноуровневое представление (в отличие от добавления текущего представления как подпредставления теневого представления), тем самым устраняя необходимость каким-либо образом изменять существующую иерархию представления.
источник
Ответ от daniel.gindi выше помог мне! (+1 Даниэль) Однако мне пришлось внести незначительные корректировки - изменить размер shadowFrame, чтобы он соответствовал размеру кадра представления, и включить взаимодействие с пользователем. Вот обновленный код:
Я хотел бы добавить, что в моем случае я пытался добавить это к стороннему контроллеру представления, т.е. у меня не было прямого контроля над кодом. Итак, вот как я использовал функцию выше:
источник
Я делаю некоторые изменения в коде daniel.gindi
Это все, что вам нужно, чтобы это работало.
источник
Вам нужно использовать два,
UIViews
чтобы достичь этого. ОдинUIView
будет работать как тень, а другой будет работать для скругленной границы.Вот фрагмент кода
Class Method
с помощьюprotocol
:В приведенном выше коде
btnCompose_click:
станет@required
делегат метод, который будет срабатывать при нажатии кнопки.И вот я добавил кнопку к моему
UIViewController
так:Результат будет выглядеть так:
источник
Я попробовал так много решений из этого поста и в итоге нашел решение ниже. Это полное доказательство решения, если вам не нужно отбрасывать тени на четкое цветное представление .
источник
Вот решение, которое будет работать точно!
Я создал расширение UIView с необходимыми краями, чтобы применить тень, как показано ниже
Наконец, вы можете вызвать теневую функцию, как показано ниже для любого вашего подкласса UIView, вы также можете указать ребро, к которому будет применяться тень, попробуйте различные варианты в соответствии с вашими потребностями, изменяя параметры вызова метода ниже.
Изображение результата
источник
Ответ, предоставленный Эваном Мулавски, будет работать отлично. Уловка в том, что вы должны установить цвет фона для представления clearColor, а свойство masksToBounds - NO.
Вы можете установить любой цвет, который вы хотите для вида, установить его как
Надеюсь это поможет..
источник
Это то, как вы это делаете, с закругленными углами и закругленными тенями, не мешая дорожкам.
Представление с содержимым, в моем случае UIImageView, имеет угловой радиус и поэтому должно маскироваться до границ.
Мы создаем другое представление одинакового размера для теней, устанавливаем для его maskToBounds значение NO, а затем добавляем представление содержимого в представление контейнера (например, shadowContainer).
источник
Я пишу этот метод категории UIView, чтобы решить эту проблему, использует отдельные виды для тени и радиуса угла.
источник
Swift 4 Решения для создания UICollectionViewCell раунда и добавления теней , без каких - либо расширений и осложнений :)
Примечание. Для простых видов, например кнопок. Смотрите ответ @ suragch в этом посте. https://stackoverflow.com/a/34984063/7698092 . Успешно протестировано для кнопок
В случае , если какой - либо один до сих пор изо всех сил , чтобы закруглить углы и добавить тени в то же время. Хотя это решение работает с UICollectionViewCell, его можно обобщить для любого представления.
Эта техника работала для меня без каких-либо расширений и всех сложных вещей. Я работаю с storyBoard.
Техника
Вы должны добавить UIView (скажем, «containerView») внутри вашего UICollectionViewCell в storyBoard и добавить все необходимые представления (кнопки, изображения и т. Д.) Внутри этого containerView. Смотрите скриншот.
Подключите розетку для контейнера. Добавьте следующие строки кода в делегатскую функцию CellforItemAtIndexPath.
Вывод
Посмотреть скриншот симулятора
источник
источник