CODEWITHSUNDEEP
iosobjective-cuiview
Kex
Kex

Reputation: 8589

Resizing a UIView and dynamically resizing the drawing in drawRect

I have a UIView that I want to be resizable via a UISlider. My UISlider range is set at 1.0-2.0. Currently I am resizing the view using a CGAffineTransform.

Screenshot:

enter image description here

My done in the custom UIView:

- (void)drawRect:(CGRect)rect {

    NSLog(@"Draw rect called");


    //// Square Drawing
    UIBezierPath* squarePath = [UIBezierPath bezierPathWithRect: CGRectMake(8, 8, 50, 50)];
    [UIColor.whiteColor setFill];
    [squarePath fill];


    //// Right top Drawing
    UIBezierPath* rightTopPath = [UIBezierPath bezierPathWithRect: CGRectMake(57, 13, 9, 10)];
    [UIColor.whiteColor setStroke];
    rightTopPath.lineWidth = 1;
    [rightTopPath stroke];


    //// Top left Drawing
    UIBezierPath* topLeftPath = [UIBezierPath bezierPathWithRect: CGRectMake(13, 0, 17.5, 9)];
    [UIColor.whiteColor setStroke];
    topLeftPath.lineWidth = 1;
    [topLeftPath stroke];


    //// Top right Drawing
    UIBezierPath* topRightPath = [UIBezierPath bezierPathWithRect: CGRectMake(35, 0, 17.5, 9)];
    [UIColor.whiteColor setStroke];
    topRightPath.lineWidth = 1;
    [topRightPath stroke];


    //// Right middle Drawing
    UIBezierPath* rightMiddlePath = [UIBezierPath bezierPathWithRect: CGRectMake(57, 28, 9, 10)];
    [UIColor.whiteColor setStroke];
    rightMiddlePath.lineWidth = 1;
    [rightMiddlePath stroke];


    //// Right bottom Drawing
    UIBezierPath* rightBottomPath = [UIBezierPath bezierPathWithRect: CGRectMake(57, 43, 9, 10)];
    [UIColor.whiteColor setStroke];
    rightBottomPath.lineWidth = 1;
    [rightBottomPath stroke];


}

Code for the slider:

- (IBAction)changeValue:(id)sender {


    CGAffineTransform transform = CGAffineTransformScale(CGAffineTransformIdentity, self.slider.value, self.slider.value);
    self.square.transform = transform;

}

This works okay however there is quality loss in the drawing as I resize because I'm not actually dynamically changing the size of the drawing. What I would actually like to do is change the size of the drawing dynamically. How would I achieve this? Do I need to first resize the frame and then call [self.square setNeedsDisplay] passing in the multiplication factor?

EDIT:

So I tired this method, now when I move the slider I have:

- (IBAction)changeValue:(id)sender {


  CGRect newFrame = CGRectMake(20, 20, 72*self.slider2.value, 72*self.slider2.value);
self.square.frame = newFrame;
[self.square resizeAt:self.slider2.value];



}

So I am just changing the frame size now, then passing the slider value into the view and calling:

-(void)resizeAt: (float)multiply{

    self.size=multiply;
    self.transform = CGAffineTransformScale(CGAffineTransformIdentity, self.size, self.size);
    [self setNeedsDisplay];

}

an example of what is happening in drawRect:

UIBezierPath* squarePath = [UIBezierPath bezierPathWithRect: CGRectMake(11, 11, 50, 50)];
    [squarePath applyTransform:self.transform];
    [UIColor.whiteColor setFill];
    [squarePath fill];

However the image doesn't look sharp or "redrawn"

Upvotes: 1

Views: 590

Answers (1)

Wain
Wain

Reputation: 119031

Consider creating your bezier paths with points in the range 0.0 to 1.0 and then applying your transform directly to each bezier path. The scale of your transform would obviously change because you're scaling the paths to the full view size, not to a relative size.

Because you scale the path rather than the already rendered view the path render will still be clean and accurate.

Upvotes: 1

Related Questions