Halo, Mac – Panduan

Xamarin.Mac memungkinkan pengembangan aplikasi Mac yang sepenuhnya asli di C# dan .NET menggunakan API macOS yang sama yang digunakan saat mengembangkan di Objective-C atau Swift. Karena Xamarin.Mac terintegrasi langsung dengan Xcode, pengembang dapat menggunakan Penyusun Antarmuka Xcode untuk membuat antarmuka pengguna aplikasi (atau secara opsional membuatnya langsung dalam kode C#).

Selain itu, karena aplikasi Xamarin.Mac ditulis dalam C# dan .NET, kode dapat dibagikan dengan aplikasi seluler Xamarin.iOS dan Xamarin.Android; semua saat memberikan pengalaman asli di setiap platform.

Artikel ini akan memperkenalkan konsep utama yang diperlukan untuk membuat aplikasi Mac menggunakan Xamarin.Mac, Visual Studio untuk Mac, dan Pembangun Antarmuka Xcode dengan menelusuri proses pembuatan aplikasi Hello, Mac sederhana yang menghitung berapa kali tombol telah diklik:

Konsep berikut akan dibahas:

• Visual Studio untuk Mac – Pengantar Visual Studio untuk Mac dan cara membuat aplikasi Xamarin.Mac dengannya.
• Anatomi Aplikasi Xamarin.Mac – Apa yang terdiri dari aplikasi Xamarin.Mac.
• Penyusun Antarmuka Xcode – Cara menggunakan Penyusun Antarmuka Xcode untuk menentukan antarmuka pengguna aplikasi.
• Outlet dan Tindakan – Cara menggunakan Outlet dan Tindakan untuk menyambungkan kontrol di antarmuka pengguna.
• Penyebaran/Pengujian – Cara menjalankan dan menguji aplikasi Xamarin.Mac.

Persyaratan

Pengembangan aplikasi Xamarin.Mac memerlukan:

• Komputer Mac yang menjalankan macOS High Sierra (10.13) atau yang lebih tinggi.
• Xcode 10 atau lebih tinggi.
• Versi terbaru Xamarin.Mac dan Visual Studio untuk Mac.

Untuk menjalankan aplikasi yang dibangun dengan Xamarin.Mac, Anda akan memerlukan:

• Komputer Mac yang menjalankan macOS 10.7 atau lebih tinggi.

Peringatan

Rilis Xamarin.Mac 4.8 yang akan datang hanya akan mendukung macOS 10.9 atau yang lebih tinggi. Versi Xamarin.Mac sebelumnya mendukung macOS 10.7 atau yang lebih tinggi, tetapi versi macOS yang lebih lama ini tidak memiliki infrastruktur TLS yang memadai untuk mendukung TLS 1.2. Untuk menargetkan macOS 10.7 atau macOS 10.8, gunakan Xamarin.Mac 4.6 atau yang lebih lama.

Memulai Aplikasi Xamarin.Mac baru di Visual Studio untuk Mac

Seperti yang dinyatakan di atas, panduan ini akan menelusuri langkah-langkah untuk membuat aplikasi Mac yang disebut Hello_Mac yang menambahkan satu tombol dan label ke jendela utama. Ketika tombol diklik, label akan menampilkan berapa kali tombol telah diklik.

Untuk memulai, lakukan langkah-langkah berikut:

1. Mulai Visual Studio untuk Mac:

   

2. Klik tombol Proyek Baru... untuk membuka kotak dialog Proyek Baru, lalu pilih Aplikasi Kakao Aplikasi>Mac>dan klik tombol Berikutnya:

   

3. Masukkan Hello_Mac untuk Nama Aplikasi, dan pertahankan yang lain sebagai default. Klik Berikutnya:

   

4. Konfirmasi lokasi proyek baru di komputer Anda:

   

5. Klik tombol Buat.

Visual Studio untuk Mac akan membuat aplikasi Xamarin.Mac baru dan menampilkan file default yang ditambahkan ke solusi aplikasi:

Visual Studio untuk Mac menggunakan struktur Solusi dan Proyek yang sama dengan Visual Studio 2019. Solusinya adalah kontainer yang dapat menampung satu atau beberapa proyek; proyek dapat mencakup aplikasi, pustaka pendukung, aplikasi pengujian, dll. Templat File > Proyek Baru membuat solusi dan proyek aplikasi secara otomatis.

Anatomi Aplikasi Xamarin.Mac

Pemrograman aplikasi Xamarin.Mac sangat mirip dengan bekerja dengan Xamarin.iOS. iOS menggunakan kerangka kerja CocoaTouch, yang merupakan cocoa versi pelangsing, yang digunakan oleh Mac.

