Skip to content

Commit ff05389

Browse files
simibacsimibac
authored
Update README.md
1 parent d19c170 commit ff05389

File tree

1 file changed

+30
-50
lines changed

1 file changed

+30
-50
lines changed

‎README.md

+30-50
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,21 @@
11
# ConfettiSwiftUI
22

3-
<img src="https://img.shields.io/badge/PLATFORM-IOS%20|%20MACOS-lightgray?style=for-the-badge" />&nbsp;&nbsp;&nbsp;<img src="https://img.shields.io/badge/LICENSE-MIT-lightgray?style=for-the-badge" />&nbsp;&nbsp;&nbsp;<img src="https://img.shields.io/badge/MADE WITH-SWIFTUI-orange?style=for-the-badge" />
3+
![GitHub License](https://img.shields.io/github/license/simibac/ConfettiSwiftUI?logo=github)
4+
![Cocoapods platforms](https://img.shields.io/cocoapods/p/AFNetworking?logo=apple)
45

5-
### Customizable Confetti Animations in SwiftUI
66

77
<p align="center">
88
<img src="./Gifs/native_default_iphone.png" width="200" width="480"/>
99
</p>
1010

11-
## 🌄 Example
11+
Customize confetti animations.
12+
13+
- All elements are built with pure SwiftUI.
14+
- Select from default confetti shapes, emojis, SF Symbols or text.
15+
- Trigger the animation with one state change multiple times with a haptic feed back on each explosion.
16+
17+
18+
## 🌄 Examples
1219

1320
<p align="center">
1421
<img src="./Gifs/default.gif" width="150" />
@@ -17,30 +24,6 @@
1724
<img src="./Gifs/color.gif" width="150" />
1825
</p>
1926

20-
## 🔭 Overview
21-
22-
This is an open-source library to use with SwiftUI. It allows you to create and customize confetti animations.
23-
24-
- Built with pure SwiftUI.
25-
- Select from default confetti shapes or inject emojis as text.
26-
- Configure the radius and angles of the explosion.
27-
- Trigger animation with one state change multiple times.
28-
29-
## 🧭 Navigation
30-
31-
- [💻 Installation](#-installation)
32-
- [Swift Package Manager](#swift-package-manager)
33-
- [Manually](#manually)
34-
- [🧳 Requirements](#-requirements)
35-
- [🛠 Usage](#-usage)
36-
- [Parameters](#parameters)
37-
- [Configurator Application With Live Preview](#configurator-application-with-live-preview)
38-
- [Examples](#examples)
39-
- [👨‍💻 Contributors](#-contributors)
40-
- [✍️ Author](#-author)
41-
- [📃 License](#-license)
42-
- [📦 Projects](#-projects)
43-
4427
## 💻 Installation
4528

4629
### Swift Package Manager
@@ -74,13 +57,13 @@ import SwiftUI
7457

7558
struct ContentView: View {
7659

77-
@State private var counter: Int = 0
60+
@State private var trigger: Int = 0
7861

7962
var body: some View {
8063
Button("🎉") {
81-
counter += 1
64+
trigger += 1
8265
}
83-
.confettiCannon(counter: $counter)
66+
.confettiCannon(trigger: $trigger)
8467
}
8568
}
8669

@@ -90,7 +73,7 @@ struct ContentView: View {
9073

9174
| parameter | type | description | default |
9275
| ------------------ | -------------- | ----------------------------------------------------- | ---------------------------------------------------------------------------------------------------- |
93-
| counter | Binding<Int> | on any change of this variable triggers the animation | 0 |
76+
| trigger | Binding<Int> | on any change of this variable triggers the animation | 0 |
9477
| num | Int | amount of confettis | 20 |
9578
| confettis | [ConfettiType] | list of shapes and text | [.shape(.circle), .shape(.triangle), .shape(.square), .shape(.slimRectangle), .shape(.roundedCross)] |
9679
| colors | [Color] | list of colors applied to the default shapes | [.blue, .red, .green, .yellow, .pink, .purple, .orange] |
@@ -103,76 +86,77 @@ struct ContentView: View {
10386
| radius | CGFloat | explosion radius | 300.0 |
10487
| repetitions | Int | number of repetitions for the explosion | 1 |
10588
| repetitionInterval | Double | duration between the repetitions | 1.0 |
89+
| hapticFeedback | Bool | haptic feedback on each confetti explosion | true |
10690

10791
### Configurator Application With Live Preview
10892

109-
You can use the configurator app in [demo project here](https://github.com/simibac/ConfettiSwiftUIDemo) to make your desired animation or get inspired by one of the many examples.
93+
You can use the configurator app in [demo project here](https://github.com/simibac/ConfettiSwiftUIDemo) to configure your desired animation or get inspired by one of the many examples.
11094

11195
<p align="center">
11296
<img src="./Gifs/configurator.png" width="150" />
11397
<img src="./Gifs/examples.png" width="150" />
11498
</p>
11599

116-
### Examples
100+
### Configuration Examples
117101

118-
#### Color and Size Configuration
102+
#### Color and Size
119103

120104
<p align="center">
121105
<img src="./Gifs/color.gif" width="150" />
122106
</p>
123107

124108
```swift
125-
.confettiCannon(counter: $counter, colors: [.red, .black], confettiSize: 20)
109+
.confettiCannon(trigger: $trigger, colors: [.red, .black], confettiSize: 20)
126110
```
127111

128-
#### Repeat Configuration
112+
#### Repeat
129113

130114
<p align="center">
131115
<img src="./Gifs/repeat.gif" width="150" />
132116
</p>
133117

134118
```swift
135-
.confettiCannon(counter: $counter, repetitions: 3, repetitionInterval: 0.7)
119+
.confettiCannon(trigger: $trigger, repetitions: 3, repetitionInterval: 0.7)
136120
```
137121

138-
#### Firework Configuration
122+
#### Firework
139123

140124
<p align="center">
141125
<img src="./Gifs/explosion.gif" width="150" />
142126
</p>
143127

144128
```swift
145-
.confettiCannon(counter: $counter, num: 50, openingAngle: Angle(degrees: 0), closingAngle: Angle(degrees: 360), radius: 200)
129+
.confettiCannon(trigger: $trigger, num: 50, openingAngle: Angle(degrees: 0), closingAngle: Angle(degrees: 360), radius: 200)
146130
```
147131

148-
#### Emoji Configuration
132+
#### Emoji
149133

150134
<p align="center">
151135
<img src="./Gifs/heart.gif" width="150" />
152136
</p>
153137

154138
```swift
155-
.confettiCannon(counter: $counter, confettis: [.text("❤️"), .text("💙"), .text("💚"), .text("🧡")])
139+
.confettiCannon(trigger: $trigger, confettis: [.text("❤️"), .text("💙"), .text("💚"), .text("🧡")])
156140
```
157141

158-
#### Endless Configuration
142+
#### Endless
159143

160144
<p align="center">
161145
<img src="./Gifs/constant.gif" width="150" />
162146
</p>
163147

164148
```swift
165-
.confettiCannon(counter: $counter, num:1, confettis: [.text("💩")], confettiSize: 20, repetitions: 100, repetitionInterval: 0.1)
149+
.confettiCannon(trigger: $trigger, num:1, confettis: [.text("💩")], confettiSize: 20, repetitions: 100, repetitionInterval: 0.1)
166150
```
167151

168-
#### Make-it-Rain Configuration
152+
#### Make-it-Rain
169153

170154
<p align="center">
171155
<img src="./Gifs/make-it-rain.gif" width="150" />
172156
</p>
173157

174158
```swift
175-
.confettiCannon(counter: $counter, num:1, confettis: [.text("💵"), .text("💶"), .text("💷"), .text("💴")], confettiSize: 30, repetitions: 50, repetitionInterval: 0.1)
159+
.confettiCannon(trigger: $trigger, num:1, confettis: [.text("💵"), .text("💶"), .text("💷"), .text("💴")], confettiSize: 30, repetitions: 50, repetitionInterval: 0.1)
176160
```
177161

178162

@@ -182,17 +166,13 @@ You can use the configurator app in [demo project here](https://github.com/simib
182166
</p>
183167

184168
```swift
185-
.confettiCannon(counter: $counter8, confettis: [.image("arb"), .image("eth"), .image("btc"), .image("op"), .image("link"), .image("doge")], confettiSize: 20)
169+
.confettiCannon(trigger: $trigger8, confettis: [.image("arb"), .image("eth"), .image("btc"), .image("op"), .image("link"), .image("doge")], confettiSize: 20)
186170
```
187171

188172
## 👨‍💻 Contributors
189173

190174
All issue reports, feature requests, pull requests and GitHub stars are welcomed and much appreciated.
191175

192-
## ✍️ Author
193-
194-
Simon Bachmann
195-
196176
## 🔨Support
197177

198178
If you like the project, don't forget to `put star 🌟`.

0 commit comments

Comments
 (0)