Tampilkan postingan dengan label xcode. Tampilkan semua postingan
Tampilkan postingan dengan label xcode. Tampilkan semua postingan

Sabtu, 27 Juli 2019

Making a Segue Between Storyboard Part II #IOSDev

Hello everyone, in this tutorial i would like to continue my last tutorial about segue, if you dont have read it yet, just go to this link.

in this tutorial i would like to show you how to switch between view controller using programmatically in swift. interesting right? so here it is.

prerequisite:
* create new project
* know how to put segue by drag and drop


firstly, open last xcode project about segue in the first tutorial. and then add new viewcontroller. like bellow



connect segue from first viewcontroller to third viewcontroller by dragging first viewcontroller icon and drop it to third viewcontroller, you could use ctrl+click to drag and drop. after you drop, you will face new popup window, choose "show" like bellow 




click on the segue path link like bellow



on the right side bar, you will see some menu, choose the attribute menu. and then you can see identifier option right there. fill the identifier as you want, in this tutorial we put "seguePartII" as the name.



add button (name: hit me) to first viewcontroller and label in second view controller, we will use it as marker whether the view controller is moving to second view controller or not. 



we are now done with the UI, lets start the code. wohoo

click the viewcontroller.swift, and then add action from button (hit me). and then put perform segue code into it.



finally, run it and tap on hit me button, and see whats going on.  good luck guys ^_^

Rabu, 17 Juli 2019

Image Recognition Example Using CreateML #IOSDev



Hello everyone, in this tutorial I would like to share about using CreateML Framework to recognition image. in the end of this tutorial we will achieve model from training data that can be use to be mlmodel in xcode. 

like example bellow


above picture means picture orange that we put on that view has recognise that it is an orange. so cool is'nt it?

lets go ahead.  

first, create and playground project and then choose macOS platform, like bellow.

note : we need to choose macOS project because, the framework that we use is only available on macOS platform. 

after that, put the code bellow in playground editor.  and then run it

when you run the code, MLUI will appear beside your editor, we use the MLUI to put our data training. so in the next step, you need to prepare the training data. in this tutorial I have collecting training data about some fruits, apple and orange. you could download it here

drag the training folder to MLUI until the image processing has done.


after process done, now you could test by drag testing data like bellow. 


Hurray, our image has recognise as orange.  you can try with another training data.. good luck ^_^


Senin, 27 Mei 2019

Membuat Segue Antar Storyboard Part I #IOSDEV

Halo semuanya, kali ini saya mau berbagi artikel tentang membuat segue ios dengan cara paling mudah. apa itu segue? segue adalah istilah untuk menyebut koneksi atau transisi antar layer di aplikasi IOS, apabila kalian pernah develop Android, Segue itu mirip Intent. paham kan?

nah banyak sekali cara untuk membuat segue di IOS, untuk kali ini saya akan menunjukkan cara paling gampang yaitu dengan drag and drop antar viewcontroller, berikut langkah-langkah nya. 


buat project xcode baru, buka main storyboard. lalu tambahkan viewcontroller baru di samping viewcontroller lama. 


jadi seperti ini.


lalu tambahkan komponen button pada viewcontroller lama. 


setelah itu tekan control dan tahan, lalu drag button tadi ke viewcontroller baru, sampai keluar popup segue pada viewcontroller baru. pilih show, hasilnya akan seperti gambar dibawah ini.




jika kita lihat di atas, terdapat semacam tali yang mengbungkan antara viewcontroller lama dan baru, dengan berarti segue yang kita buat berhasil terkoneksi.

untuk melakukan test silahkan run lalu tekan tombol yang kita masukkan tadi. ^_^ good luck guys


Minggu, 26 Mei 2019

Animasi Pergantian Warna pada Background Aplikasi #IOSDev


Hallo semuanya kali ini saya akan membagikan tentang tutorial bagaimana mengganti background dengan menggunakan animasi, pada IOS kalian bisa memanfaatkan build in function animasi yang bisa memberikan efek halus saat pergantian suatu object ke object lain seperti ada transisi. pada tutorial ini kita akan fokus pada pergantian background pada aplikasi.

sebelum kita mulai, berikut adalah goal dari tutorial ini.


buat project baru dengan nama AnimatingBackgroundColour. lalu buka mainstoryboard, drag and drop superview kedalam viewcontroller.swift dan namakan superview, seperti dibawah ini





setelah itu tambahkan kode untuk mengganti background pada viewDidLoad(), seperti dibawah ini.

self.superView.backgroundColor = .green


hasilnya akan seperti ini.


untuk mengganti background kita menjadi banyak warna bergantian dengan animasi yang halus kita membutuhkan beberapa komponen kode program yaitu :

1. array yang berisi warna
2. timer untuk melakukan infinite loop
3. uiview animating untuk melakukan transisi animasi dari warna satu ke warna lain

