简体   繁体   中英

Improper borders in draw rect

I am trying to draw rounded corners on rectangle in drawRect method using bezier path, but somehow the rounded corner is being shown on inner side of rectangle, instead of both inner and outer sides. Code is given below. Also attached herewith is border that is currently being drawn (outer side of border is not rounded)

仅带有内圆角的图像

 - (void)drawRect:(CGRect)rect
 {


  // Drawing code
    CGContextRef context=UIGraphicsGetCurrentContext();

    //Set gray color to whole context
    [[UIColor lightGrayColor] set];
    CGContextSetAlpha(context,0.7);
    UIRectFill(rect);

    // Configure the context colors and line
    CGContextSetStrokeColorWithColor(context, [UIColor colorWithRed:131./255. green:148./255. blue:219./255. alpha:1.0].CGColor);
    CGContextSetFillColorWithColor(context, [UIColor whiteColor].CGColor);
    CGContextSetLineWidth(context, 10.0);
    CGSize size=self.bounds.size;

    CGFloat radius = 10.0;

    CGSize guideSize=CGSizeMake(330, 130);
    CGRect guideCoords= CGRectMake(size.width*.5-guideSize.width*.5, size.height*.5-guideSize.height*.5, guideSize.width , guideSize.height);

    // Guide drawing
    CGContextStrokeRect(context,guideCoords);

    // Draw the Text
    [kVinGuideMessage drawInRect:CGRectMake(guideCoords.origin.x+kSideMessageMargin, guideCoords.origin.y+guideSize.height+kMarginFromGuide, guideCoords.size.width-2*kSideMessageMargin,40) withFont:[UIFont systemFontOfSize:16.0] lineBreakMode:NSLineBreakByWordWrapping alignment:NSTextAlignmentLeft];


    //Get instersection and clear color of inner overlay
    CGRect holeRectIntersection = CGRectIntersection(rect,guideCoords);

    //----------ADDING ROUNDED CORNERS HERE-----------//
    CGPathRef clippath = [UIBezierPath bezierPathWithRoundedRect:guideCoords cornerRadius:radius].CGPath;
    CGContextAddPath(context, clippath);
    CGContextClip(context);
    //------------------------------------------------//
    [[UIColor clearColor] setFill];
    UIRectFill(holeRectIntersection);

}

The outer corners are being drawn by the CGContextStrokeRect(context,guideCoords); I think. At that point you haven't set a clipping path and your line width is 10 points, so why would the outer corners be rounded? I think you'll have better luck if you set a clipping path (probably not exactly the same clipping path you've got at the bottom) before calling stroke rect on the guideCoords rectangle.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM