在标签上绘制自定义阴影

Question

I'm trying to achieve this kind of shadow, my research led me to using the CGPathRef to draw the shadow myself, but I can't figure out how it actually works.

Drawing the label.layer.shadowPath looks like a good plan, can anyone show me/point me to how I should proceed?

EDIT : I'm now to the point of trying to draw a UIBezierPath based on the string in the current label, the path being the actual shape of the shadow I need. I'm not sure that's the best option but it looks more promising.

EDIT 2 : Here is the code i'm now working with. this outlines the text of the label as an image, but it's pretty much the exact same text as the label itself, i still have to work my way around making it look like a shadow. Note, we're using Xamarin

public override void Draw (CoreGraphics.CGRect rect)
        {
            base.Draw (rect);
            using (CGContext g = UIGraphics.GetCurrentContext ()) {

                UIBezierPath completePath = UIBezierPath.Create ();

                g.ScaleCTM (1, -1);
                g.TranslateCTM (2, -(this.Bounds.Height / 2) - (this.Font.LineHeight / 3));

                CTLine line = new CTLine (this.AttributedText);
                CTRun[] runs = line.GetGlyphRuns ();

                for (int i = 0; i < runs.Length; i++) {

                    CTRun run = runs [i];
                    CTFont font = run.GetAttributes ().Font;

                    for (int j = 0; j < run.GlyphCount; j++) {

                        NSRange currentRange = new NSRange (j, 1);
                        CGPoint[] positions = run.GetPositions (currentRange); 
                        ushort[] glyphs = run.GetGlyphs (currentRange);

                        CGPath letter = font.GetPathForGlyph (glyphs [0]);
                        CGAffineTransform transform = CGAffineTransform.MakeTranslation (positions [0].X, positions [0].Y);

                        CGPath path = new CGPath (letter, transform);
                        UIBezierPath newPath = UIBezierPath.FromPath (path);
                        completePath.AppendPath (newPath);
                    }
                }


                completePath.LineWidth = 1;

                UIColor.Red.SetStroke ();
                UIColor.Blue.SetFill ();
                completePath.Stroke ();
                completePath.Fill ();


                completePath.ClosePath ();

                //Here I will try to loop over my current points and go down & right at every step of the loop, see how it goes performance-wise. Instead of one complex drawing I'll just have a very simple drawing that has thousands of points :o
                g.AddPath (completePath.CGPath);
                g.DrawPath (CGPathDrawingMode.FillStroke);

            }

Answer 1

There is no built in way to achieve this effect. You have to implement the drawing code on your own.

Here are two ideas to create the shadow:

• Draw the text in dark blue color, repeated n times, starting from the original position in 0.5 pt. steps shifted down right. This has bad performance but is really easy to implement.

• Find the text outline using Core Text and implement some algorithm that creates the actual outline of the shadow. This could then be used as the shadowPath property.