Data in SwiftUI, Part 2: Views as a function of data | Sarun, Hacker News

:  Bool  (=
  (false) { 
   didSet  ({   
} 
    
 } 
  ()  (func)   viewDidLoad 
  (
 
  
 {
 {() 
  configureView   (
  
 
    (loadData) () (   
 
  

 () 

 (private)  func  configureView   


 ) 

  ({





 
 
  ()   
 
 @ objc 
 func   playButtonDidTap 
 (
 sender :   ) 
 {{ 
       
} 
 
 As you can see, the fact that UIKit communicates using events makes it difficult to know what the resulting view would be at a given time. And there are so many places that can go wrong. 
  
 Views are a function of state, not of a sequence of events.   - WWDC , session  
  
 If UIKit said to be an event-driven user interface, SwiftUI would be data-driven. The above quote from WWDC 34788 session sums the situation of UIKit and SwiftUI nicely. 
 
 View in UIKIt usually a result of sequences of events, whether target-action, delegate, or notification. View in SwiftUI, on the other hand, designed to depend solely on data. 
 
 Let see some example. 
    (struct 
 (PlayerView)  :   View  {{ 
     (let 
 episode :  
 Episode   
  @  (State 
 
 pri vate 
  (var) (isPlaying) :   Bool  
=
 (false)  
  
    var  (body) :  some 

 (View)   {
 () (VStack) { 
 
 Text   (
 episode . 
 title 

   
 foregroundColor 
 ( isPlaying ? .  (white) :  (gray) ) 
     
 (Text) ( episode  (showTitle 
  . 
 font 

  (  (caption) )   

 foregroundColor  
 (
   gray 
 
   PlayButton  (
 (isPlaying) :  $ isPlaying )  
 
   } 

	

			
	

			


		
			
			
					
			


 
   
} 
   

      struct  (PlayButton) : 

View { @ Binding var

 isPlaying :  (Bool)  
   
 var 
 body  ():  (View)  { 

 
  Button 
  ( action :  ({
     (self) () .  isPlaying 
  toggle 
 (  
  
    }    {
    (Image)    (systemName) : 
 isPlaying ? 
  “pause.circle”  : 
 "play.circle" 
 
     }   
 }  
 
  } 
   
 You might not understand some of the syntaxes, but we can all agree that a SwiftUI view is quite easy to understand. We can declare views in the form of function that takes data as an arugment.  PlayerView  episode episode color change according to  isPlaying   PlayButton  image showing play / pause based on  isPlaying . We know exactly how it looks based on a given data,  isPlaying  . 
 
 Following is the same view interaction diagram, but this time for SwiftUI. 
 
  An overview diagram of interactions between each view in SwiftUI   (Declarative UI)  # 
  

 SwiftUI said to be declarative UI. It has a way to declare all  principles  we learn in this declarative world. We can declare data as a source of truth or dependency, and view as a function of those data. SwiftUI will do take care of the rest for us. 
 The declarative UI make SwiftUI shine, the framework handle everything that we have to do it manually in UIKit. It makes the concept of view controller not relevant anymore in SwiftUI. 
 The purpose of the view controller is to manage views and their interaction. Most of the codes in view controller are for responding to user interaction from its views. Setting up target-action to a button, listen for a delegate. Observe to model change and response to that by reload your table view or change some labels. You have to do all of this manually, which is error-prone, and the complexity grows as your app grows. 
 SwiftUI does all the heavy lifting, which allows us to focus on things that matter, manage the data of your app by defining the right source of truth and its dependency. 
 The whole purpose of view controller is to keep your data in sync with your view 
 The fact that we don't have to manage data ourselves makes the complexity in UI development significantly reduce. 
  What's next  (# )  
 In the following article, we will go through all the tools available, including the one shown in the example  @State  and  @ Binding . 

  Data flow in SwiftUI, Part 1: Data     Data flow in SwiftUI, Part 3: Tools     Data Flow Through SwiftUI 
 
  References  #           



	

			
	

			

		
	
		




  ← Home 
                   Read More