Помогите раскрасить слой, определяемый маской / границами изображения и накладывая изображение сверху - PullRequest
1 голос
/ 06 августа 2011

В настоящее время я экспериментирую с приложением iOS для создания аватара для клиента, где в какой-то момент у пользователя должна быть возможность изменить цвет элемента.

Клиент предоставляет элементы галереи для раскрашивания в формате .png с различными значениями альфа / непрозрачности, как обычно, для эффективного получения оттенков. Правильный конечный результат окраски элемента, однако, заключается не в маскировании изображения и применении сочетания цветов, поскольку прозрачные области остаются как есть, а скорее в «заполнении» фоновой области, заключенной в «внешний штрих» элемента, а затем перерисовывает изображение поверх так, чтобы оттенки накладывались на новый цвет.

Вот чего я достиг:

UIImage *image =  item.image;
UIGraphicsBeginImageContext(image.size);

CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetInterpolationQuality(context, kCGInterpolationHigh);

CGRect area = CGRectMake(0, 0, image.size.width, image.size.height);

CGContextScaleCTM(context, 1, -1);
CGContextTranslateCTM(context, 0, -area.size.height);

CGContextSaveGState(context);

// This applies the colorization only on the image mask 
//CGContextClipToMask(context, area, image.CGImage);

[[UIColor redColor] set];
CGContextFillRect(context, area);

CGContextRestoreGState(context);

CGContextSetBlendMode(context, kCGBlendModeNormal);

CGContextDrawImage(context, area, image.CGImage);

UIImage *coloredImg = UIGraphicsGetImageFromCurrentImageContext();

UIGraphicsEndImageContext();

item.image = coloredImg;

, который дает следующий результат.

http://dl.dropbox.com/u/1237004/Screen%20shot%202011-07-15%20at%207.53.50%20%CE%BC.%CE%BC..png

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

Так как можно устранить эту часть? Я думал о том, чтобы, возможно, уменьшить значение альфа до области, НЕ определяемой маской изображения, или что-то подобное, но не смог приблизиться к решению.

Спасибо всем за ваши предложения.

ПРИМЕЧАНИЕ: элемент, показанный на скриншоте, является частью приложения создания аватара WeeMee, не используется в нашем приложении, а скорее является частью моих экспериментов, и все права принадлежат его соответствующим владельцам

1 Ответ

0 голосов
/ 06 августа 2011

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

Смотрите этот урок: учебник

Обновлено в ответ на комментарии:

Маскировка изображения

...