iOS開發基礎110-Core Graphics應用場景

Mr.陳發表於2024-07-17
iOS

Core Graphics是一種強大的二維圖形繪製框架，廣泛應用於iOS開發中。以下是幾個常見的運用場景以及對應的程式碼示例：

1. 自定義檢視繪製

透過覆蓋UIView的drawRect:方法，可以自定義檢視的外觀。

示例程式碼：

#import <UIKit/UIKit.h>

@interface CustomView : UIView

@end

@implementation CustomView

- (void)drawRect:(CGRect)rect {
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    // Set fill color
    CGContextSetFillColorWithColor(context, [UIColor blueColor].CGColor);
    
    // Draw a filled rectangle
    CGContextFillRect(context, CGRectMake(20, 20, 100, 100));
    
    // Set stroke color
    CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);
    
    // Draw a circle
    CGContextStrokeEllipseInRect(context, CGRectMake(150, 20, 100, 100));
}

@end

2. 繪製影像

使用Core Graphics可以在檢視中繪製影像，並進行一些基本的影像處理操作。

示例程式碼：

#import <UIKit/UIKit.h>

@interface ImageView : UIView

@end

@implementation ImageView

- (void)drawRect:(CGRect)rect {
    CGContextRef context = UIGraphicsGetCurrentContext();
    UIImage *image = [UIImage imageNamed:@"example.png"];
    
    // Draw image in the center of the view
    CGRect imageRect = CGRectMake((self.bounds.size.width - image.size.width) / 2,
                                  (self.bounds.size.height - image.size.height) / 2,
                                  image.size.width,
                                  image.size.height);
    CGContextDrawImage(context, imageRect, image.CGImage);
}

@end

3. 繪製文字

使用Core Graphics可以自定義文字的繪製，包括設定字型、顏色、對齊方式等。

示例程式碼：

#import <UIKit/UIKit.h>

@interface TextView : UIView

@end

@implementation TextView

- (void)drawRect:(CGRect)rect {
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSetFillColorWithColor(context, [UIColor blackColor].CGColor);
    
    NSString *text = @"Hello, Core Graphics!";
    UIFont *font = [UIFont systemFontOfSize:24];
    NSDictionary *attributes = @{NSFontAttributeName: font, NSForegroundColorAttributeName: [UIColor blackColor]};
    
    CGSize textSize = [text sizeWithAttributes:attributes];
    CGRect textRect = CGRectMake((self.bounds.size.width - textSize.width) / 2,
                                 (self.bounds.size.height - textSize.height) / 2,
                                 textSize.width,
                                 textSize.height);
    [text drawInRect:textRect withAttributes:attributes];
}

@end

4. 繪製漸變

透過Core Graphics可以繪製線性或徑向漸變。

示例程式碼：

#import <UIKit/UIKit.h>

@interface GradientView : UIView

@end

@implementation GradientView

- (void)drawRect:(CGRect)rect {
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    
    NSArray *colors = @[(__bridge id)[UIColor redColor].CGColor,
                        (__bridge id)[UIColor blueColor].CGColor];
    
    CGFloat locations[] = { 0.0, 1.0 };
    CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef)colors, locations);
    
    CGPoint startPoint = CGPointMake(0, 0);
    CGPoint endPoint = CGPointMake(self.bounds.size.width, self.bounds.size.height);
    
    CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);
    
    CGGradientRelease(gradient);
    CGColorSpaceRelease(colorSpace);
}

@end

5. 繪製路徑

使用Core Graphics可以建立複雜路徑，包括直線、曲線等。

示例程式碼：

#import <UIKit/UIKit.h>

@interface PathView : UIView

@end

@implementation PathView

- (void)drawRect:(CGRect)rect {
    CGContextRef context = UIGraphicsGetCurrentContext();
    
    CGContextSetStrokeColorWithColor(context, [UIColor blackColor].CGColor);
    CGContextSetLineWidth(context, 2.0);
    
    CGContextMoveToPoint(context, 20, 20);
    CGContextAddLineToPoint(context, 200, 20);
    CGContextAddCurveToPoint(context, 200, 70, 50, 70, 50, 120);
    CGContextAddArc(context, 100, 100, 50, 0, M_PI, 0);
    
    CGContextStrokePath(context);
}

@end

相關文章