hasil kodeprogramnya untuk requirement di atas seperti dibawah ini.




silahkan kalian baca kodingan di atas. apabila ada pertanyaan silahkan layangkan di komentar, goodluck semuanya ^_^

Selasa, 21 Mei 2019

Membuat Kalkulator BMI Swift dan UIKIT #IOSDEV

halo semuanya, kali ini saya mau membagikan project kecil kecilan saya yang terinspirasi dari apps di appstore, kali ini saya mau membuat kalkulator BMI menggunakan swift dan UIKIT, kalkulator BMI adalah kalkulator untuk mengukur apakah berat badan kita termasuk kedalam kurus, normal, gemuk atau obesitas, dengan memanfaatkan UIKIT saya akan menyajikan kalkulator dengan tampilan lebih interaktif. berikut tampilan kalkulatornya.




kalkulator ini memiliki beberapa komponen yaitu :

1. slider
2. label
3. segmented control

slider kita gunakan untuk mengatur angka yang ingin di inputkan oleh user, kita batasi sesuai dengan berat dan tinggi manusia pada umumnya.

label kita gunakan untuk menampilkan hasil dari input user dan memberikan judul dari komponen tertentu.

segmented control digunakan untuk memberikan efek dark dan light mode seperti aplikasi telegram dan twitter.

oke lanjut saja ke langkah2nya.

1. buat project xcode dengan nama BMICalculator
2. lalu siapkan semua komponen sesuai UI pada gambar aplikasi di atas
note: untuk emoticon menggunakan label component
3. tambahkan constraint (bila perlu)
4. tambahkan kode program seperti berikut





untuk UIKIT, posisikan komponen kalian seperti ini.

bills macbook

pastikan outlet dan action kalian terkoneksi, apabila belum silahkan koneksikan.

dan jika selesai, run aplikasinya dan selesai sudah. :) goodluck guys. smoga bermanfaat


Minggu, 14 April 2019

Membuat Halaman Signin dengan Memanfaatkan Stack View di XCODE #IOSDEV

Halo semuanya kali ini kita akan belajar xcode lagi, judul kali ini adalah menggunakan stack view di xcode, stack view adalah salah satu jenis view yang bisa membuat komponen di dalam view tesebut menjadi tesusun secara bertumpuk. stack view memiliki 2 jenis yaitu stack view horizontal dan vertical, sesuai dengan namanya stack view horizontal bisa membuat komponen di dalamnya menjadi berjejer secara horizontal, sedangkan vertical bisa membuat komponen di dalamnya menjadi bertumpuk atau berjejer vertical.

stack view berperan penting dalam dunia layouting aplikasi, untuk melakukan penumpukan komponen cukup menggunakan stack view kita bisa mendapatkan hasil yang sesuai dan lebih praktis, apabila kita tidak menggunakan stack view atau bisa di asumsikan kita menggunakan margin dan constraint maka pekerjaan kita menjadi lebih rumit dan prosesnya lebih lama.

berikut ilustrasi dari stack view. 

source : developer.apple.com

pada gambar di atas ada stack view yang di dalamnya terdapat 3 komponen yaitu : label, image view dan button. saat kita memasukkan komponen2 tersebut kedalam stack view, mereka otomatis langsung berurutan seperti di atas sesuai posisi urutan yang kita mau.

sudah paham kan? oke, kita langsung lanjut ke langkah langkahnya.

1. Buat project xcode
2. Masuk ke storyboard, tekan command+shift+L > pilih stack view vertical


3. Drag and drop di storyboard. pastikan urutan komponen seperti gambar dibawah.

4. Tambahkan 3 button di dalam stack view.

note: pada langkah ini kita sudah bisa melihat bahwa 3 componen yang kita tambahkan tadi langsung bertumpuk sejajar saat kita masukkan satu2. itulah gunanya stack view (vertical).

5. buat agar stackview memiliki rata tengah horizontal dan vertical. dengan cara klik align menu pada kanan bawah storyboard > lalu klik centang horizontal dan vertical > add constraint.


note : pada langkah ini harusnya component stack view sudah di tengah vertical dan horizontal.

6.  Tambahkan asset untuk mempercantik halaman login kita. klik Assets.xcassets > drag and drop asset dari finder ke dalam xcode. seperti berikut



7.  tambahkan 2 label. satu didalam stack view, lainnya di atas stackview. seperti ini.


8. Ganti properties pada setiap komponen sesuai list dibawah.


  • LabelA (text : "Batavia Hack Town") atau terserah kalian
  • LabelB (text: "Choose your login")
  • ButtonA (title: "Sign in with Facebook", background: "FB", text color: "white")
  • ButtonB (title: "Sign in with Google", background: "google", text color: "black")
  • ButtonC (title: "Sign in with Email", background: "email", text color: "black")
  • StackView (spacing: 10, distribution: "fill equal")
