Bidang kerja (workspace) aplikasi Morfik menyediakan cara efektif bagi Anda untuk berinteraksi dengan dokumen proyek, properti dan kode. Morfik menggunakan antarmuka Ribbon berbarengan dengan tumbnail dokumen pada Project View untuk menyediakan lingkungan desain yang efektif yang mampu mengakomodir kebutuhan akan pemrograman visual dan desain secara grafis.
Bidang kerja ini meletakkan operasi yang paling umum digunakan pada toolbar yang sangat visible sehingga Anda dapat dengan mudah melakukan perubahan pada proyek dan dokumen Anda. Toolbar utama aplikasi menyediakan akses pada hampir seluruh fitur pengelolaan proyek dan dokumen seperti pemformatan dokumen dan desain secara grafis.
Penataan Bidang Kerja
Bidang kerja Morfik dibagi menjadi beberapa area yang ditandai dengan angka-angka seperti pada diagram berikut ini.
 |
| Clicking on different sections of the Workspace takes you to the relevant topic |
1 - Power Menu
Power Menu dapat diakses dengan mengeklik tombol biru tua dengan simbol 'power on' di bagian paling kiri dari Ribbon. Sebuah menu drop-down menyediakan akses langsung pada sebagian besar fungsi Morfik yang terkait dengan pengelolaan dokumen dan proyek, seperti membuka dan menutup file. Beberapa pilihan menu di Power Menu ini disesuaikan dengan konteks dan akan tidak aktif jika tidak cocok pada kondisi yang ada di dalam Integrated Development Environment (IDE).
 |
| The Power Menu |
Power Menu berisi pilihan sebagai berikut (pilihan sub-menu ditandai dengan simbol | ):
 | New Project | New Web Application Membuat aplikasi web yang baru dengan server database bawaan (built-in). | |
 | New Project | New Package Memanggil wizard untuk Package baru. Untuk membuat package, sebuah file Package Ticket harus diperoleh dari Morfik. | |
 | New Project | New Project Wizard Menjalankan wizard untuk Proyek baru, yang mencakup pilihan jenis aplikasi (aplikasi web atau browser) dan dukungan database eksternal. | |
 | New Page Perintah ini membuka dialog New Page dimana Anda bisa membuat halaman baru berdasar template yang tersedia. Berbagai kategori template halaman tersedia untuk berbagai browser untuk komputer atau perangkat genggam. | |
 | New Item | New Form Membuat form baru untuk proyek yang sedang dikerjakan. Form adalah dasar dari sisi tampilan untuk aplikasi Anda. Form memungkinkan pengguna berinteraksi dengan aplikasi Anda dan melakukan tugas-tugas seperti menampilkan data, menambah dan mengubah data. | |
 | New Item | New Report Membuat Report baru di untuk proyek yang sedang dikerjakan. Report memungkinkan untuk menampilkan dan mencetak informasi yang tersimpan di database. Dengan Report, informasi ini dapat diurutkan, dikelompokkan dan direkap dengan banyak cara. Report ditampilkan lewat browser dengan format Adobe PDF, untuk memastikan yang tampil di layar sama dengan hasil di kertas. | |
 | New Item | New Table Membuat Table baru di proyek yang sedang dikerjakan. Table adalah mekanisme penyimpanan yang sesungguhnya di database. Mereka berisi baris (record) dan kolom (nama field) yang mengorganisir data yang disimpan. Database bisa berisi berbagai tabel, dan mungkin berkaitan satu sama lain. | |
 | New Item | New Query Membuat Query baru di proyek yang sedang dikerjakan. Query adalah mekanisme untuk mencari data di tabel. Mereka memungkinkan Anda untuk mengambil subset data di tabel database berdasarkan kriteria pencarian tertentu. | |
 | New Item | New Module Membuat Module baru di proyek yang sedang dikerjakan. Module adalah unit yang berdiri sendiri yang dapat dipanggil dari modul lain, termasuk modul di sisi server maupun client di Form dan Report. Mereka berguna untuk mengorganisasikan kode program Anda menjadi unit-unit logis dan untuk berbagi kode antara berbagai bagian berbeda dalam aplikasi (atau bahkan antar aplikasi). | |
 | New Item | New Web Method Membuat WebMethod baru di proyek yang sedang dikerjakan. WebMethod adalah kode yang diimplementasikan dan dijalankan di dalam aplikasi di server (bukan di dalam browser). Mereka dapat dipanggil saat dibutuhkan oleh Aplikasi Anda (baik dari WebMethod lainnya atau dari dalam browser), atau dipublikasikan sehingga dapat dipanggil dari aplikasi lain. | |
 | New Item | New Widget Membuat Widget baru dan mengisinya ke dalam editor. | |
 | Open Menampilkan kotak dialog Open File untuk membuka dokumen yang sudah ada. | |
 | Close Menutup dokumen yang sedang dibuka (atau proyek jika dokumen yang sedang dibuka adalah halaman tab Project) | |
 | Close All Menutup semua dokumen yang dibuka, menyisakan halaman tab Project. | |
 | Save Menyimpan (tanpa menutup) dokumen saat ini. | |
 | Save As | Save As Menyimpan (tanpa menutup) dokumen yang sedang dibuka dengan nama yang baru. Save As akan mengekspor dokumen ke sebuah file XML dengan ekstensi khusus Morfik (misalnya form akan punya ekstensi .mfr). Hal ini bermanfaat untuk keperluan sharing kode antar proyek, khususnya saat menggunakan format .MXS. Save As tidak mengubah nama nama dokumen di dalam proyek. Minor bug: jika ada perubahan yang belum tersimpan di dokumen ketika Save As dijalankan, ini tidak akan termasuk dalam file hasil ekspor. | |
 | Save As | Save Project As Menampilkan dialog Save Project As untuk mengganti nama proyek, menyimpan ke lokasi yang berbeda atau mengubah ke bahasa Morfik yang berbeda. | |
 | Save All Menyimpan semua (tanpa menutup) dokumen yang sedang dibuka. | |
 | Deploy Mulai menjalankan wizard untuk Deployment |
