在view左上角原点处绘制Button

载:http://nachbaur.com/blog/building-a-custom-dashboard-uibutton



 
As part of the Parking Mobility iPhone app I’ve been building, I wanted to integrate a simple “Quick Start” help guide to show people how to use the app without being intrusive.  I wanted to use the project’s branding as much as possible, and give the user a feeling like they haven’t left the main portion of the app.  So I wanted the user to be comfortable with it, and always have a quick way to close the help window to get back to the app.


The end result is actually really simple.  I subclassed the UIButton class, and overrode the drawRect: method to use some native drawing primitives.

//
//  DNCloseButton.h
//  ParkingMobility
//
//  Created by Michael Nachbaur on 10-08-22.
//  Copyright 2010 Decaf Ninja Software. All rights reserved.
//

#import 
#import 

@interface DNCloseButton : UIButton {
}

@end


//

//  DNCloseButton.m
//  ParkingMobility
//
//  Created by Michael Nachbaur on 10-08-22.
//  Copyright 2010 Decaf Ninja Software. All rights reserved.
//

#import "DNCloseButton.h"

@implementation DNCloseButton

- (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);
}

@end

 

Reading through the source code, you can see how I split the drawing between two different routines.  First, my layer drawing which draws the border, the circle, shadows, etc is handled using raw CALayer drawing.  The second block, inside drawRect:, draws the lines forming the “X” inside.

CGFloat closeSize = 26.0;
CGRect butframe = CGRectMake(0.0, 0.0, closeSize, closeSize);
butframe.origin.x = contentView.frame.origin.x - closeSize / 2;
butframe.origin.y = contentView.frame.origin.y - closeSize / 2;

DNCloseButton *button = [[[DNCloseButton alloc] initWithFrame:butframe] autorelease];
[button addTarget:self action:@selector(closePopup:) forControlEvents:UIControlEventTouchUpInside];

[self.view addSubview:button];

 

If you find any bugs in this code, please let me know and I’ll update this post.  I hope this works out as well for you as it has for me.