Draw on UIView or GLKView?

Question

I need to draw a separator line with some dots on it. I have decided I will do this using the draw method, as opposed to including images of the separator. I will do this for performance and for customisability, as the separator changes sometimes.

Now I have looked into the draw() method on UIView and I have noticed that Apple suggests using GLKView when drawing using OpenGL.

For a simple separator, won't it be too much of a hassle to call OpenGL? Or is the OpenGL overhead negligible? When would I want to use the native UIKit draw() then?

FYI I don't know either method, but want to learn both methods, so don't reply "what you know best". I am simply asking about performance.

are you going to use it for an iOS normal app or an iOS game? — KrishnaCA, Nov 15 '16 at 11:10

KrishnaCA · Accepted Answer · 2016-11-15T11:30:41.950

1

OpenGL uses GPU instead of CPU for computation. If you are making something like a gaming app, then you can think of using OpenGL. I believe you want to draw a line in an iOS App. For that you can either use drawRect method in UIView or create a shapeLayer and add it as a sublayer.

The following examples will show you:

CAShapeLayer *simpleLine = [CAShapeLayer layer];
UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(0, 80)];
[path addLineToPoint:CGPointMake(300, 80)];
simpleLine.lineWidth = 1.0;
simpleLine.path = path.CGPath;
simpleLine.strokeColor = [[UIColor blackColor] CGColor];
[[self.view layer] addSublayer:simpleLine];

For using drawRect, you are supposed to do this inside a Custom UIView as opposed to the above method.

- (void)drawRect:(CGRect)rect {
    UIBezierPath *path = [UIBezierPath bezierPath];
    [path moveToPoint:CGPointMake(0, 80)];
    [path addLineToPoint:CGPointMake(300, 80)];
    path.lineWidth = 1.0;
    [[UIColor blueColor] setStroke];
    [path stroke];
}

If your separator parameters changes and if you are making an app, it's better to use drawRect method. You can call this method anytime by using [CustomUIView setNeedsDisplay:YES]

Edit

What you're asking for is circle over line. You can do that by drawing UIBezierPath for line first and then add UIBezierPath for circle later.

edited Nov 15 '16 at 11:30

answered Nov 15 '16 at 11:05

KrishnaCA

5,615
1
21
31

You suggest using the draw method in UIView as opposed to GLKView for a simple line? – vrwim Nov 15 '16 at 11:11
1

GLKView uses openGL. The Open Graphics Library (OpenGL) is used for visualizing 2D and 3D data. It is a multipurpose open-standard graphics library that supports applications for 2D and 3D digital content creation, mechanical and architectural design, virtual prototyping, flight simulation, video games, and more. If you are going to create a simple app, and for a simple line in that, I don't see a need for using GPU. If it is a game, then it's different – KrishnaCA Nov 15 '16 at 11:13
How would I draw a circle on this line? – vrwim Nov 15 '16 at 11:15
Do you want a dotted line? something like `........`. If that's what you want, then it already has an answer here: http://stackoverflow.com/questions/26018302/draw-dotted-not-dashed-line – KrishnaCA Nov 15 '16 at 11:16
No, it's something like this: http://www.vanseodesign.com/blog/wp-content/uploads/2010/03/dots-line.png – vrwim Nov 15 '16 at 11:18

User511 · Answer 2 · 2016-11-15T11:37:33.253

Normal Line

UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(10.0, 10.0)];
[path addLineToPoint:CGPointMake(100.0, 100.0)];
CAShapeLayer *shapeLayer = [CAShapeLayer layer];
shapeLayer.path = [path CGPath];
shapeLayer.strokeColor = [[UIColor redColor] CGColor];
shapeLayer.lineWidth = 3.0;
shapeLayer.fillColor = [[UIColor clearColor] CGColor];
[self.view.layer addSublayer:shapeLayer];

Dotted Line

UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(10.0, 10.0)];
[path addLineToPoint:CGPointMake(100.0, 100.0)];
CAShapeLayer *shapeLayer = [CAShapeLayer layer];
shapeLayer.path = [path CGPath];
shapeLayer.strokeColor = [[UIColor redColor] CGColor];
shapeLayer.lineWidth = 3.0;
shapeLayer.fillColor = [[UIColor clearColor] CGColor];
shapeLayer.lineDashPattern = @[@4, @2];
[self.view.layer addSublayer:shapeLayer];

Draw on UIView or GLKView?

2 Answers2