2 - Tombol Run
Tombol Run ada di samping kanan Power Menu. Tombol Run digunakan untuk menjalankan, menghentikan atau menghentikan sebentar aplikasi Anda.
 |
| Morfik Run Button |
Tombol Run hanya aktif jika ada proyek yang dibuka dan berubah-ubah antara 3 jenis kondisi:
Kondisi 1—Tekan untuk meng-compile dan mulai menjalankan aplikasi;
Kondisi 2—Tampil saat aplikasi sedang dijalankan. Tekan untuk menghentikan aplikasi;
Kondisi 3—Tampil ketika debugger berada pada posisi breakpoint. Tekan untuk melanjutkan pelaksanaan aplikasi tanpa menjelajahi bertahap kode yang tersisa.
3 - Toolbar Quick Access
Toolbar Quick Access dan tombol Customize berada di sebelah kanan tombol Power Menu. Ini akan menyediakan akses satu-klik untuk sebagian besar fungsi IDE yang sering digunakan. Toolbar ini juga dapat diatur penggunaannya.
 |
| Toolbar Quick Access dan Tombol Customize |
Untuk mengatur toolbar Quick Access, tekan tombol Customize Button (seperti yang tampil di atas) untuk menapilkan menu drop-down Customize dengan pilihan menu seperti berikut:
List of Currently Configured Commands
Daftar tombol-tombol yang telah dikonfigurasikan. Saat diaktifkan, tombol-tombol memiliki tanda centang di sampingnya. Untuk menonaktifkan tombol, klik pada tombol dan tanda centang akan hilang.
More Commands...
Menampilkan kotak dialog Morfik Options, dengan pilihan Customize.
Show Quick Access Toolbar [Above | Below] the Ribbon
Meletakkan Quick Access Toolbar di atas atau di bawah Ribbon.
Minimize Ribbon
Meminimkan bagian Ribbon, hanya menampilkan pilihan menu untuk setiap tab di bagian Ribbon. Meletakkan kursor mouse di atas menu akan memunculkan lagi pilihan menu drop-down; menyingkirkan kursor akan menyembunyikan lagi. .
Bagaimana Caranya: Mempelajari Tips dan Trik pada Ribbon Menu dan Toolbar?
Video ini adalah tour untuk gaya (style) antarmuka dari Ribbon-nya Morfik. Beberapa perintah pada Ribbon Morfik ini telah dijelaskan dan tips diberikan mengenai cara mereka dapat digunakan. Video ini juga mencakup overview tentang toolbar Quick Access dan Power Menu.
| Video tentang Ribbon-nya Morfik dan toolbar Quick Access |
4 - Ribbon
Ribbon adalah toolbar utama dalam bidang kerja Morfik. Morfik mengadopsi toolbar yang lebih tinggi ini agar dapat lebih baik dalam menampilkan informasi yang penuh grafis tentang tema (theme), penataan (layout) dan pemilihan warna.
Tab-tab pada Ribbon menampilkan perintah yang paling relevan untuk setiap bidang tugas di aplikasi. Berikut adalah daftar tab di Ribbon Morfik.
 |
