İlk iPhone Uygulaması ve Xcode’u Tanıyalım

Ahmet Erdoğan

5 sene önce

Merhaba Arkadaşlar,
Mobilhanem.com da iOS Uygulama Geliştirme eğitim serisinin İlk iPhone Uygulaması ve Xcode’u Tanıyalım dersi ile beraberiz. Bu derste iOS uygulama geliştirme için ilk uygulama oluşturulacak. iOS Ugulama geliştirme eğitimimize ve daha bir çok eğitime buradan ulabilirsiniz.

İlk Uygulamamız

Neredeyse dünyanın her yerinde yazılım geliştirme veya programlama ile ilgili tüm eğitim, ders, kurs veya yazılarda bir ders içeriği haline gelmiş bir başlangıç yapılacak. Her yerde gerçekleştirilen bu ilk Hello World! yani Merhaba Dünya! uygulamamsıdır. Eğitim sersinin bu dersinde de bir Hello World! uygulaması gerçekleştirilecek.

İlk Projeniz

Adım1: Proje Açma

Proje Touchpad alanımızda 5 parmağımız ile kaydırma hareketi yaparak Launchpad’i açalım. Orada resimde de görüldüğü üzere Xcode uygulamasını açalım.

Aşağıdaki bir ekran ile karşılaşmanız lazım. Aynı ekranda ‘Create a new Xcode project’ diyelim.

Xcode, proje seçimi için çeşitli şablonlar gösterir. Her şablon farklı amaçlara hizmet eder ve belirli bir uygulama türünün geliştirilmesine başlamanıza yardımcı olur. Örneğin, Game (Oyun) uygulaması için bir Game paketi geliştirmek istiyorsanız, Game Uygulaması şablonunu kullanacaksınız. Ama, çoğu durumda, Single View Application şablonu bir iOS uygulaması oluşturmak için yeterli olur. Böylelikle, aşağıdaki ekranda görüldüğü gibi iOS> Single View Application’ı seçin ve Next’e tıklayın.

Buradan projeniz ile ilgili bilgileri dolduracağınız ve proje beraberinde kullanılabilecek yardımcı eklentilerin seçimine karar verilecek kısma geleceksiniz.

Resimde görünen kısımları şu çerçevelerde doldurabiliriz.

Adım2: Proje Oluşturma

Product Name: HelloWorld – bu uygulamanızın adı olacaktır.
Team: Şu an için herhangi bir geliştirme takımına dahil olmadığımız için burayı olduğu gibi bırakıyoruz.
Organization Name: ahmet erdogan – Organizasyon yani Kuruluş ismi, herhangi bir kuruluş için uygulama geliştirmediğimiz için kendi adımızı kuruluş ismi olarak yazabiliriz ama eğer bir kuruluşa ya da bir firmaya uygulama geliştiriyorsanız burada şahsi isim yerine firma ismi bulunmalıdır.
Organization Identifier: ahmeterdogan – Organizasyon kimliği, organizasyon ismi alanında bulunan ismi arada boşluk olmayacak şekilde buraya yazabilirsiniz. İsteğe bağlı olarak başına ‘com.’ ekleyebilirsiniz, bu kurum/kuruluş olduğunun ifadesidir.
Bundle Identifier: ahmeterdogan.HelloWorld – Paket Tanımlayıcısı, uygulamanın sunulması sırasında kullanılan, uygulamanıza benzersiz bir tanımlayıcı isim sağlar. Bu kısmın doldurulması zorunlu değildir. Xcode otomatik olarak her proje için üretir. Uygulama App Store’a yüklenirken önem arzeder.
Language: Swift – Programlama Dili, Xcode’da Python, JavaScript gibi birçok programlama diliyle yazılmış program ya da servis derlenebilir ama iOS uygulama geliştiriken Swift ya da Objective-C kullanılabilir. Biz eğitim serimizde Swift kullanacağız.
Use Core Data: [işaretli ise] – Çekirdek Verilerini Kullan, Projede ihtiyaç durumunda veri tabanı kullanımında Xcode için geliştirilmiş ve kullanılabilen veri tabanıdır. Bu kısmı şu an için işaretlemeyin. Bu projede veri tabanı kullanımına ihtiyacınız yok. Veri tabanı daha sonraki bölümlerde açıklayacağız.
Include Unit Tests: [işaretli ise] – Birim Testlerini Dahil Et, Geliştirlen projelerde zaman zaman yapılması gereken birim testler için kullanılan araçtır. Bu kısmı işaretlemeyin. Bu projede birim testlerine ihtiyacınız yok.
Include UI Tests: [işaretli ise] – UI Testlerini Dahil Et, Geliştirile uygulamanın arayüz testlerini gerçekleştirmek için kullanılan test aracıdır. Bu kısmı şu an işaretlemeyin. Bu projede UI (arayüz) testlerine ihtiyacınız yok.

Not: Proje yeri

Devam etmek için “İleri” yi tıklayın. Xcode daha sonra “HelloWorld” projesini kaydedeceğinizi yeri soracaktır. Mac’inizdeki herhangi bir klasörü (örneğin, Masaüstünde Projeler diye bir kalsör açıp oraya kaydedebilirsiniz, eğer siz seçmezseniz Xcode dosyaları içinde ‘XcodeProjects’ diye bir dosyaya kaydeder) seçebilirisiniz. Proje Kaynak kontrolü ve takibi için bir Git seçeneğinin olduğunu fark edeceksiniz. Şu an için seçimini kaldırın. Seçmek zorunlu değildir. Devam etmek için “Oluştur”a tıklayın.