Lihat file dalam proyek:

• Main.cs berisi titik masuk utama aplikasi. Saat aplikasi diluncurkan, Main kelas berisi metode pertama yang dijalankan.
• AppDelegate.cs berisi AppDelegate kelas yang bertanggung jawab untuk mendengarkan peristiwa dari sistem operasi.
• Info.plist berisi properti aplikasi seperti nama aplikasi, ikon, dll.
• Entitlements.plist berisi hak untuk aplikasi dan memungkinkan akses ke hal-hal seperti Sandboxing dan dukungan iCloud.
• Main.storyboard mendefinisikan antarmuka pengguna (Windows dan Menu) untuk aplikasi dan menjabarkan interkoneksi antara Windows melalui Segues. Papan cerita adalah file XML yang berisi definisi tampilan (elemen antarmuka pengguna). File ini dapat dibuat dan dikelola oleh Interface Builder di dalam Xcode.
• ViewController.cs adalah pengontrol untuk jendela utama. Pengontrol akan dibahas secara rinci di artikel lain, tetapi untuk saat ini, pengontrol dapat memikirkan mesin utama dari tampilan tertentu.
• ViewController.designer.cs berisi kode pipa pipa yang membantu diintegrasikan dengan antarmuka pengguna layar utama.

Bagian berikut, akan melihat sekilas beberapa file ini. Nantinya, mereka akan dieksplorasi secara lebih rinci, tetapi ada baiknya untuk memahami dasar-dasar mereka sekarang.

Main.cs

File Main.cs sangat sederhana. Ini berisi metode statis Main yang membuat instans aplikasi Xamarin.Mac baru dan meneruskan nama kelas yang akan menangani peristiwa OS, yang dalam hal ini adalah AppDelegate kelas :

using System;
using System.Drawing;
using Foundation;
using AppKit;
using ObjCRuntime;

namespace Hello_Mac
{
    class MainClass
    {
        static void Main (string[] args)
        {
            NSApplication.Init ();
            NSApplication.Main (args);
        }
    }
}

AppDelegate.cs

File AppDelegate.cs berisi AppDelegate kelas, yang bertanggung jawab untuk membuat jendela dan mendengarkan peristiwa OS:

using AppKit;
using Foundation;

namespace Hello_Mac
{
    [Register ("AppDelegate")]
    public class AppDelegate : NSApplicationDelegate
    {
        public AppDelegate ()
        {
        }

        public override void DidFinishLaunching (NSNotification notification)
        {
            // Insert code here to initialize your application
        }

        public override void WillTerminate (NSNotification notification)
        {
            // Insert code here to tear down your application
        }
    }
}

Kode ini mungkin tidak dikenal kecuali pengembang telah membangun aplikasi iOS sebelumnya, tetapi cukup sederhana.

Metode DidFinishLaunching berjalan setelah aplikasi dibuat, dan bertanggung jawab untuk benar-benar membuat jendela aplikasi dan memulai proses menampilkan tampilan di dalamnya.

Metode WillTerminate ini akan dipanggil ketika pengguna atau sistem telah membuat instans pematian aplikasi. Pengembang harus menggunakan metode ini untuk menyelesaikan aplikasi sebelum berhenti (seperti menyimpan preferensi pengguna atau ukuran jendela dan lokasi).

ViewController.cs

Kakao (dan dengan turunan, CocoaTouch) menggunakan apa yang dikenal sebagai pola Pengontrol Tampilan Model (MVC). ViewController Deklarasi mewakili objek yang mengontrol jendela aplikasi aktual. Umumnya, untuk setiap jendela yang dibuat (dan untuk banyak hal lain dalam jendela), ada pengontrol, yang bertanggung jawab atas siklus hidup jendela, seperti menunjukkannya, menambahkan tampilan baru (kontrol) ke dalamnya, dll.

Kelas ViewController adalah pengontrol jendela utama. Pengontrol bertanggung jawab atas siklus hidup jendela utama. Ini akan diperiksa secara rinci nanti, untuk saat ini lihat sekilas:

using System;

using AppKit;
using Foundation;

namespace Hello_Mac
{
    public partial class ViewController : NSViewController
    {
        public ViewController (IntPtr handle) : base (handle)
        {
        }

        public override void ViewDidLoad ()
        {
            base.ViewDidLoad ();

            // Do any additional setup after loading the view.
        }

        public override NSObject RepresentedObject {
            get {
                return base.RepresentedObject;
            }
            set {
                base.RepresentedObject = value;
                // Update the view, if already loaded.
            }
        }
    }
}

