autolayoutscaledrawrectcontentmode

drawrect to fit uiview no matter the size


I have a uiview class that calls a custom drawing class method with a drawrect in it. The drawrect drawing coordinates are drawn for a 433x439 uiview. When this app opens on an iPad Pro autolayout changes the size of the uiview (correctly). But the drawrect still draws to the old 'size'(433x439) and does not scale to fill the new uiview bounds.

enter image description here

Any idea how I can get this to work? I do not want to draw it again to the new coordinates. Seems like content mode or something should redraw? Note: I tap on these shapes to do something else. The scaling(?) that someone hopefully helps me with should not affect that, correct?

    + (void)drawDemos
{

    collectedppaths = [NSMutableArray new];

    //// Color Declarations
    UIColor* color2 = [UIColor colorWithRed: 1 green: 0 blue: 0 alpha: 1];

    //// Group
    {
        //// demo 0 Drawing
        UIBezierPath* demo0Path = [UIBezierPath bezierPath];
        [demo0Path moveToPoint: CGPointMake(35.5, 215.55)];
        [demo0Path addLineToPoint: CGPointMake(86.38, 215.55)];
        [demo0Path addLineToPoint: CGPointMake(86.38, 253.39)];
        [demo0Path addLineToPoint: CGPointMake(35.5, 254.32)];
        [demo0Path addLineToPoint: CGPointMake(35.5, 215.55)];
        [demo0Path closePath];
        [color2 setStroke];
        demo0Path.lineWidth = 5;
        [demo0Path stroke];
        [collectedppaths addObject:demo0Path];


        //// demo 1 Drawing
        UIBezierPath* demo1Path = [UIBezierPath bezierPath];
        [demo1Path moveToPoint: CGPointMake(35.5, 254.79)];
        [demo1Path addLineToPoint: CGPointMake(86.38, 254.79)];
        [demo1Path addLineToPoint: CGPointMake(86.38, 304.76)];
        [demo1Path addLineToPoint: CGPointMake(35.5, 303.36)];
        [demo1Path addLineToPoint: CGPointMake(35.5, 254.79)];
        [demo1Path closePath];
        [color2 setStroke];
        demo1Path.lineWidth = 5;
        [demo1Path stroke];
        [collectedppaths addObject:demo1Path];


        //// demo 3 Drawing
        UIBezierPath* demo3Path = [UIBezierPath bezierPath];
        [demo3Path moveToPoint: CGPointMake(86.38, 254.79)];
        [demo3Path addLineToPoint: CGPointMake(102.71, 256.19)];
        [demo3Path addLineToPoint: CGPointMake(122.78, 260.39)];
        [demo3Path addLineToPoint: CGPointMake(138.19, 266)];
        [demo3Path addLineToPoint: CGPointMake(155.46, 259.46)];
        [demo3Path addLineToPoint: CGPointMake(169.46, 250.12)];
        [demo3Path addLineToPoint: CGPointMake(177.86, 240.78)];
        [demo3Path addLineToPoint: CGPointMake(183.46, 239.37)];
        [demo3Path addLineToPoint: CGPointMake(182.53, 302.9)];
        [demo3Path addLineToPoint: CGPointMake(88.24, 303.83)];
        [demo3Path addLineToPoint: CGPointMake(86.38, 254.79)];
        [demo3Path closePath];
        [color2 setStroke];
        demo3Path.lineWidth = 5;
        [demo3Path stroke];
        [collectedppaths addObject:demo3Path];


        //// demo 6 Drawing
        UIBezierPath* demo6Path = [UIBezierPath bezierPath];
        [demo6Path moveToPoint: CGPointMake(183.93, 238.91)];
        [demo6Path addLineToPoint: CGPointMake(182.53, 308.5)];
        [demo6Path addLineToPoint: CGPointMake(279.61, 307.1)];
        [demo6Path addLineToPoint: CGPointMake(279.61, 254.79)];
        [demo6Path addLineToPoint: CGPointMake(208.2, 254.79)];
        [demo6Path addLineToPoint: CGPointMake(191.4, 241.24)];
        [demo6Path addLineToPoint: CGPointMake(183.93, 238.91)];
        [demo6Path closePath];
        [color2 setStroke];
        demo6Path.lineWidth = 5;
        [demo6Path stroke];
        [collectedppaths addObject:demo6Path];


        //// demo 5 Drawing
        UIBezierPath* demo5Path = [UIBezierPath bezierPath];
        [demo5Path moveToPoint: CGPointMake(182.99, 158.1)];
        [demo5Path addLineToPoint: CGPointMake(279.14, 206.68)];
        [demo5Path addLineToPoint: CGPointMake(279.61, 254.79)];
        [demo5Path addLineToPoint: CGPointMake(208.66, 254.79)];
        [demo5Path addCurveToPoint: CGPointMake(191.4, 241.24) controlPoint1: CGPointMake(208.66, 254.79) controlPoint2: CGPointMake(191.4, 241.71)];
        [demo5Path addCurveToPoint: CGPointMake(183.93, 238.91) controlPoint1: CGPointMake(191.4, 240.78) controlPoint2: CGPointMake(183.93, 238.91)];
        [demo5Path addLineToPoint: CGPointMake(182.99, 158.1)];
        [demo5Path closePath];
        [color2 setStroke];
        demo5Path.lineWidth = 5;
        [demo5Path stroke];
        [collectedppaths addObject:demo5Path];


        //// demo 4 Drawing
        UIBezierPath* demo4Path = [UIBezierPath bezierPath];
        [demo4Path moveToPoint: CGPointMake(218.47, 74.5)];
        [demo4Path addLineToPoint: CGPointMake(225.47, 82.91)];
        [demo4Path addLineToPoint: CGPointMake(232.94, 103.46)];
        [demo4Path addLineToPoint: CGPointMake(241.34, 119.34)];
        [demo4Path addLineToPoint: CGPointMake(260.01, 132.42)];
        [demo4Path addLineToPoint: CGPointMake(281.48, 139.42)];
        [demo4Path addLineToPoint: CGPointMake(279.14, 206.68)];
        [demo4Path addLineToPoint: CGPointMake(182.99, 158.1)];
        [demo4Path addLineToPoint: CGPointMake(182.99, 111.4)];
        [demo4Path addLineToPoint: CGPointMake(179.26, 97.39)];
        [demo4Path addLineToPoint: CGPointMake(218.47, 74.5)];
        [demo4Path closePath];
        [color2 setStroke];
        demo4Path.lineWidth = 5;
        [demo4Path stroke];
        [collectedppaths addObject:demo4Path];


        //// demo 7 Drawing
        UIBezierPath* demo7Path = [UIBezierPath bezierPath];
        [demo7Path moveToPoint: CGPointMake(281.95, 140.36)];
        [demo7Path addLineToPoint: CGPointMake(300.62, 143.16)];
        [demo7Path addLineToPoint: CGPointMake(319.75, 143.16)];
        [demo7Path addLineToPoint: CGPointMake(352.42, 165.58)];
        [demo7Path addLineToPoint: CGPointMake(359.43, 183.79)];
        [demo7Path addLineToPoint: CGPointMake(387.9, 196.4)];
        [demo7Path addLineToPoint: CGPointMake(397.7, 221.16)];
        [demo7Path addLineToPoint: CGPointMake(377.16, 228.63)];
        [demo7Path addLineToPoint: CGPointMake(297.35, 228.63)];
        [demo7Path addLineToPoint: CGPointMake(292.68, 225.83)];
        [demo7Path addLineToPoint: CGPointMake(289.88, 213.69)];
        [demo7Path addLineToPoint: CGPointMake(279.14, 206.68)];
        [demo7Path addLineToPoint: CGPointMake(281.95, 140.36)];
        [demo7Path closePath];
        [color2 setStroke];
        demo7Path.lineWidth = 5;
        [demo7Path stroke];
        [collectedppaths addObject:demo7Path];


        //// demo 8 Drawing
        UIBezierPath* demo8Path = [UIBezierPath bezierPath];
        [demo8Path moveToPoint: CGPointMake(279.61, 206.21)];
        [demo8Path addLineToPoint: CGPointMake(289.88, 213.69)];
        [demo8Path addLineToPoint: CGPointMake(292.68, 225.83)];
        [demo8Path addLineToPoint: CGPointMake(297.35, 228.63)];
        [demo8Path addLineToPoint: CGPointMake(376.7, 228.63)];
        [demo8Path addLineToPoint: CGPointMake(397.7, 221.16)];
        [demo8Path addLineToPoint: CGPointMake(400.5, 228.63)];
        [demo8Path addLineToPoint: CGPointMake(393.5, 253.85)];
        [demo8Path addLineToPoint: CGPointMake(279.61, 253.85)];
        [demo8Path addLineToPoint: CGPointMake(279.61, 206.21)];
        [demo8Path addLineToPoint: CGPointMake(279.61, 206.21)];
        [demo8Path closePath];
        [color2 setStroke];
        demo8Path.lineWidth = 5;
        [demo8Path stroke];
        [collectedppaths addObject:demo8Path];


        //// demo 9 Drawing
        UIBezierPath* demo9Path = [UIBezierPath bezierPath];
        [demo9Path moveToPoint: CGPointMake(280.08, 253.39)];
        [demo9Path addLineToPoint: CGPointMake(398.17, 253.39)];
        [demo9Path addLineToPoint: CGPointMake(394.9, 261.33)];
        [demo9Path addLineToPoint: CGPointMake(388.83, 266.93)];
        [demo9Path addCurveToPoint: CGPointMake(382.76, 270.67) controlPoint1: CGPointMake(388.83, 266.93) controlPoint2: CGPointMake(382.76, 270.2)];
        [demo9Path addCurveToPoint: CGPointMake(377.16, 276.74) controlPoint1: CGPointMake(382.76, 271.13) controlPoint2: CGPointMake(377.16, 276.74)];
        [demo9Path addLineToPoint: CGPointMake(374.83, 282.81)];
        [demo9Path addLineToPoint: CGPointMake(377.16, 308.5)];
        [demo9Path addLineToPoint: CGPointMake(280.08, 308.5)];
        [demo9Path addLineToPoint: CGPointMake(280.08, 253.39)];
        [demo9Path closePath];
        [color2 setStroke];
        demo9Path.lineWidth = 5;
        [demo9Path stroke];
        [collectedppaths addObject:demo9Path];


        //// demo 2 Drawing
        UIBezierPath* demo2Path = [UIBezierPath bezierPath];
        [demo2Path moveToPoint: CGPointMake(86.84, 215.55)];
        [demo2Path addLineToPoint: CGPointMake(183.93, 215.55)];
        [demo2Path addLineToPoint: CGPointMake(183.93, 238.91)];
        [demo2Path addLineToPoint: CGPointMake(177.86, 240.78)];
        [demo2Path addLineToPoint: CGPointMake(169.46, 250.12)];
        [demo2Path addLineToPoint: CGPointMake(155.46, 259.46)];
        [demo2Path addLineToPoint: CGPointMake(138.19, 266)];
        [demo2Path addLineToPoint: CGPointMake(122.78, 260.39)];
        [demo2Path addLineToPoint: CGPointMake(102.71, 256.19)];
        [demo2Path addLineToPoint: CGPointMake(86.84, 254.79)];
        [demo2Path addLineToPoint: CGPointMake(86.84, 215.55)];
        [demo2Path closePath];
        [color2 setStroke];
        demo2Path.lineWidth = 5;
        [demo2Path stroke];
        [collectedppaths addObject:demo2Path];
    }

}

Solution

  • You are hardcoding your points. Of course it is going to draw in the same place and same size.

    Instead, define your points as proportions of the entire view, and calculate the exact x and y values based on the rect that is passed into drawRect.

    Now all you have to do is superimpose your view in the correct spot and size and the drawing should scale automatically. You can even have the user zoom and the area should just redraw itself correctly.