SwiftUI contains a clever mechanism for adding toolbar actions. With one view modifier - toolbar, we can control toolbar items in different places of the application. It doesn’t matter that you want to add a toolbar to the macOS navigation bar, iOS navigation bar, or iOS bottom bar; you will …
Animations are a crucial but often neglected part of good UI. Correctly used can guide used in the app. In this article, you will learn how to make a list cell that expands on tap and apply animation to it. We will create a simple Todo List with subtasks. Models First of all, let’s make a …
If you are using defaults colors for text and backgrounds, iOS/macOS handles dark mode literary by itself. But sometimes, you want to go with your style to make a brand more appealing or differentiate from the competition. Adjusting to dark mode required more work then, but still, the framework …
Pull to Refresh is a widespread UX pattern on mobile. Drag a list down and load new items. You can find that in all social media applications and almost all other apps that display data download from servers. To achieve this in previous versions of SwiftUI, you will have to use UIKit code, create …
Each WWDC brings lots of new goods for all Apple ecosystem developers. The 2021 edition wasn’t different. AsyncImage view is a new SwiftUI addition that expects a URL instead of an asset to display images. Read further to learn how to use it. Displaying images from the web is a widespread task …
Button, as one of the most common UI elements, is used for versatile sets of actions. But actions can have a different level of importance. Sometimes you want to highlight the primary activity or mark the destructive one in red. You can do this by wrapping the Button view in a custom view, but …
When you are scaling up (and down) a small image in SwiftUI, there is an operation called interpolation. The size of a current image pixel is calculated based on neighbor pixels. It gave a more natural and better-looking effect, but it also means that the image appears blurry (look at the first …
If you are an iOS or macOS user, you have seen alerts many times. Alerts are components that inform you about some errors or ask about some destructive actions. It would be best if you were careful not to overuse them in your app because it may distract users. SwiftUI offers a structure that makes …
SwiftUI offers an easy way to inject your model classes into a view hierarchy. Additionally, it handles model changes pretty automatically, and only a tiny amount of additional code is needed from your side. In this article, I’ll explain how to provide and retrieve @EnvironmentObject anywhere …
Swift (SwiftUI in particular) commonly uses property wrappers to make repeatable operations easier. For example, the @State is used for observing and storing view state, and @AppStorage to store app parameters using local persistence. Learn how to use AppStorage to access UserDefaults in SwiftUI. …
In your SwiftUI applications, you will often use the Button view. This interactive control is used to build simple user inputs. But in this article, you will learn how to disable buttons. Think about a situation as follow - you have three different options, but some of them are only active when the …
List view is a container that can present a scrollable list of views in SwiftUI. You can adjust its look, and it supports versatile actions and change its style depending on the platform. This article will learn how to use the List to display navigation links, data from an array and use ForEach and …
One of the biggest arguments in favor of using SwiftUI in production apps is the interoperability of UIKit. If you have a problem with achieving something with pure SwiftUI, you can always use UIViewRepresentable to wrap UIKit view and put it in the SwiftUI app only in dozen lines of code. How to do …
Rounded corners, like many other things in SwiftUI, can be added in few different ways. In this article, you will learn the simples one and one more sophisticated that you may find helpful in some circumstances. Let’s start. ViewModifier The easiest way to add rounded corners to any view is by …
You can style SwiftUI Text views with a bunch of dedicated ViewModifiers. Learn about them in this article. How to apply italic text style? You can switch the font to cursive using the italic modifier. Text("italic") .italic() How to apply bold text style? The bold view modifier will make …
Swipeable pages, often used for application onboardings, can be easily made using SwiftUI TabView. In this tutorial, you will learn how to create a view like the one presented in the (low-quality) GIF below. When you see TabView's name, the first you may think is a tab bar navigation like the one …
ZStack is one of the basic building blocks of SwiftUI applications. Along with HStack and VStack, you will use them frequently. This article will explain what ZStack is and how to use it to build a crucial part of every chat UI - a chat bubble. So what is this view with the strange name ZStack? …
I saw the “How to optionally make a Text italic?” question on Reddit, and I thought it would be good material for a short article. From this tutorial, you will learn how to prepare a conditional italic modifier. Additionally, you will find out how to make more generic modifiers to …
By default, @AppStorage property wrapper supports Int, String, Double, Data, or URL values. You can store other classes/structs/enums if you make them conform to the RawRepresentable protocol. This tutorial will learn how to keep Dates in UserDefaults handled by @AppStorage. Learn basics of …
SwiftUI views in larger applications may use some configuration passed to them as environment objects. It is a very beneficial way when the config is needed somewhere deep into a view tree. If your view uses the @EnvironmentObject property wrapper, you can still debug and tweak it using live preview …
A long-press or force touch on the iOS app icon brings a menu called home screen Quick Actions. Developers can put up to 4 buttons there for compelling, high-value tasks. It is a UIKit functionality, but you can use that in your SwiftUI app, too. How to add Quick Action? There are two kinds of quick …
One of the most significant advantages of cross-platform frameworks like React Native or Flutter is hot reloading. During development, you can see recent code changes without recompiling and rebuilding. SwiftUI offers a similar but somehow limited functionality called live preview. It works only for …
WWDC20 SwiftUI updates straight forwards UserDefaults access by introducing @AppStorage property wrapper. This article will explain how to store and read simple types like integer, string, double, data, or URL. UserDefaults is a simple key-value storage that can store a limited number of simple …
A SwiftUI Picker view is a control that lets you pick a value from a set of options. The Picker will adjust its looks to the context (different for iOS, macOS, or watchOS). It can look like the UIKit component called a UISegmentedControl (or segmented control) with proper configuration. You can use …
Apple provides over 2400 high-quality and highly configurable symbols integrated under the SF Symbols name and available for iOS 13 and macOS 11 and later. You can easily use them in your SwiftUI application to achieve a look consistent with other system applications. The 2020 update (SF Symbols 2) …