| Morfik Ribbon |
Home Tab
Tab ini berisi operasi yang paling sering digunakan selama mendesain aplikasi atau website. Isi tab ini berubah sesuai dengan apa yang sedang Anda kerjakan. Meski demikian, option untuk bagian Document, Compile dan Clipboard selalu terlihat.
Tab ini menawarkan akses langsung pada operasi yang terkait dengan tema (theme). Dari tab ini Anda dapat mengubah tema dari proyek yang sedang dikerjakan atau membuat baru, memodifikasi dan menghapus tema. Isi dari tab ini tidak berubah saat Anda mengubah rancangan.
Tab ini memungkinkan Anda mengakses berbagai pilihan yang akan mempengaruhi seluruh proyek, seperti : import sumber data atau webservice, membuat RSS Feed, mengelola sumberdaya, deploy dan mengelola backup-restore database.Di tab ini Anda memiliki opsi untuk membuat dokumen proyek baru dan objek seperti Form, Report, Table dan Query yang baru. Dari tab ini Anda dapat mengakses dialog option yang dapat Anda gunakan untuk mengatur option.
Tab ini memungkinkan akses ke sejumlah fitur debugging. Dari tab ini Anda dapat menambahkan variabel ke daftar watch, menambah atau menghapus breakpoint dan mengumpulkan informasi yang Anda perlukan untuk memperbaiki masalah di aplikasi Anda. Sebagian pilihan tersedia dari tab Debug hanya saat dilakukan debug.
Tab ini menawarkan akses ke berbagai tampilan objek yang saat ini sedang diedit atau tampilan yang berlaku pada keseluruhan proyek, seperti tampilan Relationship.
Tab ini hanya terlihat jika kita mengerjakan desain Form atau Report. Tab ini menawarkan daftar control yang dapat disisipkan di dokumen yang Anda edit.Control yang tersedia saat merancang Form dan Report tidaklah sama karena perbedaan karakteristik dari kedua jenis dokumen tersebut.
5 - Project View
Project View menampilkan objek-objek yang ada di proyek Anda seperti Form, Report, Tabel dan WebMethods. Tempat ini juga menyediakan referensi visual untuk mengelola objek-objek ini termasuk kemampuan untuk membuat objek baru dan memodifikasi yang sudah ada.
 |