ViewController.Designer.cs

File perancang untuk kelas Jendela Utama awalnya kosong, tetapi akan secara otomatis diisi oleh Visual Studio untuk Mac saat antarmuka pengguna dibuat dengan Xcode Interface Builder:

// WARNING
//
// This file has been generated automatically by Visual Studio for Mac to store outlets and
// actions made in the UI designer. If it is removed, they will be lost.
// Manual changes to this file may not be handled correctly.
//
using Foundation;

namespace Hello_Mac
{
    [Register ("ViewController")]
    partial class ViewController
    {
        void ReleaseDesignerOutlets ()
        {
        }
    }
}

File perancang tidak boleh diedit secara langsung, karena dikelola secara otomatis oleh Visual Studio untuk Mac untuk menyediakan kode pipa yang memungkinkan akses ke kontrol yang telah ditambahkan ke jendela atau tampilan apa pun di aplikasi.

Dengan proyek aplikasi Xamarin.Mac yang dibuat dan pemahaman dasar tentang komponennya, beralihlah ke Xcode untuk membuat antarmuka pengguna menggunakan Interface Builder.

Info.plist

File Info.plist berisi informasi tentang aplikasi Xamarin.Mac seperti Nama dan Pengidentifikasi Bundelnya:

Ini juga mendefinisikan Storyboard yang akan digunakan untuk menampilkan antarmuka pengguna untuk aplikasi Xamarin.Mac di bawah menu dropdown Antarmuka Utama. Dalam contoh di atas, Main dalam menu dropdown berkaitan dengan Main.storyboard di pohon sumber proyek di Penjelajah Solusi. Ini juga menentukan ikon aplikasi dengan menentukan Katalog Aset yang berisinya (AppIcon dalam hal ini).

Entitlements.plist

File aplikasi Entitlements.plist mengontrol pemberian izin yang dimiliki aplikasi Xamarin.Mac seperti Sandboxing dan iCloud:

Untuk contoh Halo Dunia, tidak ada hak yang diperlukan. Bagian berikutnya menunjukkan cara menggunakan Penyusun Antarmuka Xcode untuk mengedit file Main.storyboard dan menentukan UI aplikasi Xamarin.Mac.

Pengantar Xcode dan Penyusun Antarmuka

Sebagai bagian dari Xcode, Apple telah membuat alat bernama Interface Builder, yang memungkinkan pengembang membuat antarmuka pengguna secara visual dalam perancang. Xamarin.Mac terintegrasi secara lancar dengan Interface Builder, memungkinkan UI dibuat dengan alat Objective-C yang sama dengan pengguna.

Untuk memulai, klik Main.storyboard dua kali file di Penjelajah Solusi untuk membukanya untuk pengeditan di Xcode dan Interface Builder:

Ini akan meluncurkan Xcode dan terlihat seperti cuplikan layar ini:

Sebelum mulai merancang antarmuka, ambil gambaran singkat Xcode untuk berorientasi pada fitur utama yang akan digunakan.

Catatan

Pengembang tidak perlu menggunakan Xcode dan Interface Builder untuk membuat antarmuka pengguna untuk aplikasi Xamarin.Mac, UI dapat dibuat langsung dari kode C# tetapi itu di luar cakupan artikel ini. Demi kesederhanaan, ia akan menggunakan Interface Builder untuk membuat antarmuka pengguna di seluruh tutorial ini.

Komponen Xcode

Saat membuka file .storyboard di Xcode dari Visual Studio untuk Mac, file tersebut terbuka dengan Project Navigator di sebelah kiri, Hierarki Antarmuka dan Editor Antarmuka di tengah, dan bagian Properti & Utilitas di sebelah kanan:

Bagian berikut ini melihat apa yang dilakukan masing-masing fitur Xcode ini dan cara menggunakannya untuk membuat antarmuka untuk aplikasi Xamarin.Mac.

Navigasi Proyek

Saat membuka file .storyboard untuk pengeditan di Xcode, Visual Studio untuk Mac membuat File Proyek Xcode di latar belakang untuk mengomunikasikan perubahan antara dirinya dan Xcode. Kemudian, ketika pengembang beralih kembali ke Visual Studio untuk Mac dari Xcode, setiap perubahan yang dilakukan pada proyek ini disinkronkan dengan proyek Xamarin.Mac oleh Visual Studio untuk Mac.

Bagian Navigasi Proyek memungkinkan pengembang untuk menavigasi di antara semua file yang membentuk proyek shim Xcode ini. Biasanya, mereka hanya akan tertarik pada .storyboard file dalam daftar ini seperti Main.storyboard.

Hierarki Antarmuka

