{"id":3548,"date":"2019-06-01T09:30:12","date_gmt":"2019-06-01T09:30:12","guid":{"rendered":"http:\/\/www.rezafaisal.net\/?p=3548"},"modified":"2019-06-01T09:32:26","modified_gmt":"2019-06-01T09:32:26","slug":"memulai-membangun-aplikasi-desktop-dengan-winforms-net-core-3","status":"publish","type":"post","link":"https:\/\/www.rezafaisal.net\/?p=3548","title":{"rendered":"Memulai Membangun Aplikasi Desktop dengan WinForms .NET Core 3"},"content":{"rendered":"<p>Aplikasi desktop dengan WinForms bukan barang baru, dia telah hadir sejak .NET Framework pertama kali muncul. Sampai saat ini .NET Framework telah mencapai versi di atas 4.7.x. Namun kalian pasti tahu sendiri bahwa .NET Framework ini hanya mau jalan di platform Windows. Tapi sekarang sudah bukan jamannya \u201cclose source\u201d, sekarang Microsoft telah membuka diri dan .NET Framework juga hadir untuk bisa berjalan di atas platform lain seperti Linux dan Mac OS, .NET Framework ini dikenal dengan nama .NET Core. Sampai saat ini telah mencapai versi 3.<\/p>\n<p>Awalnya .NET Core hanya ditujukan untuk membangun aplikasi berbasis web saja, kemudian berkembang untuk pembangunan Web API sampai IoT. Dan sekarang, menurut kabar, .NET Framework justru akan berhenti untuk dikembangkan dan semua akan beralih ke .NET Core. Hal ini terbukti dengan dukungan pengembangan WinForms di framework ini.<\/p>\n<p>Saat ini .NET Core 3 masih dalam status \u201cpreview\u201d sehingga masih ada keterbatasan jika digunakan untuk membangun aplikasi desktop WinForms. Tetapi tidak ada salahnya jika kita coba saja dan keterbatasan yang akan kita temui akan ditutupi dengan hal-hal yang sudah ada <img decoding=\"async\" class=\"wlEmoticon wlEmoticon-smile\" style=\"border-style: none;\" src=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/wlEmoticon-smile.png\" alt=\"Smile\" \/><\/p>\n<p>Hal pertama yang kita lakukan adalah mengunduh .NET Core 3 SDK yang didalamnya juga sudah tersedia .NET Core 3 Runtime. Silakan unduh di <a href=\"https:\/\/dotnet.microsoft.com\/download\/dotnet-core\/3.0\">https:\/\/dotnet.microsoft.com\/download\/dotnet-core\/3.0<\/a>. Berikut daftar tipe project yang didukung oleh .NET Core 3.<\/p>\n<p><a href=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog01.jpg\"><img loading=\"lazy\" decoding=\"async\" style=\"background-image: none; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-width: 0px;\" title=\"blog01\" src=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog01_thumb.jpg\" alt=\"blog01\" width=\"450\" height=\"229\" border=\"0\" \/><\/a><\/p>\n<p>Kemudian adalah gunakan Visual Studio 2019 agar kekinian (karena versi VS ini adalah yang terbaru dan baru saja keluar dari oven). Gunakan VS versi community yang bersifat gratis untuk digunakan. Semua versi VS 2019 dapat diunduh di <a href=\"https:\/\/visualstudio.microsoft.com\/downloads\/\">https:\/\/visualstudio.microsoft.com\/downloads\/<\/a>.<\/p>\n<p>Setelah keduanya diinstall, maka jalankan VS 2019. Kemudian setting agar VS 2019 ini dapat menggunakan SDK versi preview dengan cara klik Tools &gt; Options. Kemudian pada window Options pilih Projects and Solutios &gt; .NET Core. Jika ada checkbox yang berhubungan dengan penggunaan versi .NET Core preview maka centang checkbox itu.<\/p>\n<p>Langkah selanjutnya adalah membuat membuat solution, misal namanya adalah WinFormNetCore. Dengan cara memilih tipe project Blank Solution seperti pada gambar di bawah ini.<\/p>\n<p><a href=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog02.jpg\"><img loading=\"lazy\" decoding=\"async\" style=\"background-image: none; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-width: 0px;\" title=\"blog02\" src=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog02_thumb.jpg\" alt=\"blog02\" width=\"450\" height=\"129\" border=\"0\" \/><\/a><\/p>\n<p>Setelah itu buat project dengan nama <strong>WinFormExample<\/strong> yang merupakan tipe project <strong>Windows Forms App (.NET Core)<\/strong>. Kemudian buat sebuah project dengan nama <strong>WinFormExample.Designer <\/strong>yang merupakan tipe project <strong>Windows Forms App (.NET Framework)<\/strong>.<\/p>\n<p><a href=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog03.jpg\"><img loading=\"lazy\" decoding=\"async\" style=\"background-image: none; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-width: 0px;\" title=\"blog03\" src=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog03_thumb.jpg\" alt=\"blog03\" width=\"450\" height=\"270\" border=\"0\" \/><\/a><\/p>\n<p><strong>Perhatian:<\/strong><\/p>\n<p><strong>Jangan pernah build solution atau project Windows Form App (.NET Core) karena Visual Studio 2019 akan mengubah \u201cprilaku\u201d project ini sehingga tidak bisa dibuild dengan perintah \u201cdotnet build\u201d dan tidak bisa dijalankan dengan perintah \u201cdotnet run\u201d.<\/strong><\/p>\n<p>&nbsp;<\/p>\n<p>Kenapa harus dibuat dua project WinForms seperti di atas? Bagi yang telah terbiasa dengan pembuatan aplikasi desktop dengan WinForm maka akan terbiasa dengan form designer seperti gambar berikut.<\/p>\n<p><a href=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog04.jpg\"><img loading=\"lazy\" decoding=\"async\" style=\"background-image: none; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-width: 0px;\" title=\"blog04\" src=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog04_thumb.jpg\" alt=\"blog04\" width=\"450\" height=\"266\" border=\"0\" \/><\/a><\/p>\n<p>Hal di atas dapat dilihat hanya pada project yang menggunakan .NET Framework (bukan .NET Core), dalam kasus kita project itu adalah <strong>WinFormExample.Designer<\/strong>. Sedangkan jika Form pada project <strong>WinFormExample<\/strong> dibuka maka akan dilihat hal seperti berikut. Hal ini karena belum ada dukungan designer antarmuka WinForms pada .NET Core 3.<\/p>\n<p><a href=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog05.jpg\"><img loading=\"lazy\" decoding=\"async\" style=\"background-image: none; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border-width: 0px;\" title=\"blog05\" src=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog05_thumb.jpg\" alt=\"blog05\" width=\"450\" height=\"266\" border=\"0\" \/><\/a><\/p>\n<p>Untuk itu kita akan coba \u201cngakalin\u201d untuk menggunakan designer WinForms .NET Framework untuk mendesain antarmuka form WinForms .NET Core.<\/p>\n<p><strong><u>Langkah pertama<\/u><\/strong>, menyamakan namespace project <strong>WinFormsExample.Designer <\/strong>menjadi <strong>WinFormsExample<\/strong>. Hal ini dilakukan dengan cara klik kanan pada project WinFormsExample.Designer kemudian pilih Properties.<\/p>\n<p><a href=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog06.jpg\"><img loading=\"lazy\" decoding=\"async\" style=\"background-image: none; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border: 0px;\" title=\"blog06\" src=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog06_thumb.jpg\" alt=\"blog06\" width=\"450\" height=\"266\" border=\"0\" \/><\/a><\/p>\n<p>Kemudian ganti isi kolom Default yang bernilai <strong>WinFormsExample.Designer <\/strong>menjadi <strong>WinFormsExample<\/strong>. Kemudian Save.<\/p>\n<p><strong><u>Langkah kedua<\/u><\/strong>, menghapus Form1 yang ada dikedua project.<\/p>\n<p><strong>Langkah ketiga<\/strong>, membuat Form pada project WinFormsExample.Designer. Caranya seperti menambahkan Windows Form pada umumnya, yaitu klik kanan pada project WinFormsExample.Designer kemudian pilih Add &gt; New Item. Kemudian pilih Windows Form, berikan nama MainForm.cs (jika ingin menambahkan form baru, ulangi dari langkah ketiga ini).<\/p>\n<p><a href=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog07.jpg\"><img loading=\"lazy\" decoding=\"async\" style=\"background-image: none; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border: 0px;\" title=\"blog07\" src=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog07_thumb.jpg\" alt=\"blog07\" width=\"450\" height=\"285\" border=\"0\" \/><\/a><\/p>\n<p>Kemudian klik Add. Setelah itu kita bisa tambahkan sebuah button pada form, hal ini bertujuan agar secara otomatis dibuat file *.resx.<\/p>\n<p><strong>Langkah keempat<\/strong>, pilih form yang telah dibuat (dalam kasus ini adalah MainForm.cs) kemudian cut (Control + X). Dan dilanjutkan klik project WinFormsExample, kemudian paste (Control + V). Maka file MainForm.cs beserta file-file pendampingnya seperti MainForm.Designer.cs dan MainForm.resx. Tapi saat hal ini dilakukan hirarki file seperti ini.<\/p>\n<p><a href=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog08.jpg\"><img loading=\"lazy\" decoding=\"async\" style=\"background-image: none; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border: 0px;\" title=\"blog08\" src=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog08_thumb.jpg\" alt=\"blog08\" width=\"450\" height=\"232\" border=\"0\" \/><\/a><\/p>\n<p>Jika ingin membuat hal seperti itu maka sebelumnya perlu diinstall extension File Nesting yang dibuat oleh Mads Kristensen. Setelah diinstall, maka tinggal pilih file MainForm.Designer.cs dan MainForm.resx kemudian klik kanan dan pilih File Nesting &gt; Nest item\u2026<\/p>\n<p>Lakukan hal tersebut di atas sebelum melanjutkan ke langkah berikutnya.<\/p>\n<p><strong>Langkah kelima<\/strong>, klik kanan pada project <strong>MainFormsExample.Designer<\/strong>, kemudian pilih Add &gt; Existing Item. Kemudian pilih file form yang ada di project MainFormsExample beserta file pendampingnya seperti pada gambar di bawah ini. Kemudian pada tombol Add pilih opsi Add as Link. (jika kalian terlalu buru-buru dan mengklik tombol Add maka hapus file yang ada di project MainFormsExample.Designer, dan ulangi langkah kelima ini).<\/p>\n<p><a href=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog09.jpg\"><img loading=\"lazy\" decoding=\"async\" style=\"background-image: none; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border: 0px;\" title=\"blog09\" src=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog09_thumb.jpg\" alt=\"blog09\" width=\"450\" height=\"347\" border=\"0\" \/><\/a><\/p>\n<p>Nah dengan cara seperti ini, jika kita membuat file MainForm.cs yang ada diproject WinFormsExample maka akan terlihat prilaku normal seperti gambar berikut.<\/p>\n<p><a href=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog10.jpg\"><img loading=\"lazy\" decoding=\"async\" style=\"background-image: none; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border: 0px;\" title=\"blog10\" src=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog10_thumb.jpg\" alt=\"blog10\" width=\"450\" height=\"262\" border=\"0\" \/><\/a><\/p>\n<p>Nah selanjutnya pemrograman dapat dilakukan dengan normal seperti pembangunan aplikasi desktop WinForms pada umumnya. Tapi untuk proses build dan run program project WinFormsExample ini harus tetap dilakukan dengan menggunakan perintah \u201cdotnet\u201d. Seperti contoh pada gambar di bawah.<\/p>\n<p><a href=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog11.jpg\"><img loading=\"lazy\" decoding=\"async\" style=\"background-image: none; padding-top: 0px; padding-left: 0px; display: inline; padding-right: 0px; border: 0px;\" title=\"blog11\" src=\"http:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog11_thumb.jpg\" alt=\"blog11\" width=\"450\" height=\"266\" border=\"0\" \/><\/a><\/p>\n<p>Nah selamat mencoba, semoga .NET Core 3 cepat menuju ke versi stabil sehingga langkah-langkah di atas tidak perlu kita lakukan lagi.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Aplikasi desktop dengan WinForms bukan barang baru, dia telah hadir sejak .NET Framework pertama kali muncul. Sampai saat ini .NET Framework telah mencapai versi di atas 4.7.x. Namun kalian pasti tahu sendiri bahwa .NET Framework ini hanya mau jalan di&hellip;<\/p>\n","protected":false},"author":1,"featured_media":3547,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[6],"tags":[173,174,175],"class_list":["post-3548","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-softwaredev","tag-net","tag-net-core","tag-win-forms"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"https:\/\/www.rezafaisal.net\/wp-content\/uploads\/2019\/06\/blog11_thumb.jpg","jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p1sNAL-Ve","_links":{"self":[{"href":"https:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/posts\/3548","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.rezafaisal.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3548"}],"version-history":[{"count":2,"href":"https:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/posts\/3548\/revisions"}],"predecessor-version":[{"id":3551,"href":"https:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/posts\/3548\/revisions\/3551"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.rezafaisal.net\/index.php?rest_route=\/wp\/v2\/media\/3547"}],"wp:attachment":[{"href":"https:\/\/www.rezafaisal.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3548"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.rezafaisal.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=3548"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.rezafaisal.net\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=3548"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}