| Project View |
Catatan: Anda dapat mengaktifkan Project View kapan saja dengan menggunakan shortcut Ctrl+Alt+P.
Dokumen yang bisa ditampilkan secara visual secara default akan tampil dalam bentuk gambar thumbnail. Ini membuat kita mudah dan cepat dalam menempatkan Form dan Report tertentu dalam proyek degan jumlah objek yang cukup banyak. Gambar XX menampilkan Project View untuk proyek kecil.
Untuk proyek yang memiliki dokumen yang mirip terkadang sangat baik untuk menggunakan pilihan filtering yang tersedia di Home Tab pada Ribbon ketika kita berada pada Project View. Di gambar XX Anda dapat melihat Project View dari sebuah proyek dan mekanisme filtering sedang digunakan. Dalam contoh ini, dokumen dan objek yang mengandung 'staff' sebagai nama akan ditampilkan.
 |
| Project View dengan filtering |
Untuk melihat banyak objek di layar pada waktu yang bersamaan, kurangi Zoom Factor pada Project View. Pilihan ini tersedia di Home Tab pada Ribbon. Mengurangi level perbesaran akan membuat thumbnail diganti dengan icon kecil dan memungkinkan lebih banyak objek tampil di layar pada waktu bersamaan. Gambar 4 menampilkan Project View pada pengaturan perbesaran yang paling minim.
 |
| Kontrol level perbesaran Zoom untuk Project View |
Catatan: | Anda dapat menekan terus Ctrl dan menggunakan roda mouse untuk memperbesar atau memperkecil Project View. |
Designer/Editor
Designer/Editor memampukan Anda melakukan pekerjaan desain secara grafis pada objek Anda (seperti Form dan Report) dan mengerjakan kode di belakang objek tersebut dengan menggunakan text editor yang luar biasa.
Area di tengah-tengah bidang kerja disediakan khusus untuk Desainer atau Editor dari document. Isi dari bagian ini bisa berubah sesuai dokumen dan tampilan yang dipilih. Saat mengedit Form, contohnya, Sebuah desain visual dan tampilan dua kode akan tersedia. Tampilan dapat diubah dari Ribbon.
Designer/Editor dipanggil dari objek-objek berikut:
WebMethod Designer
Relationship Designer
6 - Docking Site Sebelah Kiri
Docking Site Sebelah Kiri, yang secara default berada di sebelah kiri dari bidang kerja, berisi Inspector untuk Properti, Event dan Style. Panel tersembunyi di sisi kiri dari layar jika tidak digunakan. Klik pada panel akan melebarkannya ke kanan, dan saat mousenya bergeser pergi maka akan kembali lagi. Panel itu bisa dikunci dalam posisi lebarnya dengan 'menjepit' menggunakan Tombol Pin.
 |