Bagian Hierarki Antarmuka memungkinkan pengembang untuk dengan mudah mengakses beberapa properti utama antarmuka pengguna seperti Tempat Penampung dan Jendela utamanya. Bagian ini dapat digunakan untuk mengakses elemen individual (tampilan) yang membentuk antarmuka pengguna dan untuk menyesuaikan cara mereka bersarang dengan menyeretnya di dalam hierarki.

Editor Antarmuka

Bagian Editor Antarmuka menyediakan permukaan tempat antarmuka pengguna ditata secara grafis. Seret elemen dari bagian Pustaka dari bagian Properti & Utilitas untuk membuat desain. Saat elemen antarmuka pengguna (tampilan) ditambahkan ke permukaan desain, elemen tersebut akan ditambahkan ke bagian Hierarki Antarmuka dalam urutan muncul di Editor Antarmuka.

Properti & Utilitas

Bagian Properti & Utilitas dibagi menjadi dua bagian utama, Properti (juga disebut Pemeriksa) dan Pustaka:

Awalnya bagian ini hampir kosong, namun jika pengembang memilih elemen di Editor Antarmuka atau Hierarki Antarmuka, bagian Properti akan diisi dengan informasi tentang elemen dan properti tertentu yang dapat mereka sesuaikan.

Di dalam bagian Properti, ada delapan Tab Pemeriksa yang berbeda, seperti yang diperlihatkan dalam ilustrasi berikut:

Properti & Jenis Utilitas

Dari kiri ke kanan, tab ini adalah:

• Pemeriksa File – Pemeriksa File menampilkan informasi file, seperti nama file dan lokasi file Xib yang sedang diedit.
• Bantuan Cepat – Tab Bantuan Cepat menyediakan bantuan kontekstual berdasarkan apa yang dipilih dalam Xcode.
• Pemeriksa Identitas – Inspektur Identitas menyediakan informasi tentang kontrol/tampilan yang dipilih.
• Pemeriksa Atribut – Pemeriksa Atribut memungkinkan pengembang untuk menyesuaikan berbagai atribut kontrol/tampilan yang dipilih.
• Pemeriksa Ukuran – Pemeriksa Ukuran memungkinkan pengembang mengontrol ukuran dan mengubah ukuran perilaku kontrol/tampilan yang dipilih.
• Koneksi ions Inspector – Pemeriksa Koneksi ions menunjukkan koneksi Outlet dan Action dari kontrol yang dipilih. Outlet dan Tindakan akan dibahas secara rinci di bawah ini.
• Pemeriksa Pengikatan – Pemeriksa Pengikatan memungkinkan pengembang untuk mengonfigurasi kontrol sehingga nilainya secara otomatis terikat ke model data.
• Pemeriksa Efek Tampilan – Pemeriksa Efek Tampilan memungkinkan pengembang menentukan efek pada kontrol, seperti animasi.

Gunakan bagian Pustaka untuk menemukan kontrol dan objek yang akan ditempatkan ke perancang untuk membangun antarmuka pengguna secara grafis:

Membuat Antarmuka

Dengan dasar-dasar Xcode IDE dan Interface Builder tercakup, pengembang dapat membuat antarmuka pengguna untuk tampilan utama.

Ikuti langkah-langkah berikut untuk menggunakan Penyusun Antarmuka:

1. Di Xcode, seret Tombol Tekan dari Bagian Pustaka:

   

2. Letakkan tombol ke Tampilan (di bawah Pengontrol Jendela) di Editor Antarmuka:

   

3. Klik properti Judul di Pemeriksa Atribut dan ubah judul tombol menjadi Klik Saya:

   

4. Seret Label dari Bagian Pustaka:

   

5. Letakkan label ke Jendela di samping tombol di Editor Antarmuka:

   

6. Ambil handel kanan pada label dan seret hingga berada di dekat tepi jendela:

   

7. Pilih Tombol yang baru saja ditambahkan di Editor Antarmuka, dan klik ikon Editor Batasan di bagian bawah jendela:

   

8. Di bagian atas editor, klik Red I-Beams di bagian atas dan kiri. Saat jendela diubah ukurannya, ini akan menjaga tombol di lokasi yang sama di sudut kiri atas layar.

9. Selanjutnya, centang kotak Tinggi dan Lebar dan gunakan ukuran default. Ini menjaga tombol pada ukuran yang sama ketika jendela berubah ukuran.

10. Klik tombol Tambahkan 4 Batasan untuk menambahkan batasan dan menutup editor.

11. Pilih label dan klik ikon Editor Batasan lagi:

    

