88<p align =" center " >💨 Custom, built-in transitions, animations for views</p >
99<p align =" center " >💻 Cross-platform support on both iOS and macOS</p >
1010
11-
12-
13-
14-
15-
16-
17-
1811***
1912
2013⚠️ ** Note:** This package is still under development and its contents are freely subject to change.
@@ -72,27 +65,27 @@ MyView().roundedBorder(.red, cornerRadius: 5.0, lineWidth: 2.0)
7265## Completed Features
7366
7467- App Layout
75- - Pre-defined spacing values [ →]
76- - Layout using Generic Stack
77- - Layout using Shove View
78- - Fixed-width spacers
68+ - Pre-defined spacing values [ →] ( )
69+ - Layout using Generic Stack [ → ] ( )
70+ - Layout using Shove View [ → ] ( )
71+ - Fixed-width spacers [ → ] ( )
7972- View Functionality
80- - Operations on views
81- - View frame modifiers
82- - View refresh modifier
83- - View styling modifiers
84- - Custom animation/transitions
85- - Debugging view modifier
86- - Screenshot view method
87- - Hover tooltip modifier (macOS)
88- - View mouse position checking (macOS)
73+ - Operations on views [ → ] ( )
74+ - View frame modifiers [ → ] ( )
75+ - View refresh modifier [ → ] ( )
76+ - View styling modifiers [ → ] ( )
77+ - Custom animation/transitions [ → ] ( )
78+ - Debugging view modifier [ → ] ( )
79+ - Screenshot view method [ → ] ( )
80+ - Hover tooltip modifier (macOS) [ → ] ( )
81+ - View mouse position checking (macOS) [ → ] ( )
8982- Other Features
90- - Image modifiers
91- - Color features
92- - Quick dividers
93- - Visual effects
94- - Pre-made buttons
95- - Action item highlight modifier
83+ - Image modifiers [ → ] ( )
84+ - Color features [ → ] ( )
85+ - Quick dividers [ → ] ( )
86+ - Visual effects [ → ] ( )
87+ - Pre-made buttons [ → ] ( )
88+ - Action item highlight modifier [ → ] ( )
9689
9790Most of the above features are ** cross-platform** and are supported on both iOS and macOS.
9891
@@ -103,3 +96,59 @@ Add **ShinySwiftUI** to your project using Swift Package Manager:
10396```
10497https://github.com/Flowductive/shiny-swift-ui
10598```
99+
100+ ## 📐 App Layout Features
101+
102+ ### Pre-defined spacing values
103+
104+ Improve code consistency with ` CGFloat ` spacing values:
105+
106+ ``` swift
107+ MyView ().padding (.m ).cornerRadius (.xs )
108+ ```
109+
110+ These values include: ` .xxs ` , ` .xs ` , ` .s ` , ` .m ` , ` .l ` . ` .xl ` , and ` .xxl ` .
111+
112+ ### Layout using Generic Stack
113+
114+ You can use a generic stack, or ` GStack ` , to position items vertically or horizontally using a ` Bool ` input:
115+
116+ ``` swift
117+ GStack (platform == .iOS ? .vertical : .horizontal ) {
118+ MyViewA ()
119+ MyViewB ()
120+ }
121+ ```
122+
123+ A typical use case of ` GStack ` is for changing display layout on macOS vs. iOS devices.
124+
125+ ### Layout using Shove View
126+
127+ Use a ` ShoveView ` to quickly push inner content to one side/corner:
128+
129+ ``` swift
130+ // Position MyView right
131+ ShoveView (.trailing ) {
132+ MyView ()
133+ }
134+
135+ // Position MyView top-left
136+ ShoveView (.topLeading ) {
137+ MyView ()
138+ }
139+ ```
140+
141+ ### Fixed-width spacers
142+
143+ Use fixed-width spacers for consistent spacing:
144+
145+ ``` swift
146+ // Large vertical spacer
147+ Spacer.VL
148+
149+ // Extra-small vertical spacer
150+ Spacer.HXS
151+ ```
152+
153+ Vertical spacer variants include ` .VXXS ` , ` .VXS ` , ` .VS ` , ` .VM ` , ` .VL ` , ` .VXL ` , and ` .VXXL ` .
154+ Horizontal spacer variants include ` .HXXS ` , ` .HXS ` , ` .HS ` , ` .HM ` , ` .HL ` , ` .HXL ` , and ` .HXXL ` .
0 commit comments