| Docking Site Sebelah Kiri |
Sebuah Inspector dapat dipindah dari lokasi asalnya dengan menyeret ke lokasi lain dalam bidang kerja. Untuk memfasilitasi perpindahan ini, Inspector harus lebih dulu dijepit di tempat. Untuk meletakkan kembali Inspector di tempat asalnya, klik-ganda pada kotak nama Inspector. Sebuah Inspector juga dapat ditutup dengan menekan tombol Close. Jika Anda secara tidak sengaja menutup panel, Anda dapat membukanya kembali melalui menu drop-down 'View | Panels | Panels' yang ada di Ribbon dan memilih panel yang sesuai.
Fungsi Inspector untuk Properties, Events dan Styles Inspectors adalah sebagai berikut:
Properties Inspector Overview
Inspector ini memungkinkan Anda mengubah berbagai properti dari objek seperti Form, Report dan kontrol visual lainnya. Setiap kali Anda memilih sebuah kontrol, inspector Properties secara otomatis mengupdate sendiri, menampilkan properti yang sesuai. Nama properti tampil di kolom sebelah kiri sedangkan isinya ada di kolom kanan; Daftar properti diurutkan sesuai alfabet.
Untuk mengubah properti, cukup klik pada nilainya di kolom kanan, pilih dan isi nilai yang baru. Beberapa nilai bisa diisi langsung, terkadang ada yang diisi melalui kotak dialog, yang secara otomatis tampil saat kita mengeklik nilai itu.
Events Inspector Overview
Inspector ini memungkinkan Anda memberi tindakan (action) pada sebuah kejadian (event). Ketika sebuah event dipanggil, event handler untuk event tersebut akan merespon dan menjalankan kode tindakan yang ada didalamnya.
Tindakan yang terkait dengan event handler dapat diberikan melalui dua cara.
1. Memberikan kode secara manual. Ini bisa dilakukan dengan melakukan klik-ganda pada bagian edit event, yang membuat event handler baru dalam source code dimana Anda bisa langsung menuliskan kode program yang Anda ingin jalankan ketika event itu dipanggil.
2. Mengisikan WebAction pada event. Ini dapat dicapai dengan menekan tombol elips [..] di bagian edit event, yang akan menampilkan wizard WebAction. WebAction adalah event handler yang telah didefinisikan sejak awal dan berisi tindakan yang dapat meminimalisir kebutuhan penulisan kode program sebagai respon pemanggilan event. Wizard tersebut akan menuntun Anda melalui proses pendek pemilihan sebuah tindakan penanganan event dan parameter yang terkait. Setelah selesai, wizard itu akan membuat event handler dan potongan kode program yang bisa memungkinkan tindakan untuk dijalankan. Anda bisa juga mengubah atau menambah potongan kode tersebut jika diperlukan.
Styles Inspector Overview
Inspector ini memungkinkan berbagai aspek dari penampilan dan perilaku kontrol saat dijalankan dapat dimodifikasi pada level tema (theme). Meskipun Theme digunakan oleh kontrol untuk penampilan secara umum sepanjang aplikasi, Style dapat digunakan untuk lebih mempertegas cara penampilan dan perilaku kontrol ketika program dijalankan (run-time).
Bekerja menggunakan Style dapat dicapai pada dua level. Pertama, sebagian besar kontrol Morfik tersedia dengan beragam alternatif style yang telah disediakan. Jika sebuah kontrol punya banyak style, akan ada panah di bawah atau di samping nama kontrol di Ribbon. Mengeklik panah tersebut akan membuka daftar alternatif style yang dapat Anda pilih.
7 - Docking Site Sebelah Kanan
Di sisi kanan bidang kerja, secara default, adalah Docking Site Sebelah Kanan yang berisi Inspector untuk Debug Scripts dan Debug Source.
 |
| Docking Site Sebelah Kanan |
Panel (secara default) tersembunyi di sisi kanan layar saat tidak digunakan. Mengarahkan mouse di atas panel akan membuatnya melebar ke kanan; menyingkirkan kursor membuatnya kembali lagi.
Panel dapat dikunci pada posisi melebarnya dengan 'menjepit' di tempatnya; tekan tombol Pin untuk melakukannya.
Panel-panel ini digunakan hanya digunakan saat men-debug aplikasi pada level platform compiler (Javascript dan Object Pascal untuk browser dan bagian server dari aplikasi, berturut-turut).
Inspektor untuk Debug Scripts dan Debug Source berfungsi sebagai berikut:
Debug Scripts : Inspector ini mampu menampilkan atau men-debug kode Javascript (di sisi browser) yang di-generate oleh compiler. Sebagian besar objek di aplikasi, seperti Form dan WebMethod, akan memiliki Javascript dan terdaftar di inspector. Klik-ganda file Javascript itu akan menampilkannya ke editor kode. Kode ini hanya bisa dilihat tanpa bisa diubah, karena di-generate oleh compiler. Anda dapat memberi breakpoint pada baris tertentu dengan mengeklik penanda baris, atau dengan memilih menu Debug | Add Breakpoint dari Ribbon.
CPU View
8 - Docking Site Sebelah Bawah
 |