12. Dengan mengklik Red I-Beams di bagian atas, kanan dan kiri Editor Batasan, memberi tahu label untuk terjebak ke lokasi X dan Y yang diberikan dan untuk tumbuh dan menyusut saat jendela diubah ukurannya dalam aplikasi yang sedang berjalan.

13. Sekali lagi, centang kotak Tinggi dan gunakan ukuran default, lalu klik tombol Tambahkan 4 Batasan untuk menambahkan batasan dan menutup editor.

14. Simpan perubahan ke antarmuka pengguna.

Saat mengubah ukuran dan memindahkan kontrol, perhatikan bahwa Interface Builder memberikan petunjuk snap bermanfaat yang didasarkan pada Pedoman Antarmuka Manusia macOS. Panduan ini akan membantu pengembang membuat aplikasi berkualitas tinggi yang akan memiliki tampilan dan nuansa yang akrab bagi pengguna Mac.

Lihat di bagian Hierarki Antarmuka untuk melihat bagaimana tata letak dan hierarki elemen yang membentuk antarmuka pengguna ditampilkan:

Dari sini pengembang dapat memilih item untuk diedit atau diseret untuk menyusun ulang elemen UI jika diperlukan. Misalnya, jika elemen UI sedang dicakup oleh elemen lain, elemen tersebut dapat menyeretnya ke bagian bawah daftar untuk menjadikannya item terbanyak di jendela.

Dengan antarmuka pengguna yang dibuat, pengembang harus mengekspos item UI sehingga Xamarin.Mac dapat mengakses dan berinteraksi dengannya dalam kode C#. Bagian berikutnya, Outlet dan Tindakan, menunjukkan cara melakukan ini.

Outlet dan Tindakan

Jadi apa itu Outlet dan Tindakan? Dalam pemrograman antarmuka pengguna .NET tradisional, kontrol di antarmuka pengguna secara otomatis diekspos sebagai properti saat ditambahkan. Hal-hal bekerja secara berbeda di Mac, hanya menambahkan kontrol ke tampilan tidak membuatnya dapat diakses oleh kode. Pengembang harus secara eksplisit mengekspos elemen UI ke kode. Untuk melakukan ini, Apple menyediakan dua opsi:

• Outlet – Outlet dianalogikan dengan properti. Jika pengembang menghubungkan kontrol ke Outlet, itu diekspos ke kode melalui properti, sehingga mereka dapat melakukan hal-hal seperti melampirkan penanganan aktivitas, memanggil metode di atasnya, dll.
• Tindakan – Tindakan dianalogikan dengan pola perintah di WPF. Misalnya, ketika Tindakan dilakukan pada kontrol, katakanlah klik tombol, kontrol akan secara otomatis memanggil metode dalam kode. Tindakan kuat dan nyaman karena pengembang dapat menghubungkan banyak kontrol ke Tindakan yang sama.

Di Xcode, Outlet dan Tindakan ditambahkan langsung dalam kode melalui Control-dragging. Lebih khusus lagi, ini berarti bahwa untuk membuat Outlet atau Tindakan, pengembang akan memilih elemen kontrol untuk menambahkan Outlet atau Tindakan, menahan tombol Kontrol pada keyboard, dan menyeret kontrol tersebut langsung ke dalam kode.

Untuk pengembang Xamarin.Mac, ini berarti bahwa pengembang akan menyeret ke file Objective-C stub yang sesuai dengan file C# tempat mereka ingin membuat Outlet atau Tindakan. Visual Studio untuk Mac membuat file yang disebut ViewController.h sebagai bagian dari Proyek Xcode shim yang dihasilkannya untuk menggunakan Interface Builder:

File stub .h ini mencerminkan ViewController.designer.cs yang secara otomatis ditambahkan ke proyek Xamarin.Mac saat baru NSWindow dibuat. File ini akan digunakan untuk menyinkronkan perubahan yang dibuat oleh Pembangun Antarmuka dan merupakan tempat Outlet dan Tindakan dibuat sehingga elemen UI terekspos ke kode C#.

Menambahkan Outlet

Dengan pemahaman dasar tentang apa itu Outlet dan Tindakan , buat Outlet untuk mengekspos Label yang dibuat ke kode C# kami.

Lakukan:

1. Di Xcode di ujung kanan sudut atas layar, klik tombol Lingkaran Ganda untuk membuka Editor Asisten:

   

2. Xcode akan beralih ke mode tampilan terpisah dengan Editor Antarmuka di satu sisi dan Editor Kode di sisi lain.

3. Perhatikan bahwa Xcode telah secara otomatis memilih file ViewController.m di Editor Kode, yang salah. Dari diskusi tentang Outlet dan Tindakan apa yang ada di atas, pengembang harus memilih ViewController.h.