Onayladıktan sonra, Xcode otomatik olarak ‘Merhaba Dünya’ projesini oluşturur. Resim6’da gösterilen ekran görüntüsü gibi görünecektir.

Adım3: Xcode Workspace ile Çalışma Alanınızı Tanıyın

Hello World uygulamasını gerçekleştirmeye başlamadan önce, Xcode çalışma ortamına şöyle bir göz atalım. Sol tarfta bulunan kısım proje gezginidir. Tüm proje dosyalarınızı bu alanda bulabilirsiniz. Çalışma alanının orta kısmı editör yani geliştirme alanıdır. Tüm düzenleme işlerini burada (örneğin proje ayarını düzenleme, kaynak kod dosyası oluşturma, kullanıcı arayüzü geliştirme gibi) bu alanda yaparsınız. Arama sonuçlarında çıkan dosyalar, hatalar, uyarılar gibi birçok işlem için sol taraf kullanılır ama takdir edersiniz ki birden hepsini anlatılamaz, anlatılırsa bile konu çok dağılır ve unutulur o yüzden kullandıkça anlatılmaya devam edilecek. Şimdilik dosya gezgini özelliği üzerinde durulacak.

Dosya türüne bağlı olarak, Xcode editör alanında size farklı arayüzler gösterir. Örneğin, proje yönlendiricisinde ViewController.swift öğesini seçerseniz, resim7’de görüldüğü gibi Xcode kaynak kodu orta alanda görüntüler. Ya da uygulamanın arayüzünün geliştirildiği alanı görüntülemek için Main.storyboard öğesini seçebilirsiniz.

resim7: Xcode Workspace Source Code Editor (kaynak kod editörü)

Üsta kısımdaki sağda kalan bölmeye bakalım, Xcode 10 ile oldukça işlevsellik kazanmış yardımcı program alanıdır. Bu alan dosyanın özelliklerini gösterir, Hızlı Yardım’a (Quick Help) erişmenizi, en önemli özelliği ise Snippets yani arayüz tasarlama yaparken kullanılacak olan buton label vb. componentlere ulaşmamızı sağlar. Xcode bu alanı göstermezse, etkinleştirmek için araç çubuğundaki en sağdaki düğmeyi (sağ üst köşedeki) seçebilirsiniz.

Library: Arayüz tasarımında kullanılan Snippets yani componentlere ulaşmayı sağlar.

Standart Editör: Orta alanda sadece tek ekran ile çalışmayı sağlar.

Assistant Editör: Orta alanda iki ekran ile aynı anda çalışmayı sağlar

Version Editör: Aynı ekrandan iki tane, bir ekran ve yanında log çıktıları ya da bir ekran ve kullanıcı bilgileri gibi farklı üç kullanımı vardır.

Project Navigator: Dosya gezgini kısmını açıp kapar.

Debug Area: Orta alt alanda Debug alanını açar.

Utilities: Sağ kısımda bulunan araçlar ekranını açıp, kapar.

Adım4: Xcode’da simülatörü ilk kez çalıştırma

Şu ana kadar, hiç kod yazmadık. Ama Xcode da yerleşik olarak bulunan simülatörü hiç kod yazmadan da çalıştırabilirsiniz. Bu, uygulamanızı Xcode’da nasıl uygulama oluşturacağınız ve test nasıl edeceğiniz konusunda size yön gösterecektir. Sol üst kısımda bulunan araç çubuğunda ‘Çalıştır’ butonunu görmüş olmanız lazım.

Run: Projeyi çalıştımayı / ayağa kaldırmayısağlar.

Stop: Çalışan projeyi durdurmayı sağlar.

Simülatör: Projenizi hangi cihaz simülatöründe ya hangi gerçek cihazda çalıştırmayı seçmenizi sağlar.

Şimdi iPhone XR cihaz simülatörünü seçerek çalıştıralım. (bknz: resim10)

ipucu: Retina olmayan Mac’lerde, tam simülatör penceresini görünmeyebilir. Simülatörü seçebilir ve küçültmek için ‘cmd + 1’ komutunu kullanabilirsiniz. Alternatif olarak, fare imlecini cihazın çerçevesinin köşelerinden birinin yanına getirebilir ve boyutunu küçültebilirsiniz.

Şu an simülatör sadece bir beyaz ekran olarak gözüküyor bu normal bir durum. Çünkü herhangi bir arayüz tasarımı yapılmadı ve bir satır kod bile yazılmadı. Xcode 9 ile tanıtılan bir özellik ile bir anda birden fazla simülatör aynı anda çalıştırılabilir. Simülatörlerin normal bir iPhone cihazından farkı yoktur ana ekrana giderek iPhone kullanılır gibi kullanılır. Ve zaten beraberinde bazı varsayılan uygulamalar getirir. Simülatörü durdurmak için sol üs tarafta çalıştırmak için kullanılan buton kullanılabilir.

Bu dersimizde iOS Uygulama Geliştirme eğitim serisinin İlk iPhone Uygulaması ve Xcode’u Tanıyalım başlığı altında Xcode’u tanımaya ve simülatörü çalıştırmayı öğrendik. Bu konu için anlatacaklarımın neredeyse yarısı kaldı bu ders çok uzamasın diye böldüm. Bir sonraki derste kaldığımız yerden devam edeceğiz. Eksik gördüğünüz bir yer olursa iletişime geçmekten çekinmeyin. Bir sonraki dersimizde görüşmek üzere.