| Bottom Docking Site |
Berada di sebelah bawah bidang kerja, secara default, Docking Site Sebelah Bawah berisi sekumpulan inspector yang dapat digunakan saat melakukan tugas-tugas pengelolaan bagi proyek Anda atau ketika men-debug. Inspectors-inspector itu meliputi:
Output
This inspector displays the output from the compiler and the linker, including any errors encountered during the compilation or linking steps. It also displays messages output by the DebugOut function.
Errors
Inspector ini menampilkan error sintaks dan peringatan secara real-time saat Anda bekerja dalam Code Editor.
Inspector ini menampilkan hasil pencarian teks. Fungsi pencarian adalah melakukan pencarian teks baik dalam file kode yang sedang dikerjakan atau pada semua file kode yang ada.
Inspector ini menampilkan isi dari log. Log ini dihasilkan saat run-time oleh debugger di sisi server, dan menyimpan setiap tahap aplikasi selama awal dijalankan. Informasi yang disimpan termasuk modul-modul (DLL) yang dipanggil dan treads yang dibuat oleh aplikasi Anda.
Inspector ini menampilkan variabel yang telah ditentukan untuk diperhatikan (watched) selama run-time. Mengawasi status aplikasi Anda dengan mengamati variabel-variabel saat aplikasi Anda dijalankan adalah teknik debug yang sangat berguna, terutama saat variabel Anda diberi nilai yang tidak dapat diduga (mungkin pada saat yang tidak terduga juga).
Inspector ini menampilkan daftar breakpoint yang telah diatur pada source code aplikasi Anda. Saat program dijalankan, ketika aplikasi sampai pada bagian breakpoint tersebut, Code Editor akan menampilkan kode di baris tersebut.
Inspector ini menampilkan level bercabang dari pemanggilan prosedur dan fungsi selama aplikasi dijalankan. Call Stack bergantung pada breakpoint yang diatur karena informasi yang ditampilkan pada Call Stact ini tergantung pada momen waktu tertentu yang sedang dijumpai; sebuah breakpoint adalah alat untuk menentukan kapan berhenti dan kondisi aplikasi dapat dipelajari. Call Stack juga dapat dipelajari saat terjadi error ketika program dijalankan; mempelajari call stack di saat seperti itu bisa menjadi teknik debug yang sangat efektif.
XML
Inspector XML memungkinkan kita melihat paket XML yang dipertukarkan antara sisi server dan browser dalam aplikasi. Komunikasi antara server dan browser dicapai melalui SOAP (Simple Object Access Protocol), yang merupakan protokol pengiriman pesan berbasis XML. Paket XML ini hanya dibuat ketika melibatkan WebMethods dan Web Service.
Inspector ini menampilkan data JSON yang diterima dan dikirim oleh server. JSON menggantikan XML sebagai format pertukaran data internal antara browser sebagai client dengan server.
Inspector ini memampukan Anda melihat pernyataan SQL yang dikirim ke server database.
Inspector ini memampukan Anda melihat semua permintaan/respon HTTP yang diterima oleh web server.
9 - Kotak Status
Kotak Status di aplikasi memberikan sejumlah informasi kontekstual tentang objek-objek. Dibagi menjadi beberapa bagian untuk menunjukkan informasi tentang perbesaran (Zoom), posisi, style, lebar dan tinggi.
 |
| Kotak Status |
Zoom Percentage : Menampilkan level perbesaran dokumen saat ini. 100% berarti dokumen ditampilkan pada ukuran aslinya.
Edit State : Menunjukkan bahwa dokumen saat ini telah dimodifikasi sejak disimpan terakhir.
Control Name and Type : Menampilkan nama dan kelas dari kontrol yang sedang dipilih.
Left and Top Positions : Menampilkan penempatan dari kontrol yang sedang dipilih, relatif terhadap kontrol yang memuatnya.
Width and Height : Menampilkan dimensi dari kontrol yang sedang dipilih.
Font Type and Size : Menampilkan informasi tentang font yang digunakan oleh kontrol yang sedang dipilih.
Sumber:
Artikel ini adalah terjemahan dari website resmi Morfik : Morfik Application Workspace
Comments