0

CoreGraphics を使用して特定のグラデーションを描画するのを手伝ってくれる人はいますか? 手がかりを与えるだけで十分です。私の最も深い敬意を払うサンプルコード。私はこの形が必要です:

ここに画像の説明を入力

次のコードを試しました:

-(UIImage *)imageWithGradientBorder
{
    CGRect rect=CGRectMake(0, 0, self.size.width, self.size.height);
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceGray();
    CGContextRef ctx= CGBitmapContextCreate(NULL, rect.size.width, rect.size.height, 8, rect.size.width, colorSpace, kCGImageAlphaNone);
    CGGradientRef glossGradient;
    size_t num_locations = 4;
    CGFloat locations[4] = { 0.0, 0.1, 0.9, 1.0 };
    CGFloat components[16] = { 0, 0, 0, 1, 1.0, 1.0, 1.0, 1, 1.0, 1.0, 1.0, 1, 0, 0, 0, 1};
    glossGradient = CGGradientCreateWithColorComponents(colorSpace, components, locations, num_locations);
    CGRect currentBounds = rect;

    CGPoint topCenter = CGPointMake(CGRectGetMidX(currentBounds), 0.0f);
    CGPoint midCenter = CGPointMake(CGRectGetMidX(currentBounds), CGRectGetMaxY(currentBounds));
    topCenter = CGPointMake( 0.0f, CGRectGetMidY(currentBounds));
    midCenter = CGPointMake(CGRectGetMaxX(currentBounds), CGRectGetMidY(currentBounds));

    CGContextDrawLinearGradient(ctx, glossGradient, topCenter, midCenter, 0);
    CGImageRef mask = CGBitmapContextCreateImage(ctx);
    CGContextRelease(ctx);
    CGImageRef maskedImageRef = CGImageCreateWithMask([self CGImage], mask);
    CGImageRelease(mask);
    UIImage *maskedImage = [UIImage imageWithCGImage:maskedImageRef];
    CGImageRelease(maskedImageRef);
    return maskedImage;
}

ただし、グラデーションは左側からのみ描画します。

4

4 に答える 4

1
topCenter = CGPointMake( 0.0f, CGRectGetMidY(currentBounds));
midCenter = CGPointMake(CGRectGetMaxX(currentBounds), CGRectGetMidY(currentBounds));

These 2 variables have misleading names, they aren't really top center and mid centre, they are mid left and mid right. So when you call:

CGContextDrawLinearGradient(ctx, glossGradient, topCenter, midCenter, 0);

You are drawing the gradient from left to right.

What you need to do it to organise your points and draw the gradient 4 times (L->R, R->L, T->B, B->T). Depending on what you want to corners to look like exactly you may need to do some masking in between each gradient drawing to prevent the gradient from drawing all the way into the corner.

于 2013-09-20T14:50:37.720 に答える
0

元の質問には他の回答の方が適していますが、CoreGraphics で描画する必要がない場合は、アセット カタログを使用した画像のスライスを検討することをお勧めします。グラフィックス プログラムでグラデーションとコーナーを作成し、Xcode でサイズ変更可能にすることができます。 https://developer.apple.com/library/ios/recipes/xcode_help-image_catalog-1.0/chapters/SlicinganImage.html

于 2016-05-06T03:02:28.140 に答える
0

OK、1 つの回避策を作成しました。

CGContextRef currentContext = UIGraphicsGetCurrentContext();
CGContextRef context = currentContext;
CGContextSaveGState(currentContext);
CGFloat colStep = 255 / borderWidth / 10;
colStep = colStep / 255;
for (int i = 0; i < floor(borderWidth * 10); i++) {
    CGContextSetFillColorWithColor(context, [UIColor colorWithWhite:colStep*i alpha:1].CGColor);
    CGFloat delta = i / 10;
    CGRect rectToDraw = CGRectMake(delta,delta,rect.size.width - delta * 2,rect.size.height - delta * 2);
    CGContextFillRect(context, rectToDraw);
}


CGContextRestoreGState(currentContext);
于 2013-09-21T19:19:42.307 に答える