I have a "scrollview" with nodes (UIViews
) that can be dragged around. I am trying to draw edges between selected UIViews
with a "calayer", but I can't figure out how to redraw the line when a views position have changed.
In my viewController
class I add the edge between first and second in the nodes array as:
EdgeLayer *edge = [[EdgeLayer alloc]init];
edge.delegate = self;
edge.strokeColor = [UIColor colorWithWhite:0.25 alpha:1.0];
edge.strokeWidth = 0.5;
edge.startNode = [nodes objectAtIndex:0];
edge.endNode = [nodes objectAtIndex:1];
edge.frame = scrollView.bounds;
[scrollView.layer addSublayer:edge];
[edge setNeedsDisplay];
EdgeLayer.h
:
#import <Foundation/Foundation.h>
#import <QuartzCore/QuartzCore.h>
@interface EdgeLayer : CALayer
@property (nonatomic, strong) UIColor *fillColor;
@property (nonatomic) CGFloat strokeWidth;
@property (nonatomic, strong) UIColor *strokeColor;
@property (nonatomic) UIView *startNode;
@property (nonatomic) UIView *endNode;
@end
EdgeLayer.m
:
#import "EdgeLayer.h"
#import "NodeView.h"
@implementation EdgeLayer
@synthesize fillColor, strokeColor, strokeWidth;
- (id)init {
self = [super init];
if (self) {
self.fillColor = [UIColor grayColor];
self.strokeColor = [UIColor blackColor];
self.strokeWidth = 1.0;
[self setNeedsDisplay];
}
return self;
}
- (void) setStartNode:(NodeView*)startNode
{
_startNode = startNode;
[self setNeedsDisplay];
}
- (void) setEndNode:(NodeView*)endNode
{
_endNode = endNode;
[endNode addObserver:self forKeyPath:@"endNode" options:NSKeyValueObservingOptionNew context:nil];
[self setNeedsDisplay];
}
-(id)initWithLayer:(id)layer
{
self = [super initWithLayer:layer];
return self;
}
-(void) observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change: (NSDictionary *)change context:(void *)context
{
if ([keyPath isEqualToString:@"endNode"] )
{
// process here
}
NSLog(@"View changed its geometry");
}
- (void)drawInContext:(CGContextRef)ctx
{
NSLog(@"DRAW");
CGContextSetStrokeColorWithColor(ctx, [UIColor blackColor].CGColor);
CGContextSetLineWidth(ctx, 2);
CGContextMoveToPoint(ctx, _startNode.center.x, _startNode.center.y);
CGContextAddLineToPoint(ctx, _endNode.center.x, _endNode.center.y);
CGContextStrokePath(ctx);
}
@end
This adds a line from the first and second nodes center position. I have tried to add an observer for the end node, but I don't think that I'm doing it right. I can't trigger the observeValueForKeyPath
method. My guess is that I added the observer in the wrong place.