1

I know similar question(s) have been asked before, but most answers say create a new detail disclosure button image with the required color (e.g. How to change color of detail disclosure button for table cell).

I want to be able to change it to any color I choose, dynamically, at run-time, so using a pre-configured image is not viable.

From reading around, I think there may be a few ways to do this, but I'm not sure which is the best, or exactly how to do it:

  1. Draw the required color circle in code and overlay with an image of shadow round outside of circle and arrow right (with clear alpha channel for rest, so drawn color circle is still visible)

  2. Add image of shadow round outside of circle in UIImageView, and using as a mask, flood fill within this shadow circle, then overlay the arrow.

  3. Add greyscale image, mask it with itself, and overlay the required color (e.g. http://coffeeshopped.com/2010/09/iphone-how-to-dynamically-color-a-uiimage), then overlay that with arrow image.

What is the best way, and does anyone have any code showing exactly how to do it ?

4

2 回答 2

2

我使用以下辅助方法为灰度图像着色。它采用灰度图像、色调颜色和用于确保色调仅发生在灰度图像的一部分中的选项遮罩图像。此方法还确保新图像具有与原始图像相同（如果有）可调整大小的插图。

+ (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;
}

这是非视网膜灰度细节披露图像： 在此处输入图像描述

这是视网膜版本： 在此处输入图像描述

这是非视网膜面具（在引号之间 - 它大部分是白色的）：“ 在此处输入图像描述”

和视网膜面具（引号之间：“ 在此处输入图像描述”

于 2013-05-22T20:34:46.547 回答
0

还可以考虑在标签中使用图标字体而不是图像。像glyphicons 之类的东西。然后您可以将文本颜色设置为您想要的任何颜色。您也有很好的缩放选项。代价是您在某些情况下没有如此精确的控制，但它应该适合您的情况。

于 2013-05-22T16:33:47.740 回答