Emboss effect in Core Graphics

Question

I am again here with two Question, both inter-related

I want to draw embossed lines with core graphics. Can any one suggest me how to give inner shadows to line drawn on touch events?
Even for drawing outer shadows. Shadow drawn overlaps in between. and line drawn with colors other than black is like worm.. Can any one help me? Following image illustrates what I mean to explain for Question 2: Shadows creates are not even. They darken at some points

I am adding the code that I am using to draw lines..

    for (int i=0; i<[currentPath count]; i++) 
    {
        CGPoint mid1 = [[self midPoint:[currentPath objectAtIndex:i+1]  :[currentPath objectAtIndex:i]] CGPointValue]; 
        CGPoint mid2 = [[self midPoint:[currentPath objectAtIndex:i+2] :[currentPath objectAtIndex:i+1]] CGPointValue];
        CGContextMoveToPoint(context, mid1.x, mid1.y);
        CGContextAddQuadCurveToPoint(context, [[currentPath objectAtIndex:i+1] CGPointValue].x, [[currentPath objectAtIndex:i+1] CGPointValue].y, mid2.x, mid2.y); 
        CGContextSetShadow(context, CGSizeMake(-2, -2), 3);

        CGContextSetLineCap(context, kCGLineCapRound);
        CGContextSetStrokeColorWithColor(context,[color CGColor]);              
        CGContextSetLineWidth(context, linewidth);              
        CGContextStrokePath(context);
        i+=2;
    }

Please show your drawing code. Until you do that we can only guess at what you are doing. — sosborn, Feb 27 '12 at 13:14
Its simple drawing code with core graphics. I m simply adding shadow to the lines.. — DivineDesert, Feb 28 '12 at 04:10
@DimplePanchal i m also facing the same problem . my code is same like yours but without for loop . i dont know why u r using loop ? what is your [currentPath count] ? please suggest me .. — Hitarth, Jun 22 '12 at 11:12
@DimplePanchal plz check my code on this http://stackoverflow.com/questions/11132546/how-to-erase-finger-paint-on-custom-uiview-in-iphone/11167098#11167098 ... and actual problem is that http://stackoverflow.com/questions/11155898/how-to-create-embossed-or-shadow-effects-using-core-graphics-for-finger-paint; — Hitarth, Jun 25 '12 at 04:33

score 4 · Accepted Answer · answered Feb 28 '12 at 05:58

I found my solution.. Problem was very silly... I was stoking path on every iteration which was creating the issue.. Now I can draw even with alpha less then 1..

CGContextStrokePath(context);

This line goes outside for loop.. And all is working fine now :)

score 3 · Answer 2 · answered Feb 28 '12 at 04:18

3

For your overlapping shadows, you want a transparency layer to composite them first. See Transparency Layers in the Quartz 2D Programming Guide.

answered Feb 28 '12 at 04:18

Rob Napier

286,113
34
456
610

The point u said is fine.. But where shall I add transparency layers.. Since I am drawing small lines on touch events.. Each lines cant be added to transparency layer.. I tried this earlier.. But with no positive solution.. If I was doing wrong then I don't know.. But my confusion is drawing transparency layers to whom?? – DivineDesert Feb 28 '12 at 05:03

score 0 · Answer 3 · answered Feb 27 '12 at 12:50

0

It looks like you are drawing the path by using a series of circles.

The trouble is that you have set the shadow on the individual dots, and that's why you are getting the strange effects.

A possible solution - dont put a shadow on the dots, put on the path: duplicate the line that you have drawn, draw it in a different colour, offset it and put in under your actual line.

Alternatively, if you are using layers - have a look at shadow paths.

answered Feb 27 '12 at 12:50

Abizern

146,289
39
203
257

1

I am not drawing the path by using a series of circles,Since I am adding shadow to lines, and lines are drawn with array of points, each small line is covered with shadow and thus u can see series of circles.. – DivineDesert Feb 27 '12 at 12:51
This is similar to the effect which I was getting when I was drawing lines with alpha values less than 1.. @Abizern – DivineDesert Feb 27 '12 at 12:55

Emboss effect in Core Graphics

3 Answers3