Search code examples
gridviewxamarinxamarin.iosuibuttondotted-line

Xamarin IOS - Insert a dotted line between 2 UIButtons


I'm Struggling to insert a dotted line between buttons similar to a GridView with buttons.

Is there anything predefined in the API given by the IOS for Xamarin that solves this?

Thanks in advance


Solution

  • Use a UIView subclass to contain your line drawing so you can apply constraints and align it to the other Views.

    In a UIView subclass, override the Draw method:

    public override void Draw(CGRect rect)
    {
        var path = new UIBezierPath();
        path.MoveTo(new CGPoint(Bounds.Size.Width / 2, 0));
        path.AddLineTo(new CGPoint(Bounds.Size.Width / 2, Bounds.Size.Height));
        path.LineWidth = 6;
    
        var dashes = new []{ 0 , path.LineWidth * 2 };
        path.SetLineDash(dashes, 0, dashes.Length, 0);
        path.LineCapStyle = CGLineCap.Round;
    
        (UIColor.White).SetStroke();
        path.Stroke();
    }
    

    Re: I've been using dotted-line technique for awhile, it is from this SO Answer

    In combining this View with the answer from this SO question, you can create:

    enter image description here