SwiftUI Temel Bilgiler

Ataberk Turan
Nov 3 · 4 min read

Merhaba TurkishKit okurları 👋! SwiftUI serimiz ile Apple’ın WWDC 19'da tanıtmış olduğu SwiftUI dünyasını keşfedeceğiz ve SwiftUI ile uygulama geliştirmeyi öğreneceğiz. Serinin ilk yazısı olan bu yazımızda, ilk olarak SwiftUI kütüphanesini tanıyacağız.

SwiftUI Nedir?

SwiftUI bir Swift kütüphanesidir. Çok kısa kodlar ile uygulama yapmamıza olanak sağlayan bir kütüphane. Örneğin: UIKit kütüphanesinde 100 satırlık bir uygulamanız varsa bu uygulamanın aynısını SwiftUI ile 50 satırda belki 50 satırdan da daha az bir şekilde kodlamanız mümkün.

SwiftUI kütüphanesi ile uygulama geliştirirken uzun uzun simülatörü çalıştırıp yazdığınız kodu önizlemek yerine canlı önizleme modu ile yazdığınız kodun aynı anda önizlemesini cihaz üzerinde görebilirsiniz.

SwiftUI ile Proje Oluşturma

SwiftUI ile uygulama geliştirmek için ilk önce Mac’inizde Xcode uygulamasının yüklü olması lazım.

Bir SwiftUI projesi oluşturmak için öncelikle Xcode’u açıyoruz ve “Create a new Xcode project” seçeneğine tıklıyoruz.

Daha sonra karşımıza çıkan menüden “Single View App” seçeneğine tıklıyoruz.

“Single View App” seçeneğine tıkladıktan sonra karşımıza çıkan ekranda “Product Name” kısımına uygulamamıza vereceğimiz adı yazıyoruz ve “User Interface” kısımındaki seçeneklerden de “Storyboard” yerine “SwiftUI” seçeneğini seçiyoruz.

Tüm bu işlemleri yaptıktan sonra SwiftUI projemizi oluşturmuş olduk. 🥳🥳

SwiftUI Arayüzü

Projenizi oluşturduktan sonra sizi böyle bir ekran karşılayacak. Haydi gelin bu ekranı daha yakından tanıyalım.

Bu “struct” yapısı bizim arayüz elemanlarını kodladığımız kısım. Burada uygulamanızın arayüzünü kodluyorsunuz.

Bu “struct” yapısı ise uygulamanızın arkasında dönen kodların yani uygulamanızın back-end kodlarını yazdığınız alan.

Bu alan uygulamanızın canlı önizlemesinin görüntülendiği “LiveView” alanı.

Canlı önizleme kısmında 2 tane düğme var. Bu düğmelerden birincisi yazdığınız kodu ön izlemenize olanak sağlıyor. İkinci düğme ise gerçek bir aygıtta, uygulamanızı ön izlemenize olanak sağlıyor.

Eğer SwiftUI projenizi simülatör üzerinde çalıştırmak isterseniz; sol tarafın en yukarısındaki “Play” düğmesine tıklayarak projenizi simülatör üzerinde çalıştırabilirsiniz.

“LiveView” kısmındaki önizleme cihazının üzerinde bulunan objelere tıkladığınızda aynı anda sol taraftaki kodların bulunduğu kısımda tıkladığınız eleman hangi kodu içeriyorsa onu belirtiyor.

Eğer bir elemanın üzerine CMD tuşuna basılı tutarak tıklarsanız o eleman için çeşitli seçenekler karşınıza çıkacaktır.

Bu seçenekler arasından en çok işinize yarayacak seçenek ise “Show SwiftUI Inspector…” seçeneği!

Bu seçeneğin üzerine tıkladığınızda karşınıza tıkladığınız elemanın özelliklerini ayarlayabileceğiniz bir arayüz çıkıyor. (Bu arayüz seçtiğiniz elemana göre farklılık göstermektedir.)

Uygulamanıza sürükle bırak yöntemi ile arayüz elemanı eklemek istiyorsanız “+” düğmesine tıklayıp, karşınıza açılan menüden bir eleman seçip kod bloklarının bulunduğu kısıma doğru sürükle bırak yaparsanız seçtiğiniz arayüz elemanını başarılı bir şekilde uygulamanıza eklemiş olursunuz.

SwiftUI Kavramları

Canvas: Uygulamanızın ön izlemesini gördüğünüz kısımdır.

Minimap: Yazdığınız kodun haritasını gösterir. Kodu yazdığınız ekranın sağ tarafındaki bölümdür. Bu haritayı dilerseniz kapatabilirsiniz. Kapatmak için: Editor ▸ Hide Minimap adımlarını takip etmeniz yeterli.

Container views: Daha önceden Stack View ile uygulama geliştirdiyseniz SwiftUI kütüphanesindeki Stack View ile uygulama geliştirmek çok kolay gelecek. SwiftUI kütüphanesi HStack, VStack, ZStack olmak üzere 3 tane Stack View türü içeriyor.

Modifiers: Arayüz elemanlarınıza çeşitli nitelikler veya özellikler ekleyebilirsiniz. Örneğin: Padding, yazı tipi, yazı tipi boyutu gibi.

Bu yazımızda SwiftUI projesi nasıl oluşturulur ve SwiftUI arayüzü hakkında bilgiler verdik. Eğer aklınıza takılan bir soru olursa yorumlarda belirtmeyi unutmayın! Hepinize hatasız kodlar yazabileceğiniz bir gün dilerim! 😍

TurkishKit

Apple dünyasında sınırları belirleyecek nitelikte uygulamalar tasarlamak ve geliştirmek isteyen lise & üniversite öğrencilerinin buluşma noktası.

Ataberk Turan

Written by

Writer of TurkishKit 💻 | Front-end Developer

TurkishKit

Apple dünyasında sınırları belirleyecek nitelikte uygulamalar tasarlamak ve geliştirmek isteyen lise & üniversite öğrencilerinin buluşma noktası.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade