Awesome
SwiftUI
Examples
<img align="left" src="Previews/animatable-cards.gif" width="280">
About
Examples projects using SwiftUI
& Combine
.
Include Layout, UI, Animations, Gestures, Draw and Data.
See projects files in Files
& Other Projects
folders. If you have project, make a pull request or create issue with link to repo.
Interested in UI and animations in UIKit
?
See awesome-ios-ui pack with UI elements.
If you like the project, don't forget to put star ★
and follow me on GitHub:
Community
<p float="left"> <a href="https://twitter.com/sparrowcode_en"> <img src="https://cdn.sparrowcode.io/github%2Fbadges%2Ftwitter.png?version=4" height="52"> </a> <a href="https://t.me/sparrowcode_en"> <img src="https://cdn.sparrowcode.io/github/badges/telegram.png?version=1" height="52"> </a> <a href="https://mastodon.social/@sparrowcode_en"> <img src="https://cdn.sparrowcode.io/github/badges/mastodon.png?version=2" height="52"> </a> <a href="#apps-using"> <img src="https://cdn.sparrowcode.io/github/badges/download-on-the-appstore.png?version=4" height="52"> </a> </p>Navigate
Other projects
- Transition And Blur
- 2048 Game
- SFSymbols
- Calculator
- Creating And Combining Views
- Building Lists And Navigation
- Handling User Input
- WWDCPlayer
- Composing Complex Interfaces
- Working With UIControls
- Example To-Do App
- iPadOS Scenes
- Combine using GitHub API
- Async image loading
- Interfacing With UIKit
- GitHub Search
- Time Travel
- Drawing Paths And Shapes
- Animating Views And Transitions
- Jike
- Flux
- PureGenius
- SwiftUI Download Progress View
- SwiftUI SideMenu
- SwiftUI Currency App
- SwiftUI Weather App
- DesignCode SwiftUI App
- SwiftUI SlideToOpen
- Currency Converter & Calculator
- FlipClock-SwiftUI
- Countdown Film Clutter
- SpotlightSearch
- Growing text view in SwiftUI
- Calculator Clone for iPadOS
- MGFlipView
Also include:
- Movie
- InstaFake
- TempusRomanumII
- SwiftUI + Redux
- React Meets SwiftUI
- Webview
- UINote
- SplitView
- Card Animation
Animatable Cards
<img align="left" src="Previews/animatable-cards.gif" width="280">3D
For add 3D rotation for back cards use code:
.rotation3DEffect(
Angle(degrees: dragState.isActive ? 0 : 60), axis: (x: 10.0, y: 10.0, z: 10.0)
)
For medium card use 30 angles.
Animation
In preview I am use Spring
animation for all cards:
.animation(.spring())
Area to Card
<img align="left" src="Previews/area-to-card.gif" width="280">SFSymbols
For button using SFSymbols
pack with ready-use icons. Also support customisable weight:
Image(systemName: show ? "slash.circle.fill" : "slash.circle")
.font(Font.title.weight(.semibold))
Button
For change state using @State
as property:
@State var show = false
Transition And Blur
<img src="Resources/TransitionBlur.png" width="700">2048 Game
<img src="Resources/2048game.png" width="800">SFSymbols
<img src="Resources/SFSymbols.gif" width="700">Calculator
<img src="Resources/Calculator.png" width="250">Creating And Combining Views
<img src="Resources/CreatingAndCombiningViews.png" width="650">Building Lists And Navigation
<img src="Resources/BuildingListsAndNavigation.png" width="650">WWDCPlayer
<img src="Resources/WWDCPlayer.png" width="260">Handling User Input
<img src="Resources/HandlingUserInput.png" width="650">Composing Complex Interfaces
<img src="Resources/ComposingComplexInterfaces.png" width="650">Working With UIControls
<img src="Resources/WorkingWithUIControls.png" width="650"> <img src="Resources/WorkingWithUIControls2.png" width="650">Example To-Do App
<img src="Resources/ExampleToDoApp.png" width="850">iPadOS Scenes
<img src="Resources/iPadOSScenes.jpeg" width="600">Combine using GitHub API
<img src="Resources/CombineUsingGitHubAPI.png" width="260">Async image loading
<img src="Resources/AsyncImageLoading.gif" width="250">Interfacing With UIKit
<img src="Resources/InterfacingWithUIKit.png" width="650">GitHub Search
<img src="Resources/GitHubSearch.png" width="270">Time Travel
<img src="Resources/TimeTravel.gif" width="250">Drawing Paths And Shapes
<img src="Resources/DrawingPathsAndShapes.png" width="650">Animating Views And Transitions
<img src="Resources/AnimatingViewsAndTransitions.png" width="650">Jike
<img src="Resources/Jike.png" width="750">Flux
<img src="Resources/Flux.gif" width="260">PureGenius
<img src="Resources/PureGenius.gif" width="260">SwiftUIDownloadView
<img src="Resources/SwiftUIDownloadView.gif" width="294">SwiftUI SideMenu
<img src="Resources/SwiftUISideMenu.gif" width="300">SwiftUI Currency
<img src="Resources/SwiftUICurrency.png" width="300">SwiftUI Weather
<img src="https://github.com/bpisano/Weather/blob/master/Images/Banner.png" width="650">DesignCode SwiftUI
<img src="https://github.com/mythxn/DesignCode-SwiftUI/blob/master/preview.gif" height=450><img src="https://i.imgur.com/N9HfWdD.png" height=450>
MTSlideToOpen-SwiftUI
<a href="url"><img src="https://raw.githubusercontent.com/lemanhtien/MTSlideToOpen-SwiftUI/master/example.gif" align="center" height="500" ></a>
Currency Converter & Calculator
<img src="https://github.com/CurrencyConverterCalculator/iosCCC/blob/master/dark.gif" width="320px"/> <img src="https://github.com/CurrencyConverterCalculator/iosCCC/blob/master/light.gif" width="320px"/>
FlipClock-SwiftUI
Light | Dark |
---|---|
<img src="https://github.com/elpassion/FlipClock-SwiftUI/blob/master/Gifs/flip_clock_light.gif" width="260"> | <img src="https://github.com/elpassion/FlipClock-SwiftUI/blob/master/Gifs/flip_clock_dark.gif" width="260"> |
CountdownFilmClutter-SwiftUI
<img src="https://github.com/elpassion/CountdownFilmClutter-SwiftUI/blob/master/Gifs/countdown_film_clutter.gif">SpotlightSearch
Light | Dark |
---|---|
<img src="https://github.com/boraseoksoon/SpotlightSearch/blob/master/gif/white_theme.gif" width="260"> | <img src="https://github.com/boraseoksoon/SpotlightSearch/blob/master/gif/dark_theme.gif" width="260"> |
SwiftUI Weather App with MVVM and CoreML
<img src="https://user-images.githubusercontent.com/1447937/72296817-96f10580-366b-11ea-957c-023efeac958f.png" width="300">Growing text view in SwiftUI
<img src="https://github.com/Zaprogramiacz/GrowingTextView/blob/master/Resources/growing_text_view.gif">MGFlipView
<img src="https://github.com/Zaprogramiacz/MGFlipView/blob/master/Examples/flip_view_example.gif">Authors
Thanks for Jinxiansen, ra1028, timdonnelly, TwoLivesLeft, devxoul, cmtrounce, unixzii, ra1028 for examples project.
Other Projects
I love being helpful. Here I have provided a list of libraries that I keep up to date. For see video previews
of libraries without install open opensource.ivanvorobei.by website.<br>
I have libraries with native interface and managing permissions. Also available pack of useful extensions for boost your development process.
Russian Community
Подписывайся в телеграмм-канал, если хочешь получать уведомления о новых туториалах.<br> Со сложными и непонятными задачами помогут в чате.
<p float="left"> <a href="https://tutorials.ivanvorobei.by/telegram/channel"> <img src="https://github.com/ivanvorobei/Readme/blob/main/Buttons/open-telegram-channel.svg"> </a> <a href="https://tutorials.ivanvorobei.by/telegram/chat"> <img src="https://github.com/ivanvorobei/Readme/blob/main/Buttons/russian-community-chat.svg"> </a> </p>Видео-туториалы выклыдываю на YouTube: