선형 그라디언트가 적용된 Chrome 텍스트 효과가 들쭉날쭉 한 가장자리를 나타냄

Question

핵심 그래픽에서 크롬 텍스트 효과를 생성하려고하는데 제대로 보이게하는 데 어려움을 겪고 있습니다. 당신은 그라데이션 가장자리를 볼 수 있듯이

는

상당히입니다 :

이 나는 ​​그럭저럭 한 것입니다 :

이

내가 달성하기 위해 애 쓰고 효과 들쭉날쭉 한. 텍스쳐 채우기를위한 정적 png에 의지하지 않고이 효과를 얻을 수있는 방법이 있습니까? lefteris에 의해 제안을

- (void)setGradientFill:(UILabel*)label 
{ 
    CGSize textSize = [label.text sizeWithFont:label.font]; 
    CGFloat width = textSize.width;   // max 1024 due to Core Graphics limitations 
    CGFloat height = textSize.height;  // max 1024 due to Core Graphics limitations 

    // create a new bitmap image context 
    UIGraphicsBeginImageContextWithOptions(CGSizeMake(width, height), YES, 0.0); 

    // get context 
    CGContextRef context = UIGraphicsGetCurrentContext(); 
    CGContextSetAllowsAntialiasing(context, true); 
    CGContextSetShouldAntialias(context, true); 

    // push context to make it current (need to do this manually because we are not drawing in a UIView) 
    UIGraphicsPushContext(context); 

    CGContextSetAllowsAntialiasing(context, YES); 
    CGContextSetShouldAntialias(context, YES); 

    //draw gradient 
    CGGradientRef glossGradient; 
    CGColorSpaceRef rgbColorspace; 
    size_t num_locations = 5; 
    CGFloat locations[5] = { 0.0, 0.5, 0.5, 0.65, 1}; 
    CGFloat components[20] = { 
     1.0, 1.0, 1.0, 1.0, 
     1.0, 1.0, 1.0, 1.0, 
     0.878, 0.878, 0.878, 0.878, 
     0.78, 0.78, 0.78, 1.0, 
     1, 1, 1, 1.0 
    }; 
    rgbColorspace = CGColorSpaceCreateDeviceRGB(); 
    glossGradient = CGGradientCreateWithColorComponents(rgbColorspace, components, locations, num_locations); 
    CGPoint start = CGPointMake(0, 0); 
    CGPoint end = CGPointMake(width/4, height*1.2); 
    CGContextDrawLinearGradient(context, glossGradient, start, end, kCGGradientDrawsAfterEndLocation); 

    CGGradientRelease(glossGradient); 
    CGColorSpaceRelease(rgbColorspace); 

    // pop context 
    UIGraphicsPopContext(); 

    // get a UIImage from the image context 
    UIImage *gradientImage = UIGraphicsGetImageFromCurrentImageContext(); 

    // clean up drawing environment 
    UIGraphicsEndImageContext(); 

    label.textColor = [UIColor colorWithPatternImage:gradientImage]; 
} 

편집 :

내가 (아래 왼쪽 이미지) 당신이 만든 확장을 시도

이는 내 코드입니다. 어떤 이유로 가장자리 주위에 인공물이있는 매우 흐린 텍스트가 나타납니다.

_test.frame = CGRectMake(_test.frame.origin.x, _test.frame.origin.y, image.size.width, image.size.height); 
_test.image = image; 

편집 가장 가까운 솔루션 : lefteris에 의해

솔루션, 당신이 할 수있는 가장 가까운 '

나는 스트레칭 컨텐츠를 피하기 위해 이미지에있는 UIImage 프레임 크기를 조정하고 그래도 지루한 그라디언트 가장자리를 피할 수는 없습니다. 만약 텍스쳐에 Photoshop에서 생성 된 정적 PNG를 사용할 수는 있지만 텍스쳐는 크기에 따라 적용되므로 각 화면에 올바른 효과를 얻기 위해서는 여러 가지 버전이 필요할 수 있습니다. 포함 된 텍스트가 아닌 프레임의 그것을 동적으로하는 것은 가능하지만 제한적입니다.

Answer 1

그라디언트도 부드럽게 처리해야합니다.

사용이 대신 :

CGFloat locations[5] = { 0.0, 0.45, 0.55, 0.65, 1}; 

나는 다른 솔루션/제안 제공하기 위해 내 대답을 편집 : 나는 3D 텍스트를 렌더링있는 UIImage 확장 렌더링 3D 텍스트를 생성 한

을 which can be found here

해당 카테고리 확장 프로그램을 사용하여 약간의 수정 작업을 통해이 이미지가 완성되었습니다.

그라데이션을 배경색으로 만들어서 레이블 전체에 적용해서는 안되며 배경 위에 그래디언트가 추가되어 현실감이 떨어집니다.

나는 이러한 설정으로, 위의 이미지를 만들어 :

UIImage *my3dImage = [UIImage create3DImageWithText:@"61" Font:[UIFont fontWithName:@"Helvetica-Bold" size:180] ForegroundColor:[UIColor colorWithRed:(255/255.f) green:(255/255.f) blue:(255/255.f) alpha:1.0] ShadowColor:[UIColor blackColor] outlineColor:[UIColor lightGrayColor] depth:4 useShine:YES]; 

그리고 다른 광택 효과를 적용 할 내 소스 코드를 수정 :

size_t num_locations = 5; 
    CGFloat locations[5] = { 0.0, 0.49, 0.51, 0.65, 1}; 
    CGFloat gradientComponents[20] = { 
     1.0, 1.0, 1.0, 1.0, 
     1.0, 1.0, 1.0, 1.0, 
     0.878, 0.878, 0.878, 0.878, 
     0.78, 0.78, 0.78, 1.0, 
     1, 1, 1, 1.0 
    }; 

    CGGradientRef glossGradient = CGGradientCreateWithColorComponents(genericRGBColorspace, gradientComponents, locations, num_locations); 
    CGPoint start = CGPointMake(0, expectedSize.height/4); 
    CGPoint end = CGPointMake(expectedSize.width/4, expectedSize.height); 

이유는, 저는 믿습니다 내 접근 방식은 더 나은를 이는 실제로 텍스트에서 마스크를 생성하고 그라디언트를 적용하기 때문입니다. 즉, 텍스트 만 그라디언트가 아니라 배경이됩니다.

Answer 2

the UIGraphicsBeginImageContextWithOptions function을 사용하고 축척 인수는 0.0으로 설정하십시오.

UIGraphicsBeginImageContext 함수 1.0 무조건도 망막 (@ 배) 장치 설정을 스케일 인수로 해당 함수를 호출한다. 망막 장치에 2.0이 필요합니다. 0.0은 자동으로 올바른 배율 인수를 감지하여 사용합니다.