how to make dashed line moveable

问题

I used codes below to draw a dashed line

// get the current CGContextRef for the view
  CGContextRef currentContext =
     (CGContextRef)[[NSGraphicsContext currentContext]
     graphicsPort];

  // grab some useful view size numbers
  NSRect bounds = [self bounds];
  float width = NSWidth( bounds );
  float height = NSHeight( bounds );
  float originX = NSMinX( bounds );
  float originY = NSMinY( bounds );
  float maxX = NSMaxX( bounds );
  float maxY = NSMaxY( bounds );
  float middleX = NSMidX( bounds );
  float middleY = NSMidY( bounds );

   CGContextSetLineWidth( currentContext, 10.0 );
   float dashPhase = 0.0;
   float dashLengths[] = { 20, 30, 40, 30, 20, 10 };
   CGContextSetLineDash( currentContext,
      dashPhase, dashLengths,
      sizeof( dashLengths ) / sizeof( float ) );

   CGContextMoveToPoint( currentContext,
      originX + 10, middleY );
   CGContextAddLineToPoint( currentContext,
      maxX - 10, middleY );
   CGContextStrokePath( currentContext );

it is static.

But I prefer to make the dashes and gaps moveable

move from right to left and circle

Is it possible?

more improved case:

dashes and gaps move clockwise automatically

Welcome any comment

回答1:

The simplest way would be to make the phase variable an ivar and override keyDown:

- (BOOL)acceptsFirstResponder 
{
    return YES;
}

- (void)keyDown:(NSEvent *)theEvent
{
    switch ([theEvent keyCode])
    {
        case 0x7B: //left cursor key
            dashPhase += 10.0;
            break;
        case 0x7C: //right cursor key
            dashPhase -= 10.0;
            break;
        default:
            [super keyDown:theEvent];            
            break;
    }
    [self setNeedsDisplay:YES];
}

Also make sure to set the initialResponder of your window to the custom view (I assume you do your drawing in an NSView subclass).

The wrapping around code shouldn't be too hard. Just divide your dashLengths array and reassemble it the way you want. (You didn't specify if you want to split single dashes or not)

Update

OK. I misunderstood the "move from right to left and circle" part of your question. I thought you want the dashed line to wrap around. If you want to draw a rect with a movable, dashed border that would even be easier. Put this in an NSView subclass and it should draw a dashed rectangle that moves it's dashes when you press ← or →:

- (id)initWithFrame:(NSRect)frame
{
    self = [super initWithFrame:frame];
    if (self) 
    {
        patternRectangle = [self bounds];
    }

    return self;
}

- (void)drawRect:(NSRect)dirtyRect
{
    CGContextRef currentContext = (CGContextRef)[[NSGraphicsContext currentContext] graphicsPort];
    CGContextSetLineWidth( currentContext, 10.0 );
    CGFloat dashLengths[] = { 20, 30, 40, 30, 20, 10 };
    CGContextSetLineDash( currentContext, dashPhase, dashLengths, sizeof( dashLengths ) / sizeof( float ) );
    CGPathCreateWithRect(CGRectMake(2.0, 2.0, 100.0, 100.0), NULL);
    CGContextStrokeRect(currentContext, CGRectInset(NSRectToCGRect([self bounds]), 10.0, 10.0));
    CGContextStrokePath( currentContext );
}

- (BOOL)acceptsFirstResponder 
{
    return YES;
}

- (void)keyDown:(NSEvent *)theEvent
{
    switch ([theEvent keyCode])
    {
        case 0x7B:
            dashPhase += 10.0;
            break;
        case 0x7C:
            dashPhase -= 10.0;
            break;
        default:
            [super keyDown:theEvent];            
            break;
    }
    [self setNeedsDisplay:YES];
}

来源：https://stackoverflow.com/questions/7911612/how-to-make-dashed-line-moveable

标签

macos

cocoa

core-graphics

cgcontext