Skip to content

Commit 9cc6a59

Browse files
cp-amisha-icp-amisha-i
authored
Update README.md
 * Update README.md
1 parent 9007916 commit 9cc6a59

18 files changed

+164
-19
lines changed

‎.DS_Store

6 KB
Binary file not shown.

‎GIF/.DS_Store

6 KB
Binary file not shown.

‎GIF/ClockAnimation.gif

134 KB
Loading

‎GIF/DotAnimation.gif

110 KB
Loading

‎GIF/HeartAnimation.gif

95.4 KB
Loading

‎GIF/PacmanAnimation.gif

171 KB
Loading

‎GIF/RotatingDotAnimation.gif

74 KB
Loading

‎GIF/StepperAnimation.gif

226 KB
Loading

‎GIF/ThreeBounceAnimation.gif

77.3 KB
Loading

‎GIF/TwinCircleAnimation.gif

236 KB
Loading

‎GIF/WaveAnimation.gif

400 KB
Loading

‎README.md

Lines changed: 85 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,88 @@
11
# Swiftui-animations-examples
2-
Cool animations implemented with SwiftUI
2+
Cool animations implemented with SwiftUI.
33

44
## 🚀 Showcase
5+
6+
<table>
7+
<tr>
8+
<td align="center">
9+
<img src="https://github.com/canopas/Swiftui-animations-examples/blob/add-readme/GIF/ClockAnimation.gif" width="250px" height="250px">
10+
<br />
11+
Clock
12+
</td>
13+
<td align="center">
14+
<img src="https://github.com/canopas/Swiftui-animations-examples/blob/add-readme/GIF/DotAnimation.gif" width="250px" height="250px">
15+
<br />
16+
Progress Dots
17+
</td>
18+
<td align="center">
19+
<img src="https://github.com/canopas/Swiftui-animations-examples/blob/add-readme/GIF/HeartAnimation.gif" width="250px" height="250px">
20+
<br />
21+
Jumping Heart
22+
</td>
23+
</tr>
24+
<tr>
25+
<td align="center">
26+
<img src="https://github.com/canopas/Swiftui-animations-examples/blob/add-readme/GIF/PacmanAnimation.gif" width="250px" height="250px">
27+
<br />
28+
Pacman
29+
</td>
30+
<td align="center">
31+
<img src="https://github.com/canopas/Swiftui-animations-examples/blob/add-readme/GIF/RotatingDotAnimation.gif" width="250px" height="250px">
32+
<br />
33+
Rotating Dot
34+
</td>
35+
<td align="center">
36+
<img src="https://github.com/canopas/Swiftui-animations-examples/blob/add-readme/GIF/StepperAnimation.gif" width="250px" height="250px">
37+
<br />
38+
Stepper Animation
39+
</td>
40+
</tr>
41+
<tr>
42+
<td align="center">
43+
<img src="https://github.com/canopas/Swiftui-animations-examples/blob/add-readme/GIF/ThreeBounceAnimation.gif" width="250px" height="250px">
44+
<br />
45+
Three Bounce Dot
46+
</td>
47+
<td align="center">
48+
<img src="https://github.com/canopas/Swiftui-animations-examples/blob/add-readme/GIF/TwinCircleAnimation.gif" width="250px" height="250px">
49+
<br />
50+
TwinCircle Transition
51+
</td>
52+
<td align="center">
53+
<img src="https://github.com/canopas/Swiftui-animations-examples/blob/add-readme/GIF/WaveAnimation.gif" width="250px" height="250px">
54+
<br />
55+
Wave Animation
56+
</td>
57+
</tr>
58+
<table>
59+
60+
61+
62+
For detailed information about implementation checkout [article 1](https://blog.canopas.com/animations-in-swiftui-with-examples-dfb616fe467f), [article 2](https://blog.canopas.com/ios-animations-in-swiftui-with-examples-part-2-980a2df69145) & [article 3](https://medium.com/canopas/animations-in-swiftui-with-examples-part-3-56411ae2ffe0).
63+
64+
65+
# Bugs and Feedback
66+
For bugs, questions and discussions please use the [Github Issues](https://github.com/canopas/Swiftui-animations-examples/issues).
67+
68+
# Credits
69+
This repository owned and maintained by the [Canopas team](https://canopas.com/). You can follow them on Twitter at [@canopassoftware](https://twitter.com/canopassoftware) for project updates and releases.
70+
71+
72+
# Licence
73+
74+
```
75+
Copyright 2022 Canopas Software LLP
76+
77+
Licensed under the Apache License, Version 2.0 (the "License");
78+
you may not use this file except in compliance with the License.
79+
You may obtain a copy of the License at
80+
81+
http://www.apache.org/licenses/LICENSE-2.0
82+
83+
Unless required by applicable law or agreed to in writing, software
84+
distributed under the License is distributed on an "AS IS" BASIS,
85+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
86+
See the License for the specific language governing permissions and
87+
limitations under the License.
88+
```

‎Shared/ClockAnimation.swift

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,6 @@ struct ClockAnimation: View {
1717
Circle()
1818
.stroke(.black, lineWidth: 2)
1919
.background(Circle().fill(.white))
20-
.frame(width: 150, height: 150, alignment: .center)
2120

2221
Line(type: .second)
2322
.stroke(Color.blue, style: StrokeStyle(lineWidth: 5.5, lineCap: .round, lineJoin: .round))
@@ -29,6 +28,7 @@ struct ClockAnimation: View {
2928
.rotationEffect(.degrees(startAnimation ? 360 : 0))
3029
.animation(.linear(duration: duration * 6).repeatForever(autoreverses: false), value: startAnimation)
3130
}
31+
.frame(width: 150, height: 150, alignment: .center)
3232
.onAppear {
3333
self.startAnimation.toggle()
3434
}
@@ -48,10 +48,7 @@ public struct Line: Shape {
4848
let center = CGPoint(x: rect.midX, y: rect.midY)
4949

5050
path.move(to: center)
51-
52-
let length = rect.width / 2
53-
path.addLine(to: CGPoint(x: rect.midX + (2 / .pi) * length * lineType.scale,
54-
y: rect.midY - (2 / .pi) * length * lineType.scale))
51+
path.addLine(to: CGPoint(x: rect.width * lineType.scale, y: rect.width * lineType.scale))
5552
return path
5653
}
5754
}
@@ -63,9 +60,9 @@ enum LineType {
6360
var scale: CGFloat {
6461
switch self {
6562
case .minute:
66-
return 0.25
67-
case .second:
6863
return 0.3
64+
case .second:
65+
return 0.2
6966
}
7067
}
7168
}

‎Shared/ContentView.swift

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -16,5 +16,3 @@ struct ContentView: View {
1616
.ignoresSafeArea()
1717
}
1818
}
19-
20-

‎Shared/TwinCircleAnimation.swift

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -14,26 +14,29 @@ struct TwinCircleAnimation: View {
1414

1515
var body: some View {
1616
ZStack {
17-
VStack{}.frame(width: 200, height: 200, alignment: .center)
17+
VStack{}
18+
.frame(width: 150, height: 150, alignment: .center)
1819
.background(Color.white)
1920
.cornerRadius(100.0)
20-
21-
VStack{}.frame(width: 100, height: 100, alignment: .center)
21+
22+
VStack{}
23+
.frame(width: 75, height: 75, alignment: .center)
2224
.background(color1)
2325
.cornerRadius(50)
2426
.scaleEffect(abs(tz) * 0.3 + 1)
2527
.offset(x: tz * 70, y: 0)
2628

27-
VStack{}.frame(width: 100, height: 100, alignment: .center)
29+
VStack{}
30+
.frame(width: 75, height: 75, alignment: .center)
2831
.background(color2)
2932
.cornerRadius(50)
3033
.scaleEffect(abs(tz) * 0.3 + 1)
3134
.offset(x: -tz * 70, y: 0)
32-
33-
}.frame(width: 200, height: 200)
34-
.onAppear {
35-
animate()
36-
}
35+
}
36+
.frame(width: 150, height: 150)
37+
.onAppear {
38+
animate()
39+
}
3740
}
3841

3942
func animate() {

‎SwiftUIAnimations.xcodeproj/project.pbxproj

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,6 +25,15 @@
2525
9BEE82C1287D4B200047462A /* PacmanAnimation.swift in Sources */ = {isa = PBXBuildFile; fileRef = 9BEE82BF287D4B200047462A /* PacmanAnimation.swift */; };
2626
9BEE82C3287D68380047462A /* TwinCircleAnimation.swift in Sources */ = {isa = PBXBuildFile; fileRef = 9BEE82C2287D68380047462A /* TwinCircleAnimation.swift */; };
2727
9BEE82C4287D68380047462A /* TwinCircleAnimation.swift in Sources */ = {isa = PBXBuildFile; fileRef = 9BEE82C2287D68380047462A /* TwinCircleAnimation.swift */; };
28+
D8017171293A313600F95578 /* HeartAnimation.gif in Resources */ = {isa = PBXBuildFile; fileRef = D8017168293A313600F95578 /* HeartAnimation.gif */; };
29+
D8017172293A313600F95578 /* ClockAnimation.gif in Resources */ = {isa = PBXBuildFile; fileRef = D8017169293A313600F95578 /* ClockAnimation.gif */; };
30+
D8017173293A313600F95578 /* RotatingDotAnimation.gif in Resources */ = {isa = PBXBuildFile; fileRef = D801716A293A313600F95578 /* RotatingDotAnimation.gif */; };
31+
D8017174293A313600F95578 /* DotAnimation.gif in Resources */ = {isa = PBXBuildFile; fileRef = D801716B293A313600F95578 /* DotAnimation.gif */; };
32+
D8017175293A313600F95578 /* TwinCircleAnimation.gif in Resources */ = {isa = PBXBuildFile; fileRef = D801716C293A313600F95578 /* TwinCircleAnimation.gif */; };
33+
D8017176293A313600F95578 /* WaveAnimation.gif in Resources */ = {isa = PBXBuildFile; fileRef = D801716D293A313600F95578 /* WaveAnimation.gif */; };
34+
D8017177293A313600F95578 /* StepperAnimation.gif in Resources */ = {isa = PBXBuildFile; fileRef = D801716E293A313600F95578 /* StepperAnimation.gif */; };
35+
D8017178293A313600F95578 /* ThreeBounceAnimation.gif in Resources */ = {isa = PBXBuildFile; fileRef = D801716F293A313600F95578 /* ThreeBounceAnimation.gif */; };
36+
D8017179293A313600F95578 /* PacmanAnimation.gif in Resources */ = {isa = PBXBuildFile; fileRef = D8017170293A313600F95578 /* PacmanAnimation.gif */; };
2837
D8B37187293731F20051A626 /* ThreeBounceAnimation.swift in Sources */ = {isa = PBXBuildFile; fileRef = D8B37186293731F20051A626 /* ThreeBounceAnimation.swift */; };
2938
D8B37188293731F20051A626 /* ThreeBounceAnimation.swift in Sources */ = {isa = PBXBuildFile; fileRef = D8B37186293731F20051A626 /* ThreeBounceAnimation.swift */; };
3039
D8B3718A29377BAD0051A626 /* RotatingDotAnimation.swift in Sources */ = {isa = PBXBuildFile; fileRef = D8B3718929377BAD0051A626 /* RotatingDotAnimation.swift */; };
@@ -46,6 +55,15 @@
4655
9BA95BEC282523A200A43D98 /* WaveAnimation.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = WaveAnimation.swift; sourceTree = "<group>"; };
4756
9BEE82BF287D4B200047462A /* PacmanAnimation.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = PacmanAnimation.swift; sourceTree = "<group>"; };
4857
9BEE82C2287D68380047462A /* TwinCircleAnimation.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TwinCircleAnimation.swift; sourceTree = "<group>"; };
58+
D8017168293A313600F95578 /* HeartAnimation.gif */ = {isa = PBXFileReference; lastKnownFileType = image.gif; path = HeartAnimation.gif; sourceTree = "<group>"; };
59+
D8017169293A313600F95578 /* ClockAnimation.gif */ = {isa = PBXFileReference; lastKnownFileType = image.gif; path = ClockAnimation.gif; sourceTree = "<group>"; };
60+
D801716A293A313600F95578 /* RotatingDotAnimation.gif */ = {isa = PBXFileReference; lastKnownFileType = image.gif; path = RotatingDotAnimation.gif; sourceTree = "<group>"; };
61+
D801716B293A313600F95578 /* DotAnimation.gif */ = {isa = PBXFileReference; lastKnownFileType = image.gif; path = DotAnimation.gif; sourceTree = "<group>"; };
62+
D801716C293A313600F95578 /* TwinCircleAnimation.gif */ = {isa = PBXFileReference; lastKnownFileType = image.gif; path = TwinCircleAnimation.gif; sourceTree = "<group>"; };
63+
D801716D293A313600F95578 /* WaveAnimation.gif */ = {isa = PBXFileReference; lastKnownFileType = image.gif; path = WaveAnimation.gif; sourceTree = "<group>"; };
64+
D801716E293A313600F95578 /* StepperAnimation.gif */ = {isa = PBXFileReference; lastKnownFileType = image.gif; path = StepperAnimation.gif; sourceTree = "<group>"; };
65+
D801716F293A313600F95578 /* ThreeBounceAnimation.gif */ = {isa = PBXFileReference; lastKnownFileType = image.gif; path = ThreeBounceAnimation.gif; sourceTree = "<group>"; };
66+
D8017170293A313600F95578 /* PacmanAnimation.gif */ = {isa = PBXFileReference; lastKnownFileType = image.gif; path = PacmanAnimation.gif; sourceTree = "<group>"; };
4967
D8B37186293731F20051A626 /* ThreeBounceAnimation.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ThreeBounceAnimation.swift; sourceTree = "<group>"; };
5068
D8B3718929377BAD0051A626 /* RotatingDotAnimation.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RotatingDotAnimation.swift; sourceTree = "<group>"; };
5169
D8B3718C293881970051A626 /* ClockAnimation.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ClockAnimation.swift; sourceTree = "<group>"; };
@@ -73,6 +91,7 @@
7391
isa = PBXGroup;
7492
children = (
7593
9B59C2C0280852520016F2F8 /* Shared */,
94+
D8017167293A313600F95578 /* GIF */,
7695
9B59C2CF280852530016F2F8 /* macOS */,
7796
9B59C2C9280852530016F2F8 /* Products */,
7897
);
@@ -114,6 +133,22 @@
114133
path = macOS;
115134
sourceTree = "<group>";
116135
};
136+
D8017167293A313600F95578 /* GIF */ = {
137+
isa = PBXGroup;
138+
children = (
139+
D8017168293A313600F95578 /* HeartAnimation.gif */,
140+
D8017169293A313600F95578 /* ClockAnimation.gif */,
141+
D801716A293A313600F95578 /* RotatingDotAnimation.gif */,
142+
D801716B293A313600F95578 /* DotAnimation.gif */,
143+
D801716C293A313600F95578 /* TwinCircleAnimation.gif */,
144+
D801716D293A313600F95578 /* WaveAnimation.gif */,
145+
D801716E293A313600F95578 /* StepperAnimation.gif */,
146+
D801716F293A313600F95578 /* ThreeBounceAnimation.gif */,
147+
D8017170293A313600F95578 /* PacmanAnimation.gif */,
148+
);
149+
path = GIF;
150+
sourceTree = "<group>";
151+
};
117152
/* End PBXGroup section */
118153

119154
/* Begin PBXNativeTarget section */
@@ -193,7 +228,16 @@
193228
isa = PBXResourcesBuildPhase;
194229
buildActionMask = 2147483647;
195230
files = (
231+
D8017171293A313600F95578 /* HeartAnimation.gif in Resources */,
232+
D8017176293A313600F95578 /* WaveAnimation.gif in Resources */,
233+
D8017172293A313600F95578 /* ClockAnimation.gif in Resources */,
234+
D8017178293A313600F95578 /* ThreeBounceAnimation.gif in Resources */,
235+
D8017177293A313600F95578 /* StepperAnimation.gif in Resources */,
236+
D8017179293A313600F95578 /* PacmanAnimation.gif in Resources */,
196237
9B59C2D5280852530016F2F8 /* Assets.xcassets in Resources */,
238+
D8017173293A313600F95578 /* RotatingDotAnimation.gif in Resources */,
239+
D8017174293A313600F95578 /* DotAnimation.gif in Resources */,
240+
D8017175293A313600F95578 /* TwinCircleAnimation.gif in Resources */,
197241
);
198242
runOnlyForDeploymentPostprocessing = 0;
199243
};

‎SwiftUIAnimations.xcodeproj/project.xcworkspace/xcuserdata/amisha.xcuserdatad/UserInterfaceState.xcuserstate

57.1 KB
Binary file not shown.

‎SwiftUIAnimations.xcodeproj/xcuserdata/amisha.xcuserdatad/xcschemes/xcschememanagement.plist

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<?xml version="1.0" encoding="UTF-8"?>
2+
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
3+
<plist version="1.0">
4+
<dict>
5+
<key>SchemeUserState</key>
6+
<dict>
7+
<key>SwiftUIAnimations (iOS).xcscheme_^#shared#^_</key>
8+
<dict>
9+
<key>orderHint</key>
10+
<integer>0</integer>
11+
</dict>
12+
<key>SwiftUIAnimations (macOS).xcscheme_^#shared#^_</key>
13+
<dict>
14+
<key>orderHint</key>
15+
<integer>1</integer>
16+
</dict>
17+
</dict>
18+
</dict>
19+
</plist>

0 commit comments

Comments
 (0)