Trik Supaya RaExtWindow Raudus Mengikuti Dimensi Web Browser
Sepertinya halnya membuat aplikasi desktop dengan Delphi, kadang kita perlu mengeset Form/Panel agar menutupi seluruh window yang aktif (parent). Untuk keperluan ini dalam Delphi (versi aplikasi desktop) dapat diselesaikan dengan mengeset properti ‘Align’ agar bernilai AlClient’. Misalkan ada sebuah komponen Panel dalam sebuah Form sebagai kontainer/parent utama. Jika ingin diatur supaya Panel menutupi seluruh Form, maka cukup mengeset properti ‘Align’ milik komponen Panel menjadi bernilai ‘AlClient’. Dengan demikian jika kita mengubah dimensi/ukuran Form (resize), maka otomatis ukuran Panel akan berubah juga mengikuti ukuran Form sebagai parent-nya. Demikianlah kurang lebih fungsi properti ‘Align’ dalam komponen Panel.
Bagaimana halnya jika hal yang sama kita terapkan di aplikasi web menggunakan Delphi dan Raudus? Ternyata tidak semudah seperti yang telah dijelaskan sebelumnya, karena properti ‘Align’ tidak ada dalam kontainer RaForm maupun (misalnya) RaExtWindow. Bagaimana cara mengatasinya? Berikut ini adalah trik-triknya supaya seakan-akan komponen RaExtWindow memiliki properti ‘Align:=AlClient’ agar dimensi RaExtWindow selalu mengikuti dimensi web browser.
- Buat project aplikasi web baru melalui menu File | New | Other | Raudus | RaApplication. Saya asumsikan Anda sudah menginstal framework Raudus di Delphi 7 Anda. Jika belum, Anda dapat mendapatkan CD-nya disini atau download langsung dari situs resminya (http://raudus.com).
- Ambil komponen visual RaExtWindow1, RaExtLabel1, RaExtLabel2 dan RaExtButton2 di Tab RaExt dari Component Pallete ke dalam RaForm1. Atur peletakannya seperti contoh pada gambar di bawah (sebenarnya sih terserah saja).
- Ambil komponen netral RaApplicationEvents1 dari Tab RaExt ke dalam RaForm1. Sesuai namanya, komponen ini menyediakan event khusus untuk level aplikasi (web) yaitu OnBoot dan OnScreenResize. Nah, event yang disebut terakhir inilah yang akan dimanfaatkan untuk memberikan efek supaya dimensi RaExtWindow mengikuti dimensi web browser.
- Double click event OnScreenResize milik komponen RaApplicationEvents melalui Object Inspector dan isikan kode program sebagai berikut :
procedure TRaForm1.RaApplicationEvents1ScreenResize(Sender: TObject);
begin
raextwindow1.Top:=20;
raextwindow1.Left:=20;
raextwindow1.Width:=application.ScreenWidth-40;
raextwindow1.height:=application.Screenheight-40;
end;
Fungsi Application.ScreenWidth dan Application.ScreenHeight adalah untuk mendeteksi lebar dan tinggi web browser client dan sekaligus mengeset nilai lebar dan tinggi RaExtWindow sesuai dengan nilai ini setelah dikurangi dengan nilai 40 (Anda dapat mengubah-ubah sendiri nilai ini). Karena 4 baris kode di atas diletakkan di event OnScreenResize milik komponen RaApplicationEvents, maka setiap ada event web browser berubah dimensinya (screen resize) makan dimensi RaExtWindow juga akan berubah. Dengan demikian efeknya adalah sama dengan properti ‘Align := AlClient’ pada pemrograman aplikasi desktop biasa.
Demikian tutorial kali ini semoga membantu bagi yang sedang membutuhkan. Ohya, jangan lupa menaruh kode pada point D di atas di event onBoot juga agar setiap aplikasi web running pertama kali ukuran RaExtWindow langsung mengikuti dimensi web browser.
About The Author
Saptaji, ST. M.Tr.T
a Technopreneur - writer - Enthusiastic about learning AI, IoT, Robotics, Raspberry Pi, Arduino, ESP8266, Delphi, Python, Javascript, PHP, etc. Founder of startup Indomaker.com
mas mau tanya… kira2 bisa ga saya ingin buat aplikasi databse gabungan dalam artian menggabungkan aplikasi destop dengan web base menggunakan raudus…. misal saya punya aplikasi nilai siswa nah untuk servernya aplikasi destop biasa tp untuk cliennya aplikasi web menggunakan raudus jadi di webnya hanya ada input selebihnya untuk edit atau delete ada di aplikasi destop…. terima kasih sebelumnya
bisa aja sih mas, tp jadinya ntar kurang efesien. Mending jadiin satu di aplikasi raudus-nya
mungkin maksudnya back-end / front-end mas aji, saya setuju sama mas wahyudin, n jawabannya bisa, selama database nya mendukung networking (mySQL, Postgre, Firebird, oracle, dsbg ll)
setuju mas, cuma kalo dah pake raudus kan sisi clent (front end) cukup pake browser, tdk perlu build aplikasi lg. Dan semua proses berjalan di sisi server (back end)
thanks ya mas ajie.. solusi yang saya tanyakan sudah diupload. lalu mas untuk memakai komponent treeview menggunakan raudus itu gimana caranya ya ?
komponen treeview blm tersedia mas, mungkin baru ada pada versi berikutnya
mas untuk RaExtWindow1 itu diversi Raudus yang terbaru digantikan apa, apakah RaExtWindow1 berfungsi untuk mengintegrasikan antara komponen diluar raudus agar bisa terbaca? saya pernah coba menggunakan cport untuk komunikasi serial tapi data gak bisa dikenali. mohon pencerahannya
fungsi RaExtWindow seperti window biasa pada app delphi utk desktop, bukan untuk mengintegrasikan komponen di luar raudus.
Kalo cport adl komponen utk app delphi desktop bukan utk app delphi for web seperti raudus, jadi tidak semua fungsi2nya jalan di raudus
Mas. Dalam delphi ada properti tab order untuk mengatur urutan perpindahan tab. kalau dalam raudus caranya gimana ya
Selamat malam. Mas aji, mw tanya. Bagaimana menghubungkan excel (createoleobject) dengan raudus sebagai database?? Karna saya coba selalu gagal, tapi ketika tanpa raudus bisa berjalan normal.
perlu diingat bahwa raudus adalah aplikasi yang berjalan di lingkungan server. Penanganannya berbeda dengan aplikasi desktop yang bersifat stand alone (aplikasi server sifatnya multi thread, multicast, melayani banyak client, banyak session). Balik lagi ke excel, ini masuknya kategori aplikasi standalone, hanya bisa berjalan di server, jadi memang tidak bisa dihubungkan ke raudus walaupun melalui OLE. Sebaiknya untuk database menggunakan MySQL dengan komponen ZEOS sebagai connector-nya