Tiga Mode Pemrograman iOS Apps di Xcode (Swift)

Ricki Bin Yamin
4 min readJul 13, 2020

--

Tampilan XCode saat Create New Project

Setiap developer mempunyai style sendiri-sendiri untuk mengembangkan apps-nya. Style inilah yang menjadi ciri khas masing-masing developer. Pada artikel ini saya akan membahas tiga mode atau style pemrograman iOS Apps di Xcode.

Pada saat kita Create New Project pada Xcode untuk memulai pemrograman sebuah iOS Apps menggunakan bahasa Swift, kita ditawarkan 2 pilihan User Interface, yakni SwiftUI dan Storyboard. Lalu mengapa pada judul artikel ini tertulis 3 mode?

Pada dasarnya, terdapat 2 native framework (bawaan) yang disediakan oleh Apple untuk membangun tampilan sebuah Apps, yakni UIKit dan SwiftUI. Sebelum SwiftUI dirilis pada 2019 lalu, kita hanya dihadapkan UIKit setiap membuat project baru, dimana telah terdapat file Main.storyboard untuk menyusun tampilan secara drag-and-drop yang sangat disukai oleh kebanyakan orang.

UIKit-Storyboard

Tampilan XCode dengan Storyboard

Dengan menggunakan storyboard, kita bisa dengan mudah mengatur tampilan Apps yang akan kita buat, seperti menambahkan komponen dengan drag-and-drop, mengatur posisi komponen, dan mengatur atribut sebuah komponen melalui Attributes Inspector pada panel sebelah kanan.

Berikut beberapa shortcut yang perlu kita ketahui untuk memudahkan pemrograman apps menggunakan storyboard.

  • command+shift+L : untuk menambahkan komponen baru
  • command+option+control+return : untuk show/hide assistant (swift code di sebelah kanan storyboard)

SwiftUI

Tampilan XCode dengan SwiftUI

Gambar di atas merupakan tampilan XCode saat digunakan untuk membuat aplikasi menggunakan framework SwiftUI. Dengan SwiftUI, kita bisa dengan langsung mengamati perubahan tampilan apps setiap melakukan perubahan pada code.

Berbeda dengan storyboard dimana tata letak komponennya disimpan dalam format XML yang tidak memungkinkan untuk diubah secara langsung dari XML-nya, project yang dibangun dengan SwiftUI menyimpan tatanan tampilan (User Interface) dalam bentuk file swift, sehingga kita bisa dengan mudah melakukan copy-paste sebuah tampilan apps dengan cara copy-paste dari source code-nya. Selain itu, kita juga bisa dengan mudah melakukan kolaborasi dan version control system, menggunakan git misalnya, apabila kita menggunakan SwiftUI, karena setiap perubahan tampilan terlihat jelas dari perubahan source code-nya.

UIKit-Delete Storyboard-Let’s by Code

Style penyusunan apps dengan UIKit-by code

Cara ini merupakan cara yang cukup menantang untuk menyusun sebuah apps pada XCode, dimana kita create new project dengan memilih User Interface storyboard (agar secara default framework yang digunakan adalah UIKit), kemudian menghapus file storyboard, melakukan sedikit konfigurasi, dan mulai menyusun tampilan menggunakan source code dengan framework UIKit, bukan SwiftUI.

Setiap penambahan komponen, pengaturan lokasi tata letak komponen, dan pengaturan atribut komponen dilakukan secara code. Tentunya hal ini sangat mempermudah kita apabila kita menggunakan version control system atau berkolaborasi dengan banyak orang karena setiap tampilan terlihat jelas source code-nya. Akan tetapi, kita harus memainkan imajinasi kita saat menyusun tampilan apps, karena tidak terdapat live preview seperti pada SwiftUI.

Mungkin yang terlintas di benak kita, mengapa tidak pakai SwiftUI saja daripada susah-susah pakai UIKit full code? Perlu diketahui bahwa SwiftUI dan UIKit merupakan framework yang berbeda, sehingga style penyusunannya pun berbeda, begitu pula life cycle-nya.

Life Cycle pada UIKit

Gambar di atas merupakan contoh life cycle pada framework UIKit dan tidak ditemukan pada SwiftUI. Bagi seseorang yang telah jatuh hati pada UIKit, kemungkinan lebih mudah baginya mengikuti alur life cycle UIKit seperti di atas. Itulah mengapa banyak juga yang menggemari penyusunan tampilan by code dengan UIKit.

Selain alasan di atas, bagi seseorang yang suka mengeksplor framework lain untuk penyusunan tampilan, keterampilan by code ini juga sangat diperlukan. Beberapa framework pihak ketiga untuk menyusun UI antara lain Material Design oleh Google, dan AsyncDisplayKit yang awalnya dikelola oleh Facebook berubah menjadi Texture yang kini dikelola oleh Pinterest. Kedua framework ini sama-sama memerlukan keterampilan imajinasi untuk menyusun UI secara code.

Untuk yang tertarik dengan mode pemrograman tanpa storyboard, cek artikel Ketika Mulai Membangun UI tanpa Storyboard pada Xcode 11 untuk mengetahui konfigurasi awal yang perlu dilakukan setelah menghapus storyboard (karena tidak diperlukan lagi).

Bagi kalian yang memiliki style sendiri untuk penyusunan iOS Apps, jangan lupa share style kalian agar lebih bermanfaat. Juga, jangan lupa berikan claps bila kalian suka artikel ini. :)

--

--