sourcetip

UIView 및 iPhone UILabel의 그라데이션

fileupload 2023. 4. 18. 23:15
반응형

UIView 및 iPhone UILabel의 그라데이션

중복 가능성:
iPhone 앱에서 수동으로 그라데이션 그리기?

어플리케이션에서는 다음 중 하나로 텍스트를 표시해야 합니다.UIView또는UILabel하지만 배경은 진실과 반대되는 구배여야 한다.UIColor그래픽 프로그램을 사용하여 원하는 모양을 만드는 것은 서버에서 반환되는 데이터에 따라 텍스트가 다를 수 있으므로 좋지 않습니다.

이 문제를 해결할 가장 빠른 방법을 아는 사람이 있나요?당신의 의견에 대단히 감사합니다.

오래된 스레드인 것은 알지만, 나중에 참조할 수 있도록:

iPhone SDK 3.0 에서는, 새로운 기능을 사용해 서브 클래스나 이미지를 사용하지 않고, 커스텀 그라데이션(Gradiation)을 매우 간단하게 실장할 수 있습니다.CAGradientLayer:

 UIView *view = [[[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 100)] autorelease];
 CAGradientLayer *gradient = [CAGradientLayer layer];
 gradient.frame = view.bounds;
 gradient.colors = [NSArray arrayWithObjects:(id)[[UIColor blackColor] CGColor], (id)[[UIColor whiteColor] CGColor], nil];
 [view.layer insertSublayer:gradient atIndex:0];

CAGradientLayer 문서를 확인합니다.선택적으로 시작점과 끝점(위에서 아래로 직진하는 선형 그라데이션이 필요하지 않은 경우) 또는 각 색상에 매핑되는 특정 위치를 지정할 수 있습니다.

Mike의 응답에 나타난 바와 같이 코어 그래픽스를 사용하여 그라데이션 그림을 그릴 수 있습니다.보다 자세한 예로서,UIView의 배경으로 사용하는 서브 클래스UILabel그 안에UIView서브클래스, 덮어쓰기drawRect:method 및 코드 삽입은 다음과 같습니다.

- (void)drawRect:(CGRect)rect 
{
    CGContextRef currentContext = UIGraphicsGetCurrentContext();

    CGGradientRef glossGradient;
    CGColorSpaceRef rgbColorspace;
    size_t num_locations = 2;
    CGFloat locations[2] = { 0.0, 1.0 };
    CGFloat components[8] = { 1.0, 1.0, 1.0, 0.35,  // Start color
         1.0, 1.0, 1.0, 0.06 }; // End color

    rgbColorspace = CGColorSpaceCreateDeviceRGB();
    glossGradient = CGGradientCreateWithColorComponents(rgbColorspace, components, locations, num_locations);

    CGRect currentBounds = self.bounds;
    CGPoint topCenter = CGPointMake(CGRectGetMidX(currentBounds), 0.0f);
    CGPoint midCenter = CGPointMake(CGRectGetMidX(currentBounds), CGRectGetMidY(currentBounds));
    CGContextDrawLinearGradient(currentContext, glossGradient, topCenter, midCenter, 0);

    CGGradientRelease(glossGradient);
    CGColorSpaceRelease(rgbColorspace); 
}

이 특정 예에서는 흰색 광택 스타일의 그라데이션이 작성되어 있습니다.이 그라데이션의 상단에서 그려집니다.UIView수직 중앙으로 이동합니다.를 설정할 수 있습니다.UIViewbackgroundColor그 위에 이 광택이 그려질 거예요.또한 다음과 같은 방법으로 반경 구배를 그릴 수 있습니다.CGContextDrawRadialGradient기능.

이거 크기만 맞추면 돼요UIView적절히 추가해 주세요.UILabel원하는 효과를 얻기 위해 서브뷰로 사용할 수 있습니다.

편집(2009년 4월 23일):St3fan의 제안에 따라 뷰의 프레임을 코드의 범위로 대체했습니다.이는 뷰의 원점이 (0,0)이 아닌 경우에 대해 수정됩니다.

주의: 다음 결과는 이전 버전의 iOS에 적용되지만 iOS 13에서 테스트하는 경우 스테핑은 수행되지 않습니다.어떤 버전의 iOS에서 스테핑이 제거되었는지 알 수 없습니다.


사용시CAGradientLayer와는 반대로CGGradient경사가 매끄럽지는 않지만 눈에 띄는 스텝이 있습니다.이 예:

더 인 결과를 '보다 낫다'를 사용하는 .CGGradient.

또한 그래픽 이미지를 1픽셀 폭으로 그라데이션으로 사용할 수 있으며, 보기 속성을 설정하여 보기를 채우도록 그래픽을 확장할 수 있습니다(방사형 그래픽이 아닌 단순한 선형 그라데이션이 고려된다고 가정).

커스텀 컬러를 사용하고 싶은 경우를 제외하고, Mirko Froehlich의 대답은 나에게 효과가 있었다.UI 색상을 RGB가 아닌 색상, 채도, 밝기로 지정하는 것이 요령이다.

CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.frame = myView.bounds;
UIColor *startColour = [UIColor colorWithHue:.580555 saturation:0.31 brightness:0.90 alpha:1.0];
UIColor *endColour = [UIColor colorWithHue:.58333 saturation:0.50 brightness:0.62 alpha:1.0];
gradient.colors = [NSArray arrayWithObjects:(id)[startColour CGColor], (id)[endColour CGColor], nil];
[myView.layer insertSublayer:gradient atIndex:0];

색상의 색상, 채도 및 밝기를 얻으려면 내장된 xcode 컬러 피커를 사용하여 HSB 탭으로 이동합니다.이 보기에서는 색조가 도 단위로 측정되므로 값을 360으로 나누면 코드에 입력할 값을 얻을 수 있습니다.

이것이 바로 xCode의 IB에서 UIButton을 투명/명료하게 설정하고 bg 이미지를 사용하지 않도록 설정한 것입니다.

UIColor *pinkDarkOp = [UIColor colorWithRed:0.9f green:0.53f blue:0.69f alpha:1.0];
UIColor *pinkLightOp = [UIColor colorWithRed:0.79f green:0.45f blue:0.57f alpha:1.0];

CAGradientLayer *gradient = [CAGradientLayer layer];
gradient.frame = [[shareWordButton layer] bounds];
gradient.cornerRadius = 7;
gradient.colors = [NSArray arrayWithObjects:
                   (id)pinkDarkOp.CGColor,
                   (id)pinkLightOp.CGColor,
                   nil];
gradient.locations = [NSArray arrayWithObjects:
                      [NSNumber numberWithFloat:0.0f],
                      [NSNumber numberWithFloat:0.7],
                      nil];

[[recordButton layer] insertSublayer:gradient atIndex:0];

저는 이것을 UIImageView라는 서브뷰를 가진 뷰에서 실현합니다.ImageView가 가리키는 이미지는 그라데이션입니다.그리고 나서 UIView에서 배경색을 설정해서 컬러 그라데이션 뷰가 됩니다.다음으로, 필요에 따라서 뷰를 사용합니다.그리고 그리는 모든 것이 이 그라데이션뷰 아래에 있습니다.ImageView 상단에 두 번째 뷰를 추가하면 도면이 그라데이션 아래인지 위인지 선택할 수 있습니다.

언급URL : https://stackoverflow.com/questions/422066/gradients-on-uiview-and-uilabels-on-iphone

반응형