Property Wrappers in SwiftUI — 1
Greetings everyone. This article is all about property wrappers in SwiftUI. The topic of UIKit’s property wrappers is not the subject of this writing as it is a slightly different subject.
What are Property Wrappers?
Almost every mobile application handles the display of some data. But how does the View communicate with that data and display it on the View. In SwiftUI, we find the solution to this problem by using property wrappers. In other words, we can show the data in original or manipulated form to the user. Property wrapper’s creation purpose was to make the code more readable and easy to write. You will be able to see why this is so useful with the sample code I will give towards to the end of the article.
Why do we use Property Wrappers?
In old UIKit, which is used in iOS programming and has come out of before SwiftUI , the class keyword is generally used while developing. On the other hand, in SwiftUI the struct keywords are generally used while developing the app. Although these two keywords are similar, property wrappers are used in SwiftUI due to a few differences between classes and structs.
In the code example below, I am changing the value of variable which is called “infoString” and show it in the UILabel by using old UIKit framework. UIKit’s ViewControllers works with classes. I want you to remember that.
By using classes, this code example works fine! We can change our properties’ values just like in line 14. But SwiftUI doesn’t allow us to use this code because structs works in a different way.
Since GitHub gists doesn’t show the errors with a red line just like in XCode, I wanted to show you this picture with error showing why this usage is not possible. Compiler would not compile this, because structs are immutable. That’s exactly what the error on line 18 tells us. Its saying you can’t assign a value to property of ContentView because it’s in a struct hence its immutable.
Solution : We need to solve this by using one of the property wrapper which is called @State. Even though property wrapper’s types are not included in this article, i would like to show you the most common one and it’s usage.
By adding @State at line 5, compiler now compiles the code and it works fine!
P.S. Always put private keyword right after @State. I will be explaining the reason in the next article.
How Does Property Wrappers Work?
In the above code example I created a property wrapper called “AddCustomWebsiteExtension”. A String type value using this property wrapper takes the prefix “https://” and the “.dev” suffix at the end of its value.
I created a property called “website” and wrote “giray” as its initial value. If I want to see this value in a Text or use it somewhere, now the value of this website String becomes “https://giray.dev" thanks to the custom property wrapper I added to the beginning of website property declaration.
The reason why i showed you this example code is, property wrappers such as @State, @Binding , @ObservedObject, @StateObject in SwiftUI are created in the same way. But of course, it does not perform the same operation as my custom property wrapper called “AddCustomWebsiteExtension”. To see how each one of them works, hover over any SwiftUI property wrapper, hold down the “command” key, click on the wrapper and press the “Jump to Definition” option.
I hope I was able to explain to you the concept of property wrappers used in SwiftUI. In my next article, I will be explaining various types of it such as @State, @Binding, @ObservedObject and how they are used.
Personal Website | GitHub | LinkedIn | Instagram
Please feel free to reach me if you have any question or suggestion.
Thank you!
