You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+35-21Lines changed: 35 additions & 21 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -16,7 +16,7 @@ A collection of SwiftUI tools to help with layout.
16
16
-[Frame Adjustment](#frame-adjustment) tools like [`WidthReader`](#widthreader), [`HeightReader`](#heightreader), [`onSizeChange(perform:)`](#onsizechangeperform), [`keyboardHeight`](#keyboardHeight), [`.relativePadding`](#relativepaddingedges-lengthfactor), [`ScaledView`](#scaledview) and [`OverlappingImage`](#overlappingimage).
17
17
-[unclippedTextRenderer](#unclippedtextrenderer) for fixing clipped `Text`.
18
18
-[`SmartScrollView`](#smartscrollview) with optional scrolling, a content-fitable frame, and live edge inset values.
19
-
-[`TwoSidedView`](#twosidedview) and [`FlippingView`](#flippingview) for making flippable views with a different view on the back side.
19
+
-[`FlippingView`](#flippingview) and [`rotation3DEffect(back:)`](#rotation3deffectback) for making flippable views with a different view on the back side.
20
20
-[`TabMenu`](#tabmenu), a customizable iOS tab menu with `onReselect` and `onDoubleTap` functions.
- If placed directly inside a NavigationView with a resizing header, this view may behave strangely when scrolling. To avoid this add 1 point of padding just inside the NavigationView.
368
368
- If the available space for this view grows for any reason other than screen rotation, this view might not grow to fill the space.
369
369
370
-
## TwoSidedView
370
+
## FlippingView
371
+
372
+
### FlippingView
373
+
A two-sided view that can be flipped by tapping or swiping.
374
+
375
+
The axis, anchor, perspective, drag distance to flip, animation for tap to flip and more can all be customized.
376
+
377
+
For visionOS a slightly different initializer might be needed and the flips will occur in 3d space. If instead you want a perspective effect on a flat view you can use `PerspectiveFlippingView`
Renders a view’s content as if it’s rotated in three dimensions around the specified axis with a closure containing a different view to show on the back.
Renders a view’s content as if it’s rotated in three dimensions around the specified axis with a closure containing a different view to show on the back. The view is not actually rotated in 3d space.
387
-
402
+
Rotates this view’s rendered output in three dimensions around the given axis of rotation with a closure containing a different view on the back. A minimum thickness that offsets the two views is required to ensure the side facing the user renders on top.
Rotates this view’s rendered output in three dimensions around the given axis of rotation with a closure containing a different view on the back. A minimum thickness that offsets the two views is required to ensure the side facing the user renders on top.
412
+
Renders a view’s content as if it’s rotated in three dimensions around the specified axis with a closure containing a different view to show on the back. The view is not actually rotated in 3d space.
413
+
398
414
```swift
399
415
Color.blue.overlay(Text("Front"))
400
416
.rotation3DEffect(angle) {
401
417
Color.red.overlay(Text("Back"))
402
418
}
403
419
```
404
420
405
-
406
-
### FlippingView
407
-
A two-sided view that can be flipped by tapping or swiping.
408
-
409
-
The axis, anchor, perspective, drag distance to flip, animation for tap to flip and more can all be customized.
410
-
411
-
```swift
412
-
FlippingView(flips: $flips) {
413
-
Color.blue.overlay(Text("Up"))
414
-
} back: {
415
-
Color.red.overlay(Text("Back"))
416
-
}
417
-
```
418
-
419
421
## TabMenu
420
422
*\*iOS only*
421
423
@@ -523,6 +525,7 @@ If you like the SwiftUI `Layout` protocol but you need to target an older OS tha
523
525
An `FULayout` will work in the same way as a SwiftUI `Layout`. The main difference is it will require a `maxWidth` or `maxHeight` parameter when initializing in order to know the available space. This can be provided by `GeometryReader` or with [`WidthReader`](#widthreader) or [`HeightReader`](#heightreader) from this package.
An `FULayout` uses `callAsFunction()` with a view builder so you can use it just like a SwiftUI `Layout`.
527
530
528
531
```swift
@@ -535,6 +538,7 @@ VFlow(maxWidth: 200) {
535
538
*Caution: This method uses Apple's private protocol `_VariadicView` under the hood. There is a small risk Apple could change the implementation so if this concerns you, use method 2 below.*
The [`FULayout`](#fulayout) equivalent of [`HFlowLayout`](#hflowlayout).
550
555
551
556
A FrameUp `FULayout` that arranges views in horizontal rows flowing from one to the next with adjustable horizontal and vertical spacing and support for horiztonal and vertical alignment including a justified alignment that will space elements in completed rows evenly.
The [`FULayout`](#fulayout) equivalent of [`VFlowLayout`](#vflowlayout).
567
573
568
574
A FrameUp `FULayout` that arranges views in vertical columns flowing from one to the next with adjustable horizontal and vertical spacing and support for horiztonal and vertical alignment including a justified alignment that will space elements in completed columns evenly.
The [`FULayout`](#fulayout) equivalent of [`LayoutThatFits`](#layoutthatfits).
616
625
617
626
An `FULayout` that picks the first provided layout that will fit the content in the provided maxWidth, maxHeight, or both. This is most helpful when switching between `HStackFULayout` and `VStackFULayout` as the content only needs to be provided once and will even animate when the stack changes.
The [`FULayout`](#fulayout) equivalent of SwiftUI `ViewThatFits`.
635
645
636
646
An `FULayout` that presents the first view that fits the provided maxWidth, maxHeight, or both depending on which parameters are used.
@@ -656,15 +666,19 @@ WidthReader { width in
656
666
Alternative stack layouts that can be wrapped in [`AnyFULayout`](#anyfulayout) and then toggled between with animation. Useful when you want to toggle between VStack and HStack based on available space.
0 commit comments