색상 색조 UIButton 이미지
흰색이나 검은 색을 UIImage
넣을 UISegmentedControl
때 세그먼트 컨트롤의 색조와 일치하도록 자동으로 컬러 마스크됩니다. 나는 이것이 정말로 시원하다고 생각했고, 내가 다른 곳에서도 이것을 할 수 있는지 궁금했다. 예를 들어 모양이 균일하지만 색상이 다양한 버튼이 많이 있습니다. 각 버튼에 PNG를 만드는 대신이 색상 마스킹을 사용하여 모든 이미지에 동일한 이미지를 사용할 수 있지만 색조 색상이나 실제 색상을 변경하기 위해 무언가를 설정할 수 있습니까?
iOS 7부터는 UIImage
렌더링 모드를 지정 하는 새로운 방법이 있습니다. 렌더링 모드 UIImageRenderingModeAlwaysTemplate
를 사용하면 버튼의 색조 색상으로 이미지 색상을 제어 할 수 있습니다.
목표 -C
UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
UIImage *image = [[UIImage imageNamed:@"image_name"] imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
[button setImage:image forState:UIControlStateNormal];
button.tintColor = [UIColor redColor];
빠른
let button = UIButton(type: .custom)
let image = UIImage(named: "image_name")?.withRenderingMode(.alwaysTemplate)
button.setImage(image, for: .normal)
button.tintColor = UIColor.red
Ric이 이미 그의 게시물 에서 언급했듯이 코드에서 렌더링 모드를 설정할 수 있으며 이미지 카탈로그에서 직접이를 수행 할 수도 있습니다 (아래 첨부 된 이미지 참조). 그냥 설정 Render As
에Template Image
주의 사항 iOS 7 및이 방법에 문제가 있습니다. 따라서 iOS 7을 사용하는 경우 여기에 설명 된대로 코드에서 확실하게 수행 할 수 있습니다 .
사용자 정의 버튼 은 해당 이미지 색상으로 나타납니다. 스토리 보드 (또는 UIButtonTypeSystem
코드)에서 버튼 유형을 "시스템"으로 설정하면 버튼 의 이미지가 기본 색조 색상으로 렌더링됩니다.
(iOS9, Xcode 7.3에서 테스트)
당신은에 이미지 렌더링 모드를 설정해야합니다 UIImageRenderingModeAlwaysTemplate
(가) 가지고하기 위해 tintColor
있는 UIImage에 영향을 미칩니다. Swift의 솔루션은 다음과 같습니다.
let image = UIImage(named: "image-name")
let button = UIButton()
button.setImage(image?.imageWithRenderingMode(UIImageRenderingMode.AlwaysTemplate), forState: .Normal)
button.tintColor = UIColor.whiteColor()
빠른 4x
button.setImage(image.withRenderingMode(UIImage.RenderingMode.alwaysTemplate), for: .normal)
button.tintColor = UIColor.blue
배경 이미지가있는 사용자 지정 단추가있는 경우 단추의 색조 색상을 설정하고 다음과 같이 이미지를 재정의 할 수 있습니다.
자산에서 색조 색상을 설정하려는 버튼 배경을 선택하십시오.
이미지의 속성 관리자에서 값을 "템플릿 이미지"로 설정합니다.
이제 설정 button.tintColor = UIColor.red
할 때마다 버튼이 빨간색으로 표시됩니다.
Swift에서는 다음과 같이 할 수 있습니다.
var exampleImage = UIImage(named: "ExampleImage.png")?.imageWithRenderingMode(.AlwaysTemplate)
그런 다음 viewDidLoad에서
exampleButtonOutlet.setImage(exampleImage, forState: UIControlState.Normal)
그리고 색상을 수정하려면
exampleButtonOutlet.tintColor = UIColor(red: 1, green: 0, blue: 0, alpha: 1) //your color
Xcode 8 편집 이제 .xcassets에서 이미지의 렌더링 모드를 템플릿 이미지로 렌더링 할 수 있으며 var exampleImage
더 이상 이미지를 구체적으로 선언 할 필요가 없습니다.
정확히 원하는 것이 확실하지 않지만이 카테고리 메소드는 지정된 색상으로 UIImage를 마스킹하여 단일 이미지를 가지고 원하는 색상을 변경할 수 있습니다.
ImageUtils.h
- (UIImage *) maskWithColor:(UIColor *)color;
ImageUtils.m
-(UIImage *) maskWithColor:(UIColor *)color
{
CGImageRef maskImage = self.CGImage;
CGFloat width = self.size.width;
CGFloat height = self.size.height;
CGRect bounds = CGRectMake(0,0,width,height);
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGContextRef bitmapContext = CGBitmapContextCreate(NULL, width, height, 8, 0, colorSpace, kCGImageAlphaPremultipliedLast);
CGContextClipToMask(bitmapContext, bounds, maskImage);
CGContextSetFillColorWithColor(bitmapContext, color.CGColor);
CGContextFillRect(bitmapContext, bounds);
CGImageRef cImage = CGBitmapContextCreateImage(bitmapContext);
UIImage *coloredImage = [UIImage imageWithCGImage:cImage];
CGContextRelease(bitmapContext);
CGColorSpaceRelease(colorSpace);
CGImageRelease(cImage);
return coloredImage;
}
ImageUtils 카테고리를 가져 와서 이와 같은 작업을 수행하십시오.
#import "ImageUtils.h"
...
UIImage *icon = [UIImage imageNamed:ICON_IMAGE];
UIImage *redIcon = [icon maskWithColor:UIColor.redColor];
UIImage *blueIcon = [icon maskWithColor:UIColor.blueColor];
customType이있는 스위프트 4 :
let button = UIButton(frame: aRectHere)
let buttonImage = UIImage(named: "imageName")
button.setImage(buttonImage?.withRenderingMode(.alwaysTemplate), for: .normal)
button.tintColor = .white
Xamarin.iOS (C #)의 경우 :
UIButton messagesButton = new UIButton(UIButtonType.Custom);
UIImage icon = UIImage.FromBundle("Images/icon.png");
messagesButton.SetImage(icon.ImageWithRenderingMode(UIImageRenderingMode.AlwaysTemplate), UIControlState.Normal);
messagesButton.TintColor = UIColor.White;
messagesButton.Frame = new RectangleF(0, 0, 25, 25);
스위프트 3 :
이 솔루션은 xCode 인터페이스 빌더를 통해 이미 이미지를 설정 한 경우 편안 할 수 있습니다. 기본적으로 이미지를 채색하는 확장명이 하나 있습니다.
extension UIImage {
public func image(withTintColor color: UIColor) -> UIImage{
UIGraphicsBeginImageContextWithOptions(self.size, false, self.scale)
let context: CGContext = UIGraphicsGetCurrentContext()!
context.translateBy(x: 0, y: self.size.height)
context.scaleBy(x: 1.0, y: -1.0)
context.setBlendMode(CGBlendMode.normal)
let rect: CGRect = CGRect(x: 0, y: 0, width: self.size.width, height: self.size.height)
context.clip(to: rect, mask: self.cgImage!)
color.setFill()
context.fill(rect)
let newImage: UIImage = UIGraphicsGetImageFromCurrentImageContext()!
UIGraphicsEndImageContext()
return newImage
}
}
그런 다음이 UIButton 확장을 준비 하여 특정 상태의 이미지를 채색 할 수 있습니다 .
extension UIButton {
func imageWith(color:UIColor, for: UIControlState) {
if let imageForState = self.image(for: state) {
self.image(for: .normal)?.withRenderingMode(.alwaysTemplate)
let colorizedImage = imageForState.image(withTintColor: color)
self.setImage(colorizedImage, for: state)
}
}
}
용법:
myButton.imageWith(.red, for: .normal)
추신 (테이블 셀에서도 잘 작동하며 setNeedDisplay()
메서드 를 호출 할 필요가 없으며 UIImage 확장 으로 인해 색상 변경이 즉시 발생합니다 ..
이미지를 수동으로 마스킹하려면 망막 화면에서 작동하는 업데이트 된 코드가 있습니다.
- (UIImage *)maskWithColor:(UIColor *)color
{
CGImageRef maskImage = self.CGImage;
CGFloat width = self.size.width * self.scale;
CGFloat height = self.size.height * self.scale;
CGRect bounds = CGRectMake(0,0,width,height);
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGContextRef bitmapContext = CGBitmapContextCreate(NULL, width, height, 8, 0, colorSpace, kCGBitmapAlphaInfoMask & kCGImageAlphaPremultipliedLast);
CGContextClipToMask(bitmapContext, bounds, maskImage);
CGContextSetFillColorWithColor(bitmapContext, color.CGColor);
CGContextFillRect(bitmapContext, bounds);
CGImageRef cImage = CGBitmapContextCreateImage(bitmapContext);
UIImage *coloredImage = [UIImage imageWithCGImage:cImage scale:self.scale orientation:self.imageOrientation];
CGContextRelease(bitmapContext);
CGColorSpaceRelease(colorSpace);
CGImageRelease(cImage);
return coloredImage;
}
당신은 시도해야
프레임 설정 후
NSArray *arr10 =[NSArray arrayWithObjects:btn1,btn2,nil];
for(UIButton *btn10 in arr10)
{
CAGradientLayer *btnGradient2 = [CAGradientLayer layer];
btnGradient2.frame = btn10.bounds;
btnGradient2.colors = [NSArray arrayWithObjects:
(id)[[UIColor colorWithRed:151.0/255.0f green:206.0/255.5 blue:99.0/255.0 alpha:1] CGColor],
(id)[[UIColor colorWithRed:126.0/255.0f green:192.0/255.5 blue:65.0/255.0 alpha:1]CGColor],
nil];
[btn10.layer insertSublayer:btnGradient2 atIndex:0];
}
스위프트 3.0
let image = UIImage(named:"NoConnection")!
warningButton = UIButton(type: .system)
warningButton.setImage(image, for: .normal)
warningButton.tintColor = UIColor.lightText
warningButton.frame = CGRect(origin: CGPoint(x:-100,y:0), size: CGSize(width: 59, height: 56))
self.addSubview(warningButton)
단추 이미지 또는 이미지보기 색조 색상 변경
btn.imageView?.image = btn.imageView?.image?.withRenderingMode(.alwaysTemplate)
btn.imageView?.tintColor = #colorLiteral(red: 0, green: 0, blue: 0, alpha: 1)
클릭 후 색조가 지워졌 기 때문에 위의 어느 것도 나를 위해 일하지 않았습니다. 나는 사용해야했다
button.setImageTintColor(Palette.darkGray(), for: UIControlState())
참고 URL : https://stackoverflow.com/questions/19829356/color-tint-uibutton-image
'development' 카테고리의 다른 글
팝업 창을 화면 중앙에 배치 하시겠습니까? (0) | 2020.03.31 |
---|---|
채색 된 루비 출력 (0) | 2020.03.31 |
tensorflow의 tf.nn.max_pool에서 'SAME'과 'VALID'패딩의 차이점은 무엇입니까? (0) | 2020.03.31 |
노드 0.12에`node-sass`를 다시 설치 하시겠습니까? (0) | 2020.03.31 |
Blob URL은 무엇이며 왜 사용됩니까? (0) | 2020.03.31 |