sehingga terlihat seperti ini


9. tambahkan constrain pada LabelA dengan cara seperti berikut .



dan hasilnya akan jadi seperti ini .


10. tambahkan sedikit property pada LabelA untuk mempercantik. 

LabelA (font style: light, font size: 50)

11. tambahkan image view, lalu ganti property image pada imageview menjadi "background" lalu ganti content mode menjadi "aspect fill". tambahkan constraint sesuai dengan gambar dibawah ini. 


note: pastikan constrain yang di tuju adalah super view, seperti berikut.



setelah itu hasilnya akan seperti ini.


here we are, sudah selesai lah kita pada akhir tutorial ini. apabila ada pertanyaan silahkan layangkan di komentar. good luck and thankyou :) 

Jumat, 12 April 2019

Menggunakan GIT di XCODE #IOSDEV

Hallo semuanya kali ini saya mau berbagi tutorial tentang cara untuk menggunakan git di xcode, git adalah salah satu tools untuk version control suatu software yang kita buat agar dapat di ketahui jejak track codingan kita dan juga kita bisa berkolaborasi dengan orang lain untuk membangun software bersama sama. nah di IDE xcode sudah diberikan fitur khusus untuk mengkoneksikan xcode project kita ke git repository, gmn caranya? ayok kita lakukan bersama sama.

#REQUIREMENT
  • github account
  • git terinstall di laptop
  • ssh public key local laptop kalian sudah terinstall di github account kalian
#LANGKAH-LANGKAHNYA


1. buat repository terlebih dahulu seperti ini


2. copy link repository online kalian menggunakan link ssh (optional: kalian bisa pakai http)


3. tambahkan remote repository pada xcode. klik source control navigation > pilih Remotes > klik kanan > Add Existing Remote > Paste link repository kalian tadi .


4. klik menu Source Control > Fetch and Refresh Status



5. Lakukan Commit. Klik menu Source Control > Commit . 


6. lakukan Pull. klik menu Source Control > Pull.


7. lakukan Push. klik menu Source Control > Push.


8. check jika file sudah terupload di repository.


Sekian, semoga bermanfaat ^_^

Kamis, 11 April 2019

Cara Mengunci Orientasi Aplikasi IOS di XCODE #IOSDEV

Hallo semuanya, kali ini saya mau share tentang cara mengunci orientasi dari aplikasi IOS yang ingin kalian buat agar bisa tetap di orientasi yang kalian inginkan, entah itu potrait atau landscape seperti gambar berikut.


mengapa kita membutuhkan ini? karna kebutuhan aplikasi kita beda2, ada yang membutuhkan orientasi landscape aja seperti game COC, atau ada yang hanya membutuhkan potrait aja seperti aplikasi onlineshop.

pada kali ini saya mau kasih tips agar orientasi aplikasi kalian bisa menjadi potrait atau landscape aja, berikut caranya. pada halaman awal pada kalian create project, klik tab general, lalu cari section Deployment Info


pada menu device orientation kalian tinggal pilih sesuai dengan kebutuhan aplikasi kalian .
okey cukup sekian, see you. ^_^

Kamis, 04 April 2019

Membuat Aplikasi IOS Pertama pada Iphone Xr #IOSDEV



Hallo semuanya, kali ini saya mau berbagi tentang ilmu yang baru saja saya dapatkan, yaitu membuat aplikasi IOS pada project pertama saya yang bernama TRUMPet. Project ini saya upload ke github, bagi kalian yang pengen nyoba langsung bisa ke link dibawah ini :


Project ini saya dapat dari tutorial berikut :


sebelum masuk ke langkah langkahnya, kalian perlu untuk mendownload terlebih dahulu asset yang akan kita pakai, silahkan download dibawah ini 


setelah kalian download, silahkan extract.

buat project baru seperti berikut. 

pilih single view app lalu next. lalu pastikan anda mengisi point2 berikut :

1. Product Name
2. Team
3. Organization name
4. Organization Identifier

klik next, sampai muncul tampilan seperti berikut.

drag and drop asset yang sudah kalian download tadi, kedalam asset folder, seperti berikut.



klik File main.Storyboard lalu klik safe area. seperti berikut 

tambahkan tombol pada safe area. 



tambahkan constraint pada tombol yang tadi di tambahkan. 

edit property dari button seperti berikut, hilangkan text "button" lalu tambahkan image ke button, seperti berikut.


lalu drag file mp3 dari asset tadi, ke dalam project. seperti berikut 

buat action button di view class controller seperti berikut.

lalu lakukan build dengan klik tombol play, di pojok kiri atas.



yup, project pertama kita telah selesai, apabila ada pertanyaan silahkan layangkan di bawah. 
semoga bermanfaat.

Search