Який найкращий спосіб створити тінь за UIImageView


75

У мене є UIImageView, до якого я хочу додати тінь. Я хотів би, щоб яблуко мало це як властивість, але їм доводиться ускладнювати багато речей для нас, програмістів, тому мені потрібно задати це питання.


1
Ймовірно, ви хочете використовувати функції малювання Core Graphics для малювання тіні.
Grant Paul,

Відповіді:


215

Існує кращий і простіший спосіб зробити це. UIImageView успадковує від UIView, тому він має властивість шару. Ви можете отримати доступ до властивостей тіні шару та bam, ви отримали тінь.

Якщо у вас є UIImageView як IBOutlet для файлу nib, ви можете просто реалізувати awakeFromNib, наприклад

Завдання-C

- (void)awakeFromNib {
    imageView.layer.shadowColor = [UIColor purpleColor].CGColor;
    imageView.layer.shadowOffset = CGSizeMake(0, 1);
    imageView.layer.shadowOpacity = 1;
    imageView.layer.shadowRadius = 1.0;
    imageView.clipsToBounds = NO;
}

Не забувайте це робити #import "QuartzCore/CALayer.h"


Для Swift ви можете зробити це кількома шляхами. Створіть розширення класу, підклас або екземпляр imageView. У будь-якому випадку, процес однаковий при зміні властивості тіней шарів.

Стрімкий 3

override func awakeFromNib() {
    super.awakeFromNib()

    imageView.layer.shadowColor = UIColor.purple.cgColor
    imageView.layer.shadowOffset = CGSize(width: 0, height: 1)
    imageView.layer.shadowOpacity = 1
    imageView.layer.shadowRadius = 1.0
    imageView.clipsToBounds = false
}

32
Вам також може знадобитися, imageView.clipsToBounds = NO;інакше тінь буде відірвана.
mxcl

18
Вам також потрібно буде імпортувати "QuartzCore / CALayer.h"
розробник

1
@MaxHowell за допомогою clipsToBounds додав тінь, але тепер моє зображення переповнює свої межі, також коли використовується режим "Aspect Fill". Чи є спосіб закріпити зображення, але не тінь?
Дерек Дамер,

6
@DerekDahmer вам доведеться додати imageView як підпрогляд іншого подання, до якого ви потім застосуєте тінь, а потім відріжте imageView, але не вигляд контейнера. Я не знайшов іншого способу впоратися з подібними речами.
mxcl

5
Додати imageView.layer.shouldRasterize = ТАК; для прискорення обробки
malaki1974

11

Найпростіше, що потрібно зробити, це додати шар тіні до подання зображення:

CALayer             *layer = [CALayer layer];
CGRect              bounds = self.bounds;

layer.bounds = bounds;
layer.position = CGPointMake(bounds.size.width / 2 + 3, bounds.size.height / 2 + 3);
layer.backgroundColor = [UIColor colorWithWhite: 0.25 alpha: 0.55].CGColor;
layer.zPosition = -5;

[self.layer addSublayer: layer];

Переконайтеся, що для перегляду вимкнено функцію "Підзаголовки кліпів"


1
чому ви робите межі CGRect *, коли ви можете просто встановити межі шару на self.bounds? А де тінь стає на місце?
Яб,

Я створюю змінну temp для читабельності; введення self.bounds трохи довше, ніж просто межі, і робить код трохи менш читабельним. Цей шар - це тінь. Звичайно, це передбачає наявність у вас квадратного зображення; якщо ви робите не прямокутне зображення, вам доведеться використовувати власну маску зображення.
Бен Готліб,

Ну, я хочу, щоб воно зникло, і я не знаю, як би я це зробив. Прохання допомогти!
Jab

1
Затухання - це окреме завдання. Якщо ви хочете мати власну тінь (щось інше, ніж простий темний прямокутник за вашим зображенням), вам слід взяти зображення, зробити його маскою (тобто повністю чорною та прозорою), застосувати свій вицвітання, а потім намалювати його ззаду оригінал, використовуючи або кварц, або наклеюючи шар.
Бен Готліб

9

Швидке рішення з розширенням. Підкласифікація не потрібна. Дзвінок myImage.addShadow()від viewDidLoad(). Це повинно працювати для UIViewі UIImageView.

extension UIView {

    func addShadow() {
        layer.shadowColor = UIColor.black.cgColor
        layer.shadowOffset = CGSize(width: 0, height: 0)
        layer.shadowOpacity = 0.5
        layer.shadowRadius = 5
        clipsToBounds = false
    }
}

Коли я намагаюся зателефонувати цьому, я отримую 'Значення типу' UIImage 'не має члена' addShadow '
user1904273

5

крім цього, якщо ви хочете зробити білу межу та тінь, ви можете використовувати цей код:

//shadow part
imageView.layer.shadowColor = [UIColor blackColor].CGColor;
imageView.layer.shadowOffset = CGSizeMake(0, 1);
imageView.layer.shadowOpacity = 1;
imageView.layer.shadowRadius = 1.0;
//white border part
[imageView.layer setBorderColor: [[UIColor whiteColor] CGColor]];
[imageView.layer setBorderWidth: 2.0];

Але в цьому випадку, як зробити тінь частиною властивості .image, скажімо, зберегти або показати це зображення десь ще?
alejandrormz

Ви не можете. Ви не редагуєте зображення, а прикрашаєте його для показу. Насправді редагувати растрові дані набагато складніше. Подумайте про те, щоб просто прикрасити зображення скрізь, де ви його відображаєте, оскільки, як правило, ви не хочете обробляти зображення, щоб додати такі види ефектів, якщо ви не робите цього в задній частині, яка обробляє їх партіями.
Тім
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.