Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/ksemianov/wrappinghstack
WrappingHStack (FlowLayout) is a SwiftUI component similar to HStack that wraps horizontally overflowing subviews onto the next lines.
https://github.com/ksemianov/wrappinghstack
components ios layout macos swift swiftui swiftui-components
Last synced: 6 days ago
JSON representation
WrappingHStack (FlowLayout) is a SwiftUI component similar to HStack that wraps horizontally overflowing subviews onto the next lines.
- Host: GitHub
- URL: https://github.com/ksemianov/wrappinghstack
- Owner: ksemianov
- License: mit
- Created: 2022-12-02T02:26:55.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-01-09T15:52:39.000Z (12 months ago)
- Last Synced: 2024-12-18T04:08:14.143Z (6 days ago)
- Topics: components, ios, layout, macos, swift, swiftui, swiftui-components
- Language: Swift
- Homepage:
- Size: 13.7 KB
- Stars: 220
- Watchers: 3
- Forks: 15
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# WrappingHStack
A SwiftUI component similar to `HStack` that wraps horizontally overflowing subviews onto the next lines.
* [Overview](#overview)
* [Examples](#examples)
* [Installation](#installation)
* [License](#license)## Overview
The library is based on the SwiftUI's `Layout` protocol and thus has the following deployment requirement:
> iOS 16.0+, iPadOS 16.0+, macOS 13.0+, Mac Catalyst 16.0+, tvOS 16.0+, watchOS 9.0+
The component's signature:
``` swift
WrappingHStack(alignment: Alignment = .center,
horizontalSpacing: CGFloat? = nil,
verticalSpacing: CGFloat? = nil,
fitContentWidth: Bool = false)
```The component, by default, uses the `.center` alignment, but also supports the following alignment values: `.center`, `.leading`, `.topLeading`, `.top`, `.topTrailing`, `.trailing`, `.bottomTrailing`, `.bottom`, `.bottomLeading`. The rest are treated as `.center`.
The component, by default, uses the system provided spacing, but it's also possible to specify explicit `horizontalSpacing` and `verticalSpacing`.
The component, by default, spans the entire available width. However, you can set `fitContentWidth` to `true` to make it adjust its width based on its content.
The component assumes that the largest subview fits into the bounds and there are no infinitely growing subviews. The component assumes that it can grow vertically as much as necessary to fit into the width constraint.
## Examples
An array of tags:
![WrappingHStack](https://user-images.githubusercontent.com/18328341/205410620-19e66e2c-6dc4-4354-9c6a-f25a3704b2ac.gif)
``` swift
WrappingHStack(alignment: .leading) {
ForEach(tags) {
Text($0.text)
.foregroundColor(Color.white)
.padding(.horizontal, $0.horizontalPadding)
.padding(.vertical, $0.verticalPadding)
.background(Color.gray)
.cornerRadius(16)
}
}
```## Installation
You can add WrappingHStack to an Xcode project by adding it as a package dependency.
> https://github.com/ksemianov/WrappingHStack
If you want to use WrappingHStack in a [SwiftPM](https://swift.org/package-manager/) project,
it's as simple as adding it to a `dependencies` clause in your `Package.swift`:``` swift
dependencies: [
.package(url: "https://github.com/ksemianov/WrappingHStack", from: "0.2.0")
]
```If you want to use WrappingHStack in a [CocoaPods](https://cocoapods.org) project,
add this line to your `Podfile`:``` ruby
'WrappingHStackLayout', '~> 0.2.0'
```## License
This library is released under the MIT license. See [LICENSE](LICENSE) for details.