4. Di bagian atas Editor Kode klik Tautan Otomatis dan pilih ViewController.h file:

   

5. Xcode sekarang harus memilih file yang benar:

   

6. Langkah terakhir sangat penting!: jika Anda tidak memilih file yang benar, Anda tidak akan dapat membuat Outlet dan Tindakan, atau file tersebut akan diekspos ke kelas yang salah di C#!

7. Di Editor Antarmuka, tahan tombol Kontrol pada keyboard dan klik-seret label yang dibuat di atas ke editor kode tepat di bawah @interface ViewController : NSViewController {} kode:

   

8. Kotak dialog akan ditampilkan. Biarkan Koneksi ion diatur ke Outlet dan masukkan ClickedLabel untuk Nama:

   

9. Klik tombol Koneksi untuk membuat Outlet:

   

10. Simpan perubahan pada file.

Menambahkan Tindakan

Selanjutnya, ekspos tombol ke kode C#. Sama seperti Label di atas, pengembang dapat menyambungkan tombol ke Outlet. Karena kami hanya ingin menanggapi tombol yang sedang diklik, gunakan Tindakan sebagai gantinya.

Lakukan:

1. Pastikan bahwa Xcode masih berada di Editor Asisten dan file ViewController.h terlihat di Editor Kode.

2. Di Editor Antarmuka, tahan tombol Kontrol pada keyboard dan klik-seret tombol yang dibuat di atas ke editor kode tepat di bawah @property (assign) IBOutlet NSTextField *ClickedLabel; kode:

   

3. Ubah jenis Koneksi ion menjadi Tindakan:

   

4. Masukkan ClickedButton sebagai Nama:

   

5. Klik tombol Koneksi untuk membuat Tindakan:

   

6. Simpan perubahan pada file.

Dengan antarmuka pengguna dikabeli dan diekspos ke kode C#, beralih kembali ke Visual Studio untuk Mac dan biarkan menyinkronkan perubahan yang dibuat di Xcode dan Interface Builder.

Catatan

Mungkin perlu waktu lama untuk membuat antarmuka pengguna dan Outlet dan Tindakan untuk aplikasi pertama ini, dan mungkin tampak seperti banyak pekerjaan, tetapi banyak konsep baru diperkenalkan dan banyak waktu dihabiskan untuk menutupi tanah baru. Setelah berlatih sebentar dan bekerja dengan Interface Builder, antarmuka ini dan semua Outlet dan Actions-nya dapat dibuat hanya dalam satu atau dua menit.

Menyinkronkan Perubahan dengan Xcode

Ketika pengembang beralih kembali ke Visual Studio untuk Mac dari Xcode, setiap perubahan yang telah mereka buat di Xcode akan secara otomatis disinkronkan dengan proyek Xamarin.Mac.

Pilih ViewController.designer.cs di Penjelajah Solusi untuk melihat bagaimana Outlet dan Action telah dikabeli dalam kode C#:

Perhatikan bagaimana dua definisi dalam file ViewController.designer.cs :

[Outlet]
AppKit.NSTextField ClickedLabel { get; set; }

[Action ("ClickedButton:")]
partial void ClickedButton (Foundation.NSObject sender);

Sejajarkan dengan definisi dalam ViewController.h file di Xcode:

@property (assign) IBOutlet NSTextField *ClickedLabel;
- (IBAction)ClickedButton:(id)sender;

Visual Studio untuk Mac mendengarkan perubahan pada file .h, lalu secara otomatis menyinkronkan perubahan tersebut dalam file .designer.cs masing-masing untuk mengeksposnya ke aplikasi. Perhatikan bahwa ViewController.designer.cs adalah kelas parsial, sehingga Visual Studio untuk Mac tidak perlu memodifikasi ViewController.cs yang akan menimpa perubahan apa pun yang telah dilakukan pengembang ke kelas.

Biasanya, pengembang tidak perlu membuka ViewController.designer.cs, itu disajikan di sini hanya untuk tujuan pendidikan.

Catatan

Dalam kebanyakan situasi, Visual Studio untuk Mac akan secara otomatis melihat perubahan apa pun yang dibuat di Xcode dan menyinkronkannya ke proyek Xamarin.Mac. Di luar kemunculan bahwa sinkronisasi tidak terjadi secara otomatis, beralih kembali ke Xcode lalu kembali ke Visual Studio untuk Mac lagi. Ini biasanya akan memulai siklus sinkronisasi.

Menulis Kode

