I've subclassed UILabel class to override drawRect: method. The label in IB is connected with the created subclass. It appears on the screen, but it doesn't show any text, whether it it is set in IB or programmatically. The label itself appears on the screen, when I'm logging it's text property, it shows OK.
Here's my code:
MyLabel.h
#import <UIKit/UIKit.h>
#interface MyLabel : UILabel
#end
MyLabel.m
#import "MyLabel.h"
#import <QuartzCore/QuartzCore.h>
#implementation MyLabel
- (void)drawRect:(CGRect)rect {
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGContextRef context = UIGraphicsGetCurrentContext();
UIColor *borderColor = [UIColor colorWithWhite: .1f alpha: 5.f];
UIColor *topColor = [UIColor colorWithWhite: .3f alpha: 5.f];
UIColor *bottomColor = [UIColor colorWithWhite: .5f alpha: 5.f];
UIColor *innerGlow = [UIColor colorWithWhite: 1.f alpha: .25f];
NSArray *gradientColors = #[(id)topColor.CGColor, (id)bottomColor.CGColor];
CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef) gradientColors, NULL);
CGFloat bWidth = self.frame.size.width;
CGFloat bHeight = self.frame.size.height;
UIBezierPath *roundedRectanglePath = [UIBezierPath bezierPathWithRoundedRect: CGRectMake(0, 0, bWidth, bHeight)
cornerRadius: 0];
[roundedRectanglePath addClip];
CGGradientRef background = gradient;
CGContextDrawLinearGradient(context, background, CGPointMake(bWidth / 2.f, 0), CGPointMake(bWidth / 2.f, bHeight), 0);
[borderColor setStroke];
roundedRectanglePath.lineWidth = 6;
[roundedRectanglePath stroke];
CGFloat glowRadius = 3.f;
UIBezierPath *innerGlowRect = [UIBezierPath bezierPathWithRoundedRect: CGRectMake(glowRadius, glowRadius, bWidth - 2 * glowRadius, bHeight - 2 * glowRadius) cornerRadius: 0];
[innerGlow setStroke];
innerGlowRect.lineWidth = 3;
[innerGlowRect stroke];
CGGradientRelease(gradient);
CGColorSpaceRelease(colorSpace);
}
#end
Maybe I need to override drawTextInRect: method, but I don't know how.
Thanks for help!
You need to call:
[super drawRect:rect];
At the top or your drawRect: method. If you need more control over how the string looks you'll need to draw it your self with the NSString string drawing methods.
Related
I have a customized UIView that rounds its corners by using layer.cornerRadius like this:
- (void)layoutSubviews
{
[super layoutSubviews];
self.layer.cornerRadius = self.frame.size.width / 2.0;
self.layer.borderColor = [UIColor whiteColor].CGColor;
self.layer.borderWidth = 2.0;
self.layer.masksToBounds = YES;
self.backgroundColor = [UIColor redColor];
}
How can I get rid of the very thin outer red circle?
Well, a more efficient way to do what you need would be to copy paste this function in the .m file of your custom view and call it in the drawRect method:
- (void)drawRoundedViewWithFrame: (CGRect)frame color:(UIColor *)color
{
//// roundCircle Drawing
UIBezierPath* roundCirclePath = [UIBezierPath bezierPathWithOvalInRect: frame];
[color setFill];
[roundCirclePath fill];
[UIColor.whiteColor setStroke];
roundCirclePath.lineWidth = 2;
[roundCirclePath stroke];
}
Based on an answer in here, I figured out a way to do this with these steps:
Set the UIView background color to [UIColor clearColor]
Manually draw a smaller circular background in drawRect:
Here's the drawRect: implementation:
- (void)drawRect:(CGRect)rect
{
CGFloat margin = _borderWidth;
CGRect background = CGRectMake(margin, margin,
self.bounds.size.width - 2 * margin,
self.bounds.size.height - 2 * margin);
CGContextRef context = UIGraphicsGetCurrentContext();
[_internalBackgroundColor set];
CGContextFillEllipseInRect(context, background);
}
And the overwritten backgroundColor setter:
#property (nonatomic, strong) UIColor *internalBackgroundColor;
...
- (void)setBackgroundColor:(UIColor *)backgroundColor
{
[super setBackgroundColor:[UIColor clearColor]];
_internalBackgroundColor = backgroundColor;
}
**** Faster solution: ****
As Kujey pointed out, it's better not to use the layer.cornerRadius at all. Here's the drawRect: solution without the layer access:
- (void)drawRect:(CGRect)rect
{
CGFloat margin = _borderWidth / 2.0;
CGRect background = CGRectMake(margin, margin, self.bounds.size.width - 2 * margin, self.bounds.size.height - 2 * margin);
CGContextRef context = UIGraphicsGetCurrentContext();
[_internalBackgroundColor set];
CGContextFillEllipseInRect(context, background);
[_borderColor set];
CGContextSetLineWidth(context, _borderWidth);
CGContextStrokeEllipseInRect(context, background);
}
I create the following View in code, the idea is to use it as an image in UITableViewCell and UITabBarItem:
- (void)drawRect:(CGRect)rect
{
// Fill the background with white
CGContextRef context = UIGraphicsGetCurrentContext();
UIColor * whiteColor = [UIColor colorWithRed:1.0
green:1.0
blue:1.0
alpha:1.0];
CGContextSetFillColorWithColor(context, whiteColor.CGColor);
CGContextFillRect(context, self.bounds);
//// Color Declarations
UIColor* fillColor = [UIColor colorWithRed: 1.0
green: 1.0
blue: 1.0
alpha: 1.0];
UIColor* strokeColor = [UIColor colorWithRed: 0.0
green: 0.0
blue: 0.0
alpha: 1.0];
//// Big Oval Drawing
CGRect bigOvalRect = CGRectMake(rect.origin.x+2,
rect.origin.y+5,
42.0,
42.0);
UIBezierPath* bigOvalPath = [UIBezierPath bezierPath];
[bigOvalPath addArcWithCenter: CGPointMake(CGRectGetMidX(bigOvalRect), CGRectGetMidY(bigOvalRect))
radius: CGRectGetWidth(bigOvalRect) / 2
startAngle: 40 * M_PI/180
endAngle: 320 * M_PI/180
clockwise: YES];
[fillColor setFill];
[bigOvalPath fill];
[strokeColor setStroke];
bigOvalPath.lineWidth = 1;
[bigOvalPath stroke];
}
To create an UIImage from this UIView I am using this code:
#import <QuartzCore/QuartzCore.h>
+ (UIImage *) imageWithView:(UIView *)view
{
UIGraphicsBeginImageContextWithOptions(view.bounds.size, view.opaque, 0.0);
[view.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage * img = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return img;
}
Everything works as expected when I use it in my UITableViewCells but when I set it as the image of my UITabBarItem I only see a blue rectangle (iOS7):
MyIcon *icon = [[MyIcon alloc] initWithFrame:CGRectMake(0.0, 0.0, 50.0, 50.0)];
UIImage *tabImage =[self imageWithView:icon];
self.navigationController.tabBarItem.image = tabImage;
I guess it is something related with the alpha of the image but how can I fix it?
It wasn't a problem related to the size of the view but to its alpha.
I fixed it by setting the backgroundColor (was whiteColor) and the fillColor to:
[UIColor clearColor]
and by setting the view as opaque in the initWithFrame: method:
[self setOpaque = NO];
I am an IOS beginner.
I am trying to show a custom button with code generated by paintcode.
I drag a View on Storyboard then set this generic view class to my custom view "GreenButton". When I run the app, the button does not show up. I added NSLogs and could see the drawRect method worked successfully.
The code generated by paintcode seems to include everything to draw the button. I just use XCode to resize my view.
Do I need to implement initWithFrame method at all?
//
// GreenButton.m
// Test
//
// Created by Tim on 13.04.2013.
// Copyright (c) 2013 Tim. All rights reserved.
//
#import "GreenButton.h"
#implementation GreenButton
- (id)initWithFrame:(CGRect)frame {
self = [super initWithFrame:frame];
if (self) {
// setup the initial properties of the view
}
return self;
}
#pragma mark - Touch event overrides
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect
{
NSLog(#"drawRect enter");
//// General Declarations
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
CGContextRef context = UIGraphicsGetCurrentContext();
//// Color Declarations
UIColor* strokeColor = [UIColor colorWithRed: 0.419 green: 0.434 blue: 0.455 alpha: 1];
UIColor* baseColor = [UIColor colorWithRed: 0.218 green: 0.24 blue: 0.268 alpha: 1];
CGFloat baseColorRGBA[4];
[baseColor getRed: &baseColorRGBA[0] green: &baseColorRGBA[1] blue: &baseColorRGBA[2] alpha: &baseColorRGBA[3]];
UIColor* upperColor = [UIColor colorWithRed: (baseColorRGBA[0] * 0.8 + 0.2) green: (baseColorRGBA[1] * 0.8 + 0.2) blue: (baseColorRGBA[2] * 0.8 + 0.2) alpha: (baseColorRGBA[3] * 0.8 + 0.2)];
UIColor* lowerColor = [UIColor colorWithRed: (baseColorRGBA[0] * 0.9) green: (baseColorRGBA[1] * 0.9) blue: (baseColorRGBA[2] * 0.9) alpha: (baseColorRGBA[3] * 0.9 + 0.1)];
UIColor* lightUpColor = [UIColor colorWithRed: (baseColorRGBA[0] * 0.5 + 0.5) green: (baseColorRGBA[1] * 0.5 + 0.5) blue: (baseColorRGBA[2] * 0.5 + 0.5) alpha: (baseColorRGBA[3] * 0.5 + 0.5)];
UIColor* lightDownColor = [UIColor colorWithRed: (baseColorRGBA[0] * 0.8) green: (baseColorRGBA[1] * 0.8) blue: (baseColorRGBA[2] * 0.8) alpha: (baseColorRGBA[3] * 0.8 + 0.2)];
//// Gradient Declarations
NSArray* buttonGradientColors = [NSArray arrayWithObjects:
(id)upperColor.CGColor,
(id)lowerColor.CGColor, nil];
CGFloat buttonGradientLocations[] = {0, 1};
CGGradientRef buttonGradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef)buttonGradientColors, buttonGradientLocations);
NSArray* overlayGradientColors = [NSArray arrayWithObjects:
(id)lightUpColor.CGColor,
(id)[UIColor clearColor].CGColor, nil];
CGFloat overlayGradientLocations[] = {0, 1};
CGGradientRef overlayGradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef)overlayGradientColors, overlayGradientLocations);
NSArray* gradientColors = [NSArray arrayWithObjects:
(id)lightUpColor.CGColor,
(id)lightDownColor.CGColor, nil];
CGFloat gradientLocations[] = {0, 1};
CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef)gradientColors, gradientLocations);
//// Shadow Declarations
UIColor* buttonShadow = [UIColor blackColor];
CGSize buttonShadowOffset = CGSizeMake(0.1, 1.1);
CGFloat buttonShadowBlurRadius = 2;
UIColor* textShadow = [UIColor blackColor];
CGSize textShadowOffset = CGSizeMake(0.1, -0.1);
CGFloat textShadowBlurRadius = 5;
//// Abstracted Attributes
NSString* textContent = #"Update";
//// Back Rectangle Drawing
UIBezierPath* backRectanglePath = [UIBezierPath bezierPathWithRoundedRect: CGRectMake(48, 53, 120, 23) cornerRadius: 4];
CGContextSaveGState(context);
CGContextSetShadowWithColor(context, buttonShadowOffset, buttonShadowBlurRadius, buttonShadow.CGColor);
CGContextBeginTransparencyLayer(context, NULL);
[backRectanglePath addClip];
CGContextDrawLinearGradient(context, gradient, CGPointMake(108, 53), CGPointMake(108, 76), 0);
CGContextEndTransparencyLayer(context);
CGContextRestoreGState(context);
//// Rounded Rectangle Drawing
UIBezierPath* roundedRectanglePath = [UIBezierPath bezierPathWithRoundedRect: CGRectMake(49, 54, 118, 21) cornerRadius: 3];
CGContextSaveGState(context);
[roundedRectanglePath addClip];
CGContextDrawLinearGradient(context, buttonGradient, CGPointMake(108, 54), CGPointMake(108, 75), 0);
CGContextRestoreGState(context);
//// Overlay Drawing
UIBezierPath* overlayPath = [UIBezierPath bezierPathWithRoundedRect: CGRectMake(48, 53, 120, 23) cornerRadius: 4];
CGContextSaveGState(context);
[overlayPath addClip];
CGContextDrawRadialGradient(context, overlayGradient,
CGPointMake(54.72, 38.09), 10,
CGPointMake(108, 11.46), 102.2,
kCGGradientDrawsBeforeStartLocation | kCGGradientDrawsAfterEndLocation);
CGContextRestoreGState(context);
//// Text Drawing
CGRect textRect = CGRectMake(55, 54, 104, 21);
UIBezierPath* textPath = [UIBezierPath bezierPathWithRect: textRect];
CGContextSaveGState(context);
CGContextSetShadowWithColor(context, textShadowOffset, textShadowBlurRadius, textShadow.CGColor);
CGContextBeginTransparencyLayer(context, NULL);
[textPath addClip];
CGContextDrawLinearGradient(context, buttonGradient, CGPointMake(107, 54), CGPointMake(107, 75), 0);
CGContextEndTransparencyLayer(context);
CGContextRestoreGState(context);
[strokeColor setStroke];
textPath.lineWidth = 1;
[textPath stroke];
CGContextSaveGState(context);
CGContextSetShadowWithColor(context, textShadowOffset, textShadowBlurRadius, textShadow.CGColor);
[[UIColor whiteColor] setFill];
[textContent drawInRect: textRect withFont: [UIFont boldSystemFontOfSize: [UIFont systemFontSize]] lineBreakMode: NSLineBreakByWordWrapping alignment: NSTextAlignmentCenter];
CGContextRestoreGState(context);
//// Cleanup
CGGradientRelease(buttonGradient);
CGGradientRelease(overlayGradient);
CGGradientRelease(gradient);
CGColorSpaceRelease(colorSpace);
NSLog(#"drawRect exit");
}
#end
You do not need to implement initWithFrame: when using a Storyboard.
In fact, the storyboard will use initWithCoder: so it won't even be called.
I tested your code, and it works fine, however, you are not drawing in the top left corner, but somewhere in the middle of the view, so be sure to make the view large enough if you want to see your button.
Preferably draw in the top left corner.
I would like to draw textured button in iOS app. I would not use Photoshop rather CoreGraphics because I want a general solution that works with buttons that has different size. What is the basic principle of it? What technology do I need?
My first step was to subclass a UIButton, but how can I add i.e. bevel effect to it?
The best approach will be subclassing you button class(your new class must inherit from UIButton). by doing this you can give some customized details too to your button.. Below is a sample ..
//interface of custom button class
#interface myButton : UIButton
{
int orderNo;
CAGradientLayer *gradientLayer;
CALayer *wrapperLayer;
CGColorRef _borderColor;
}
#property (assign) int orderNo;
#property (nonatomic) CGColorRef _borderColor;
#property (nonatomic, retain) CALayer *wrapperLayer;
#property (nonatomic, retain) CAGradientLayer *gradientLayer;
- (void)setBorderColor:(CGColorRef)color;
- (void)setCornerRadius:(float)radius;
The implementation..
#import "Button.h"
#implementation Button
#synthesize orderNo,wrapperLayer,_borderColor,gradientLayer;
- (id)initWithFrame:(CGRect)frame
{if ((self = [super initWithFrame:frame])) {
CGFloat radius = self.bounds.size.width / 2;
CGFloat borderWidth = self.bounds.size.width / 10;
self.layer.backgroundColor = [[UIColor blackColor] CGColor];
self.layer.borderColor = [[UIColor whiteColor] CGColor];
self.layer.borderWidth = borderWidth;
self.layer.cornerRadius = radius;
if ([self.layer respondsToSelector:#selector(setShadowOffset:)])
self.layer.shadowOffset = CGSizeMake(0.25, 0.25);
if ([self.layer respondsToSelector:#selector(setShadowColor:)])
self.layer.shadowColor = [[UIColor blackColor] CGColor];
if ([self.layer respondsToSelector:#selector(setShadowRadius:)])
self.layer.shadowRadius = borderWidth;
if ([self.layer respondsToSelector:#selector(setShadowOpacity:)])
self.layer.shadowOpacity = 0.75;
[self setNeedsDisplay];
}
return self;
}
- (void)drawRect:(CGRect)rect {
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextSetShouldAntialias(ctx, true);
CGFloat xsize = self.bounds.size.width / 6;
CGFloat borderWidth = self.bounds.size.width / 10;
CGContextSaveGState(ctx);
CGContextSetLineCap(ctx, kCGLineCapRound);
CGContextSetLineWidth(ctx, borderWidth);
CGContextSetStrokeColorWithColor(ctx, [[UIColor whiteColor] CGColor]);
CGFloat width = self.bounds.size.width;
CGPoint start1 = CGPointMake(width / 2 - xsize, width / 2 - xsize);
CGPoint end1 = CGPointMake(width / 2 + xsize, width / 2 + xsize);
CGPoint start2 = CGPointMake(width / 2 + xsize, width / 2 - xsize);
CGPoint end2 = CGPointMake(width / 2 - xsize, width / 2 + xsize);
CGContextBeginPath(ctx);
CGContextMoveToPoint(ctx, start1.x, start1.y);
CGContextAddLineToPoint(ctx, end1.x, end1.y);
CGContextStrokePath(ctx);
CGContextBeginPath(ctx);
CGContextMoveToPoint(ctx, start2.x, start2.y);
CGContextAddLineToPoint(ctx, end2.x, end2.y);
CGContextStrokePath(ctx);
CGContextRestoreGState(ctx);
}
- (void)setBorderColor:(CGColorRef)color
{
[[self layer] setBorderColor:color];
[[self layer] setNeedsDisplay];
}
- (void)setCornerRadius:(float)radius
{
[[self layer] setCornerRadius:radius];
// and get the wrapper for the gradient layer too
[wrapperLayer setCornerRadius:radius];
}
#end
How to get the following brush smoothness(hardness) effect like photoshop?
My attempt:
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSaveGState(context);
CGContextSetLineCap(context, kCGLineCapRound);
CGContextSetLineWidth(context, 30);
CGContextSetStrokeColorWithColor(context, [UIColor colorWithRed:1.0f green:0.0f blue:0.0f alpha:0.5f].CGColor);
CGContextSetShadowWithColor(context, CGSizeMake(0, 0), 20.0f, [UIColor colorWithRed:1.0f green:0.0f blue:0.0f alpha:1.0f].CGColor);
CGContextAddPath(context, path);
CGContextStrokePath(context);
CGContextRestoreGState(context);
I tried adjusting alpha values, and shadow blur factor, but no successful result.
Does anybody have a solution to this? Any help would be appreciated.
On this image you can see following code result. I believe it is almost same to what you want.
Just outer shadow is not just enough to give that smooth effect that is why I add some inner shadow to shape with white color.
- (void)drawRect:(CGRect)rect {
CGContextRef context = UIGraphicsGetCurrentContext();
// Shadows
UIColor* shadow = UIColor.redColor;
CGSize shadowOffset = CGSizeMake(0.1, -0.1);
CGFloat shadowBlurRadius = 11;
UIColor* shadow2 = UIColor.whiteColor; // Here you can adjust softness of inner shadow.
CGSize shadow2Offset = CGSizeMake(0.1, -0.1);
CGFloat shadow2BlurRadius = 9;
// Rectangle Drawing
UIBezierPath* rectanglePath = [UIBezierPath bezierPathWithRoundedRect: CGRectMake(59, 58, 439, 52) cornerRadius: 21];
CGContextSaveGState(context);
CGContextSetShadowWithColor(context, shadowOffset, shadowBlurRadius, [shadow CGColor]);
[UIColor.redColor setFill];
[rectanglePath fill];
// Rectangle Inner Shadow
CGContextSaveGState(context);
UIRectClip(rectanglePath.bounds);
CGContextSetShadowWithColor(context, CGSizeZero, 0, NULL);
CGContextSetAlpha(context, CGColorGetAlpha([shadow2 CGColor]));
CGContextBeginTransparencyLayer(context, NULL);
{
UIColor* opaqueShadow = [shadow2 colorWithAlphaComponent: 1];
CGContextSetShadowWithColor(context, shadow2Offset, shadow2BlurRadius, [opaqueShadow CGColor]);
CGContextSetBlendMode(context, kCGBlendModeSourceOut);
CGContextBeginTransparencyLayer(context, NULL);
[opaqueShadow setFill];
[rectanglePath fill];
CGContextEndTransparencyLayer(context);
}
CGContextEndTransparencyLayer(context);
CGContextRestoreGState(context);
CGContextRestoreGState(context);
}
Regarding size of the shape you have to adjust both inner and outer shadows blur radius.
You can get an effect similar to what you're trying to achieve by blending your shadow with your stroke
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextAddPath(context, path);
CGContextSetLineCap(context, kCGLineCapRound);
CGContextSetLineWidth(context, self.lineWidth);
CGContextSetStrokeColorWithColor(context, [UIColor whiteColor].CGColor);
CGContextSetShadowWithColor(context, CGSizeMake(0.f, 0.f), self.lineWidth/4, [self.lineColor CGColor]);
CGContextSetBlendMode(context, kCGBlendModeMultiply);
CGContextSetAlpha(context, self.lineAlpha);
CGContextStrokePath(context);
With Multiply blending mode, using white color as stroke color and setting the color of the brush you want to the shadow, you get the following result:
I've connected the drawing function to touchesMoved event, so that way the longer I take to paint a part of the image, the harder the "Brush" draws (see the black line).
This probably isn't the perfect answer, but it's the best I can do for my needs.
Grab the FXBlurView: https://github.com/nicklockwood/FXBlurView
You can either draw your strokes on an FXBlurView or convert your UIView to UIImage after you've finished drawing (using the code I took from this answer https://stackoverflow.com/a/22494886/505259):
+ (UIImage *) imageWithView:(UIView *)view
{
UIGraphicsBeginImageContextWithOptions(view.bounds.size, view.opaque, 0.0f);
[view drawViewHierarchyInRect:view.bounds afterScreenUpdates:NO];
UIImage * snapshotImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return snapshotImage;
}
and use FXBlurView's category on UIImage:
- (UIImage *)blurredImageWithRadius:(CGFloat)radius
iterations:(NSUInteger)iterations
tintColor:(UIColor *)tintColor;
to blur the resulting image, giving it a Photoshop soft brush like appearance.
I'm still looking for a real answer though. I have an OpenCV project that requires an exact replica of Photoshop's soft brush tool.
I've been working on drawing the path with inner glow, and somehow succeeded (at least for my taste).
I've implemented the drawing code on top of the levinunnick's Smooth-Line-View. The code is MIT licensed, so you'll need to add it to your project.
Currently you can assign the line color, width and the smoothness for the line you want to draw. Be careful with smoothness, use a float between 0 - 1. I've changed the touch methods cause I needed to access the drawing methods from another view. Check the original code, if you want to revert to the touch methods.
I did not optimize the code, if you've got a better idea, just edit this answer.
Here is the H file:
#interface LineView : UIView
- (instancetype)initWithFrame:(CGRect)frame andColor:(UIColor *)lineColor andWidth:(CGFloat)lineWidth andSmoothness:(CGFloat)lineSmooth;
- (void)touchStartedWith:(CGPoint)location;
- (void)touchMovedWith:(CGPoint)location;
#end
This is the M file:
#import "LineView.h"
static const CGFloat kPointMinDistance = 0.05f;
static const CGFloat kPointMinDistanceSquared = kPointMinDistance * kPointMinDistance;
#interface LineView ()
#property (strong) UIColor *lineColor;
#property (assign) CGFloat lineWidth;
#property (assign) CGFloat lineSmooth;
#property (assign) CGPoint currentPoint;
#property (assign) CGPoint previousPoint;
#property (assign) CGPoint previousPreviousPoint;
#end
#implementation LineView
{
#private
CGMutablePathRef _path;
}
- (instancetype)initWithFrame:(CGRect)frame andColor:(UIColor *)lineColor andWidth:(CGFloat)lineWidth andSmoothness:(CGFloat)lineSmooth
{
self = [super initWithFrame:frame];
if ( self ) {
_path = CGPathCreateMutable();
if ( lineSmooth < 0 ) lineSmooth = 0;
if ( lineSmooth > 1 ) lineSmooth = 1;
self.backgroundColor = [UIColor clearColor];
self.lineColor = lineColor;
self.lineWidth = lineWidth;
self.lineSmooth = lineWidth * ( lineSmooth / 4 );
self.opaque = NO;
}
return self;
}
- (void)drawRect:(CGRect)rect
{
[self.backgroundColor set];
UIRectFill(rect);
#autoreleasepool {
CGColorRef theColor = self.lineColor.CGColor;
UIColor *theClearOpaque = [[UIColor whiteColor] colorWithAlphaComponent:1];
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextAddPath(context, _path);
CGContextSetLineCap(context, kCGLineCapRound);
CGContextSetLineWidth(context, self.lineWidth);
CGContextSetStrokeColorWithColor(context, theColor);
// Outer shadow
CGSize shadowOffset = CGSizeMake(0.1f, -0.1f);
CGFloat shadowBlurRadius = self.lineSmooth;
CGContextSetShadowWithColor(context, shadowOffset, shadowBlurRadius, theColor);
CGContextStrokePath(context);
if ( self.lineSmooth > 0 ) {
// Inner shadow
CGRect bounds = CGPathGetBoundingBox(_path);
CGRect drawBox = CGRectInset(bounds, -2.0f * self.lineWidth, -2.0f * self.lineWidth);
CGContextSaveGState(context);
UIRectClip(drawBox);
CGContextSetShadowWithColor(context, CGSizeZero, 0, NULL);
CGContextSetAlpha(context, CGColorGetAlpha(theClearOpaque.CGColor));
CGContextBeginTransparencyLayer(context, NULL);
{
// Outer shadow
UIColor *oShadow = [theClearOpaque colorWithAlphaComponent:1];
CGContextSetShadowWithColor(context, CGSizeMake(0.1f, -0.1f), self.lineWidth / 64 * self.lineSmooth, oShadow.CGColor);
CGContextSetBlendMode(context, kCGBlendModeSourceOut);
CGContextBeginTransparencyLayer(context, NULL);
[oShadow setFill];
// Draw the line again
CGContextAddPath(context, _path);
CGContextSetLineCap(context, kCGLineCapRound);
CGContextSetLineWidth(context, self.lineWidth);
CGContextSetStrokeColorWithColor(context, oShadow.CGColor);
CGContextStrokePath(context);
CGContextEndTransparencyLayer(context);
}
CGContextEndTransparencyLayer(context);
CGContextRestoreGState(context);
}
}
}
- (void)touchStartedWith:(CGPoint)location
{
self.previousPoint = location;
self.previousPreviousPoint = location;
self.currentPoint = location;
[self touchMovedWith:location];
}
- (void)touchMovedWith:(CGPoint)location
{
CGRect drawBox;
#autoreleasepool {
CGFloat dx = location.x - self.currentPoint.x;
CGFloat dy = location.y - self.currentPoint.y;
if ( ( dx * dx + dy * dy ) < kPointMinDistanceSquared ) {
return;
}
self.previousPreviousPoint = self.previousPoint;
self.previousPoint = self.currentPoint;
self.currentPoint = location;
CGPoint mid1 = midPoint(self.previousPoint, self.previousPreviousPoint);
CGPoint mid2 = midPoint(self.currentPoint, self.previousPoint);
CGMutablePathRef subpath = CGPathCreateMutable();
CGPathMoveToPoint(subpath, NULL, mid1.x, mid1.y);
CGPathAddQuadCurveToPoint(subpath, NULL, self.previousPoint.x, self.previousPoint.y, mid2.x, mid2.y);
CGRect bounds = CGPathGetBoundingBox(subpath);
drawBox = CGRectInset(bounds, -2.0f * self.lineWidth, -2.0f * self.lineWidth);
CGPathAddPath(_path, NULL, subpath);
CGPathRelease(subpath);
}
[self setNeedsDisplayInRect:drawBox];
}
- (void)dealloc
{
CGPathRelease(_path);
_path = NULL;
}
#end