2010-12-30 3 views
28

Я видел похожие вопросы, но не нашел работоспособных ответов.Как маскировать UIViews в iOS

Я хочу замаскировать UIView с помощью серого изображения (нужно преобразовать в альфа-шкалу для маскировки). У UIView есть фон. Должно быть легко замаскировать изображение, но я хочу замаскировать любой UIView.

Любые подсказки будут оценены.

ответ

67

Я работаю над этой проблемой в течение нескольких часов и имею решение, которое, я думаю, будет делать то, что вы хотите. Во-первых, создайте свое маскирующее изображение, используя любые средства, которые, по вашему мнению, подходят. Обратите внимание: нам нужны только значения альфа, все остальные цвета будут проигнорированы, поэтому убедитесь, что используемый вами метод поддерживает альфа-значения. В этом примере я загружаюсь из файла .png, но не пытаюсь использовать файлы .jpg, так как они не имеют альфа-значений.

Далее создайте новый слой, присвоить маску на его содержание и установить этот новый слой на свой собственный слой UIView, как и так: вы должны найти, что это маскирует UIView и все присоединенные подвиды:

UIImage *_maskingImage = [UIImage imageNamed:@"mask"]; 
CALayer *_maskingLayer = [CALayer layer]; 
_maskingLayer.frame = theView.bounds; 
[_maskingLayer setContents:(id)[_maskingImage CGImage]]; 
[theView.layer setMask:_maskingLayer]; 

С этим вы можете установить цвет фона UIView в любое удобное для вас время, а маска будет использоваться для создания цветного фильтра.

EDIT: Начиная с iOS8 вы можете маскировать вид, просто назначив другое представление его свойству maskView. Общие правила остаются такими же, что альфа-слой maskView используется для определения непрозрачности вида, к которому он применяется.

+0

Спасибо за ваш ответ. Проблема в том, что у меня есть только изображения с серой шкалой (альфа == 1 для всех точек). Я хочу преобразовать изображение в сером масштабе в альфа-изображение. Есть ли у вас какие-либо идеи? – subchap

+2

Ну, лучший способ сделать это - взять его в набор для редактирования изображений, например Photoshop, и сделать там конвертацию. Альтернативой было бы сделать это программно, создав новый контекст изображения, а затем пройдя по пикселям по старому изображению, просматривающему серый компонент, и превратив его в альфа-компонент для вашего нового цвета, прежде чем нанести его на новое изображение ,Это трудоемко и пустая трата времени, поскольку вы будете использовать меньше процессорного времени, выполнив его в пакете краски. – Ash

+1

В фотошопе это легко сделать: (1) создать новый слой (2) заполнить его частью черным (3), дать маске слоя (4) за изображение в оттенках серого в маске. Черный = прозрачный, белый = непрозрачный, серый цвет различной степени прозрачности. (5) Примените маску слоя (щелкните правой кнопкой мыши по самой маске на панели слоев и нажмите «применить маску слоя») (6) обрезайте часть слоя, в которой вы нуждаетесь. –

1

Я не знаю точного кода с верхней части головы, но основная идея состоит в том, чтобы иметь два UIViews. Один UIView будет иметь свойство изображения, которое будет отображаться в виде серого масштаба, а другой UIView будет установлен как обычно, единственное отличие состоит в том, что вы позиционируете исходный UIView непосредственно поверх UIView, содержащего «нормальное» изображение.

Надеюсь, этого достаточно, чтобы продвинуть вашу идею дальше.

+0

Спасибо за ваш ответ. Я не дал понять, но я хочу преобразовать изображение в сером масштабе в альфа-изображение (как это делает обычная маскировка) и применить его к UIView. – subchap

6

Для приложений, ориентированных на iOS 8.0+, это сработало (в данном случае, используя градиент в качестве маски). Это позволяет избежать необходимости изменять размер или положение маски.

// Add gradient mask to view 
func AddGradientMask(targetView: UIView) 
{ 
    let gradientMask = CAGradientLayer() 

    gradientMask.frame = targetView.bounds 
    gradientMask.colors = [UIColor.blackColor().CGColor, UIColor.clearColor().CGColor] 
    gradientMask.locations = [0.8, 1.0] 

    let maskView: UIView = UIView() 
    maskView.layer.addSublayer(gradientMask) 

    targetView.maskView = maskView 
} 

В моем случае, я хочу удалить маску, как только пользователь начнет прокрутку. Это делается с помощью:

func scrollViewWillBeginDragging(scrollView: UIScrollView) { 

    exerDetailsTableView.maskView = nil   
} 

где вид определяется как @IBOutlet:

@IBOutlet weak var exerDetailsTableView: UITableView! 

Результат:

example screenshot

Смежные вопросы