Динамически изменяйте цвет кнопки раскрытия информации в коде

Я знаю, что аналогичные вопросы заданы раньше, но большинство ответов говорят о создании нового изображения кнопки раскрытия детали с требуемым цветом (например, How to change color of detail disclosure button for table cell).Динамически изменяйте цвет кнопки раскрытия информации в коде

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

От чтения вокруг, я думаю, что там может быть несколько способов сделать это, но я не уверен, что является лучшим, или точно, как это сделать:

Нарисуйте нужный цветовой круг в коде и наложения с изображением тени вокруг внешней окружности и стрелки вправо (с четким альфа-каналом для отдыха, поэтому рисованная цветовая окружность все еще видна)
Добавить изображение тени вокруг за пределами круга в UIImageView и используя как маска, заливка заливается в этот теневой круг, затем накладывается стрелка.
Добавить изображение в оттенках серого, замаскировать его с собой и наложить требуемый цвет (например, http://coffeeshopped.com/2010/09/iphone-how-to-dynamically-color-a-uiimage), затем наложить его на изображение со стрелкой.

Каков наилучший способ, и есть ли у кого-нибудь какой-либо код, показывающий, как это сделать?

источник

2013-05-22 DarkMatter

Я использую вариант 3 в своем приложении. Хорошо работает. – rmaddy

@rmaddy - Любой шанс опубликовать изображение оттенка серого с помощью кнопки раскрытия подробностей без стрелки (как по возможности, так и с сетчаткой и сетчатой версией)? – DarkMatter

ОК, см. Мой ответ. – rmaddy

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

+ (UIImage *)tintImage:(UIImage *)baseImage withColor:(UIColor *)color mask:(UIImage *)maskImage { 
    UIGraphicsBeginImageContextWithOptions(baseImage.size, NO, baseImage.scale); 

    CGContextRef ctx = UIGraphicsGetCurrentContext(); 
    CGRect area = CGRectMake(0, 0, baseImage.size.width, baseImage.size.height); 

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

    CGContextSaveGState(ctx); 
    if (maskImage) { 
     CGContextClipToMask(ctx, area, maskImage.CGImage); 
    } else { 
     CGContextClipToMask(ctx, area, baseImage.CGImage); 
    } 

    [color set]; 
    CGContextFillRect(ctx, area); 
    CGContextRestoreGState(ctx); 

    CGContextSetBlendMode(ctx, kCGBlendModeOverlay); 

    CGContextDrawImage(ctx, area, baseImage.CGImage); 

    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext(); 

    UIGraphicsEndImageContext(); 

    if (!UIEdgeInsetsEqualToEdgeInsets(baseImage.capInsets, UIEdgeInsetsZero)) { 
     newImage = [newImage resizableImageWithCapInsets:baseImage.capInsets]; 
    } 

    return newImage; 
}

Вот не-сетчатка раскрытие полутоновой детали изображения: enter image description here

Вот версия сетчатка: enter image description here

Вот не-сетчатка маски (между кавычками - это в основном белый): " enter image description here "

И сетчатая маска (между котировками: " enter image description here "

источник

2013-05-22 20:34:46 rmaddy

Большое спасибо @rmaddy. Ты легенда! Я знаю, что я специально не задавал это в своем вопросе, но я планировал накладывать изображение стрелки, поэтому я мог бы также использовать его для создания подобной динамически цветной кнопки с галочкой, один с крестом и третий без стрелки/тика/креста (т. е. только цветное круговое изображение с белой рамкой). Не думайте, что у вас есть похожие изображения/маски с клещей, а также с крестом и простой? Я просто собираюсь проверить ваш код, и если все работает так, как ожидалось, я отмечу это как ответ. – DarkMatter

Хотя ваше решение работает для окраски изображения, есть пара косметических проблем: 1) Он теряет дугу выделения в верхней половине изображения, чтобы цвет выглядел сплошным. 2) После оттенка часть, в которой новый цвет соответствует внутренней границе слева, справа и внизу, выглядит не так хорошо, как исходное изображение в оттенках серого. – DarkMatter

Для вопроса (1) подсветка не теряется со всеми цветами, только некоторые. Для (2) это могут быть только мои глаза, но это не выглядит так же хорошо со всеми цветами. Отмечая это как ответ, хотя это не идеально, для меня это достаточно хорошо. Я думаю, что немного лучшее решение, которое держит подсветку со всеми цветами, это нарисовать сплошной цвет для круга и использовать оверлейные изображения для окружающей границы, выделения и символа (т. Е. Шеврон/стрелка, галочка, крест и т. Д.) – DarkMatter

Рассмотрите также использование шрифта значка на этикетке вместо изображения. Что-то вроде glyphicons. Затем вы можете установить цвет текста так, как хотите. У вас также есть хорошие возможности для масштабирования. Стоимость заключается в том, что в некоторых случаях у вас нет такого точного контроля, но он должен хорошо работать для вашего дела.

источник

2013-05-22 16:33:47 Wain

Динамически изменяйте цвет кнопки раскрытия информации в коде

ответ

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