Awesome
<p align="center"> <img src="ShapesLogo.svg"/> </p> <p align="center"> <img src="https://img.shields.io/badge/platforms-iOS_13_|macOS_10.15_| watchOS_6.0-blue.svg" alt="SwiftUI" /> <img src="https://img.shields.io/badge/Swift-5.1-orange.svg" alt="Swift 5.1" /> <img src="https://img.shields.io/badge/SwiftPM-compatible-green.svg" alt="Swift 5.1" /> <img src="https://img.shields.io/github/followers/kieranb662?label=Follow" alt="kieranb662 followers" /> </p>Commonly used shapes for SwiftUI, some I found on the web swiftui-lab and objc.io, others I made myself. I hope to create community based repo for cool animated shapes, paths, etc. If you would like to submit some of your own shapes just make a pull request and I will try to approve it ASAP. If you want to try out this package just clone the example project
Or create your own shapes using the bez editor app available for free on iOS 13.4 and greater.
<p align="center"> <a href="https://apps.apple.com/us/app/bez-editor/id1508764103"> <img width="300px" src="https://github.com/kieranb662/kieranb662.github.io/blob/master/assets/bezeditorPreview.gif"> </a> </p> <p align="center"> <img src="https://github.com/kieranb662/Shapes-Examples/blob/master/Media/ShapesCollage.PNG" > </p>-
AnyShape: A type erased
Shape -
Lines
LineHorizontalLineVerticalLineAdaptiveLine
-
Triangles
TriangleOpenTriangleRightTriangle
-
Graphing
CartesianGridTickMarksPolarGridRadialTickMarks
-
Misc
InfinitySymbolArrowPolygonPentagonPathTextFoldableShape
Lines
Line
Found at drawing trees. A Line defined by the from and to points.
<p align="center"> <img src="https://github.com/kieranb662/Shapes-Examples/blob/master/Media/Line.png" height=200/> </p>Horizontal
A horizontal line that is the width of its container has a single parameter
offset: A value between 0 and 1 defining the lines vertical offset in its container (Default: 0.5)
Vertical
A Vertical line that is the height of its container has a single parameter
offset: A value between 0 and 1 defining the line's horizontal offset in its container (Default: 0.5)
Adaptive
This shape creates a line centered inside of and constrained by its bounding box. The end points of the line are the points of intersection of an infinitely long angled line and the container rectangle
<p align="center"> <img src="https://github.com/kieranb662/Shapes-Examples/blob/master/Media/AdaptiveLine.gif" height=200/> </p>Triangles
The various triangles are shown below.
<p align="center"> <img src="https://github.com/kieranb662/Shapes-Examples/blob/master/Media/Triangles.png" height=500/> </p>Graphing
Cartesian Grid
A Rectangular grid of vertical and horizontal lines. Has two parameters
xCount: The number of vertical lines
yCount: The number of horizontal lines
Polar Grid
A grid made up of concentric circles and angled lines running through their center.
rCount: The number of Circles
thetaCount: The number of lines
TickMarks
Tick marks spaced out evenly with varying lengths dependent on the type of tick minor, semi, or major.
The shape has two parameters spacing: CGFloat and ticks: Int. The spacing is the distance between ticks while the ticks is the number of tick marks.
An examples using TickMarks are shown below
Misc
Arrow
An arrow that starts out small shaped like this |--| but as it grows larger it looks like this <---->
<p align="center"> <img src="https://github.com/kieranb662/Shapes-Examples/blob/master/Media/Arrows.gif" height=500/> </p>Pentagon
<p align="center"> <img src="https://github.com/kieranb662/Shapes-Examples/blob/master/Media/Pentagon.png" height=200/> </p>Foldable Shapes
<p align="center"> <img src="https://github.com/kieranb662/Shapes-Examples/blob/master/Media/FoldableShapes.gif" height=500/> </p>Contributing
If you have an idea for a shape but don't know how to describe it, try out the PathEditor tool that comes packaged with bez