Dengan antarmuka pengguna yang dibuat dan elemen UI-nya yang diekspos ke kode melalui Outlet dan Tindakan, kami akhirnya siap untuk menulis kode untuk menghidapkan program.

Untuk aplikasi sampel ini, setiap kali tombol pertama diklik, label akan diperbarui untuk menunjukkan berapa kali tombol telah diklik. Untuk mencapai hal ini, buka ViewController.cs file untuk pengeditan dengan mengklik dua kali di Penjelajah Solusi:

Pertama, buat variabel tingkat kelas di ViewController kelas untuk melacak jumlah klik yang telah terjadi. Edit definisi kelas dan buat terlihat seperti berikut ini:

namespace Hello_Mac
{
    public partial class ViewController : NSViewController
    {
        private int numberOfTimesClicked = 0;
        ...

Selanjutnya, di kelas yang sama (ViewController), ambil alih ViewDidLoad metode dan tambahkan beberapa kode untuk mengatur pesan awal untuk label:

public override void ViewDidLoad ()
{
    base.ViewDidLoad ();

    // Set the initial value for the label
    ClickedLabel.StringValue = "Button has not been clicked yet.";
}

Gunakan ViewDidLoad, alih-alih metode lain seperti Initialize, karena ViewDidLoad dipanggil setelah OS dimuat dan membuat instans antarmuka pengguna dari file .storyboard . Jika pengembang mencoba mengakses kontrol label sebelum file .storyboard telah sepenuhnya dimuat dan dibuat, mereka akan mendapatkan NullReferenceException kesalahan karena kontrol label belum ada.

Selanjutnya, tambahkan kode untuk merespons pengguna yang mengklik tombol . Tambahkan metode parsial berikut ke ViewController kelas :

partial void ClickedButton (Foundation.NSObject sender) {
    // Update counter and label
    ClickedLabel.StringValue = string.Format("The button has been clicked {0} time{1}.",++numberOfTimesClicked, (numberOfTimesClicked < 2) ? "" : "s");
}

Kode ini melampirkan ke Tindakan yang dibuat di Xcode dan Interface Builder dan akan dipanggil kapan saja pengguna mengklik tombol .

Menguji Aplikasi

Saatnya membuat dan menjalankan aplikasi untuk memastikan aplikasi berjalan seperti yang diharapkan. Pengembang dapat membangun dan menjalankan semua dalam satu langkah, atau mereka dapat membangunnya tanpa menjalankannya.

Setiap kali aplikasi dibuat, pengembang dapat memilih jenis build apa yang mereka inginkan:

• Debug – Build debug dikompilasi ke dalam file .app (aplikasi) dengan banyak metadata tambahan yang memungkinkan pengembang untuk men-debug apa yang terjadi saat aplikasi sedang berjalan.
• Rilis – Build rilis juga membuat file .app , tetapi tidak menyertakan informasi debug, sehingga lebih kecil dan dijalankan lebih cepat.

Pengembang dapat memilih jenis build dari Pemilih Konfigurasi di sudut kiri atas layar Visual Studio untuk Mac:

Membangun Aplikasi

Dalam kasus contoh ini, kami hanya ingin build debug, jadi pastikan debug dipilih. Buat aplikasi terlebih dahulu dengan menekan ⌘B, atau dari menu Build , pilih Bangun Semua.

Jika tidak ada kesalahan, pesan Build Berhasil akan ditampilkan di bilah status Visual Studio untuk Mac. Jika ada kesalahan, tinjau proyek dan pastikan bahwa langkah-langkah di atas telah diikuti dengan benar. Mulailah dengan mengonfirmasi bahwa kode (baik di Xcode maupun di Visual Studio untuk Mac) cocok dengan kode dalam tutorial.

Menjalankan Aplikasi

Ada tiga cara untuk menjalankan aplikasi:

• Tekan ⌘+Enter.
• Dari menu Jalankan , pilih Debug.
• Klik tombol Putar di toolbar Visual Studio untuk Mac (tepat di atas Penjelajah Solusi).

Aplikasi akan membangun (jika belum dibangun), mulailah dalam mode debug dan tampilkan jendela antarmuka utamanya:

Jika tombol diklik beberapa kali, label harus diperbarui dengan hitungan:

Ke Mana Berikutnya

Dengan dasar-dasar bekerja dengan aplikasi Xamarin.Mac, lihat dokumen berikut untuk mendapatkan pemahaman yang lebih mendalam:

• Pengantar Storyboards - Artikel ini menyediakan pengantar untuk bekerja dengan Storyboards di aplikasi Xamarin.Mac. Ini mencakup pembuatan dan pemeliharaan UI aplikasi menggunakan papan cerita dan Penyusun Antarmuka Xcode.
• Windows - Artikel ini membahas cara bekerja dengan Windows dan Panel dalam aplikasi Xamarin.Mac. Ini mencakup pembuatan dan pemeliharaan Windows dan Panel di penyusun Xcode dan Antarmuka, memuat Windows dan Panel dari file .xib, menggunakan Windows dan merespons Windows dalam kode C#.
• Dialog - Artikel ini mencakup bekerja dengan Dialog dan Windows Modal dalam aplikasi Xamarin.Mac. Ini mencakup pembuatan dan pemeliharaan Windows Modal di penyusun Xcode dan Antarmuka, bekerja dengan dialog standar, menampilkan dan merespons Windows dalam kode C#.
• Pemberitahuan - Artikel ini membahas cara bekerja dengan Pemberitahuan dalam aplikasi Xamarin.Mac. Ini mencakup pembuatan dan menampilkan Pemberitahuan dari kode C# dan merespons Pemberitahuan.
• Menu - Menu digunakan di berbagai bagian antarmuka pengguna aplikasi Mac; dari menu utama aplikasi di bagian atas layar untuk muncul dan menu kontekstual yang dapat muncul di mana saja di jendela. Menu adalah bagian integral dari pengalaman pengguna aplikasi Mac. Artikel ini membahas cara bekerja dengan Cocoa Menus dalam aplikasi Xamarin.Mac.
• Toolbar - Artikel ini mencakup bekerja dengan Toolbar dalam aplikasi Xamarin.Mac. Ini mencakup pembuatan dan pemeliharaan. Toolbar di penyusun Xcode dan Antarmuka, cara mengekspos Item Toolbar ke kode menggunakan Outlet dan Tindakan, mengaktifkan dan menonaktifkan Item Toolbar dan akhirnya merespons Item Toolbar dalam kode C#.
• Tampilan Tabel - Artikel ini membahas cara bekerja dengan Tampilan Tabel dalam aplikasi Xamarin.Mac. Ini mencakup pembuatan dan pemeliharaan Tampilan Tabel di penyusun Xcode dan Antarmuka, cara mengekspos Item Tampilan Tabel ke kode menggunakan Outlet dan Tindakan, mengisi Item Tabel dan akhirnya merespons Item Tampilan Tabel dalam kode C#.
• Tampilan Kerangka - Artikel ini membahas cara menggunakan Tampilan Kerangka dalam aplikasi Xamarin.Mac. Ini mencakup pembuatan dan pemeliharaan Tampilan Kerangka di penyusun Xcode dan Antarmuka, cara mengekspos Item Tampilan Kerangka ke kode menggunakan Outlet dan Tindakan, mengisi Item Kerangka dan akhirnya menanggapi Item Tampilan Kerangka dalam kode C#.
• Daftar Sumber - Artikel ini membahas cara bekerja dengan Daftar Sumber dalam aplikasi Xamarin.Mac. Ini mencakup pembuatan dan pemeliharaan Daftar Sumber di penyusun Xcode dan Antarmuka, cara mengekspos Item Daftar Sumber ke kode menggunakan Outlet dan Tindakan, mengisi Item Daftar Sumber dan akhirnya menanggapi Item Daftar Sumber dalam kode C#.
• Tampilan Koleksi - Artikel ini membahas cara kerja dengan Tampilan Koleksi dalam aplikasi Xamarin.Mac. Ini mencakup pembuatan dan pemeliharaan Tampilan Koleksi di penyusun Xcode dan Antarmuka, cara mengekspos elemen Tampilan Koleksi ke kode menggunakan Outlet dan Tindakan, mengisi Tampilan Koleksi dan akhirnya merespons Tampilan Koleksi dalam kode C#.
• Bekerja dengan Gambar - Artikel ini mencakup bekerja dengan Gambar dan Ikon dalam aplikasi Xamarin.Mac. Ini mencakup pembuatan dan pemeliharaan gambar yang diperlukan untuk membuat Ikon aplikasi dan menggunakan Gambar dalam kode C# dan Penyusun Antarmuka Xcode.

Ringkasan

Artikel ini membahas dasar-dasar aplikasi Xamarin.Mac standar. Ini mencakup pembuatan aplikasi baru di Visual Studio untuk Mac, merancang antarmuka pengguna di Xcode dan Interface Builder, mengekspos elemen UI ke kode C# menggunakan Outlet dan Tindakan, menambahkan kode untuk bekerja dengan elemen UI dan akhirnya, membangun dan menguji aplikasi Xamarin.Mac.

Link Terkait

• Pedoman Antarmuka Manusia macOS