Raudus - RIA web vývoj v Delphi

vložil Radek Červinka 23. září 2012 23:11

Čas od času se dívám na některé komponenty, které podle mne mají potenciál, ale nejsou ve stavu kdy by se to dalo použít, např. nějaká zásadní funkce nefunguje. Něco podobného je resp. byl Raudus. A právě s nedávnou verzí 0.9 mne přesvědčil, že stojí za to se s ním zabývat.

Za technologickou špičku v oblasti RIA v Delphi (RIA - Rich Internet Application) stále považuji UniGui, které je ale díky použití ExtJS pro mne hůře použitelné a do integrace Sencha Touch, což bude snad za půl roku, ho nechávám být. Pro neznalé: Sencha Touch je verze ExtJS pro mobilní zařízení, která navíc má volnější licenci i pro komerční použití. Jak ExtJS, tak Touch verze představuje moderní framework pro psaní RIA aplikací (což v podstatě představuje javascript orgie) a pro použití v Delphi je komponenty zapouzdřují. Navíc nová verze UniGui umožňuje odstranit titulek a vypadá zajímavěji.

Proto mne překvapil Raudus, který na věc jde trochu jinak.

Je nutno uvést, že řada 0.8 obsahuje podporu pro ExtJS a Sensa Touch, ale řada 0.9 kromě jiných věcí přichází s vlastními prvky (zatím jen pár, ale předchozí verze ukazují, že autor tomu rozumí) a předchozí komponenty zahazuje. Přesto mi přijde toto zajímavé, jelikož kromě jiného v examples je ukázáno jak napsat vlastní komponentu jak pro ExtJS, tak pro Touch - takže to nevidím jako problém a předpokládám, že autor nějaké další dodá.

Proč o tom mluvím? Protože Raudus má vyřešen zásadní problém a to jak v design módu zobrazovat výsledek pro web.

Raudus

Raudus v design modu se stylem cupertino - určený pro web

Jak to dokáže aby v normálním designeru měl HTML prvky? Nejsem si 100% jistý ale podle mne při změně komponenty zavolá jádro prohlížeče na bázi webkitu (tj. Safary, iOS …) a výsledek si uloží a pak ho normálně zobrazuje jako bitmapu. Každopádně součástí instalace komponent je i podadresář s jádrem webkitu. Což mimochodem umožňuje to, že Raudus se dá používat v Lazarusu - (tedy pokud máte konkrétní verzi, jelikož instalace je předkompilovaná), ale designer podle screenshotů je stejný jako v Delphi - tedy na Windows, na Linuxu se dá prý jen kompilovat.

Tímto oslím můstkem se dostáváme k další zajímavosti a to je výsledná podpora.

Raudus

Kromě Delphi je tedy podporován i Lazarus. Ohledně běhu je podpora pro samostatný web server (k tomu dále) nebo modul Apache 2.2. Na rozdíl od UniGui, IntraWeb nebo WebBroker z Delphi, není HTTP server psán v Delphi, ale používá to mongoose32.dll, což je jedna knihovna bez instalace. Škoda - synapse by tomu slušela více. Navíc je možné za pomocí PhoneGAP vytvořit "boot loader" aplikace přímo pro Android nebo tak - zbytek aplikace běží na serveru.

Raudus

To je z dema na webu, já tam to pozadí nemám, ale předpokládám, že to je nějaká vývojová verze

Poznámky: Je dobré na jejich wiki přečíst sekci multithreading, resp. to jejich wiki prolézt celé. Aplikace je neuvěřitelně rychlá ohledně odezev, přičemž možnost krokování v Delphi IDE zůstává. Hrál jsem si s tím relativně dlouho a přijde mi to celkem zajímavé (snad až na problém s ModalResult při zobrazení modálního okna, což je buďto zásadní průser nebo jen chyba). Online ukázky - samples.

Vložte si na formulář TRxTheme a pro vývoj na mobil si nastavte ForceMobile, jinak bude fungovat pouze autodetekce prohlížeče. Zároveň můžete pro komponentu nastavit styl (copermino pro mobil nebo redmont pro styl ala Windows).

Mimochodem DPR soubor pro web server je následující:

program Project1;

{$APPTYPE CONSOLE}

uses
  RaApplication,
  RaApplicationExe,
  RaConfig,
  Unit3 in 'Unit3.pas' {Form3};

{$R *.res}

begin
  WriteLn('http://localhost:88/ - open in browser');
  Application.Initialize;
  Application.Config.Port := 88;
  Application.Config.WwwDiskDirectory := 'd:\components\Raudus\www';
  Application.Config.SchedulerMode := rsmRunInSuperThread;
  Application.CreateForm(TForm3, Form3);
  Application.Run;
end.

Pro Apache je to podobné, jen se jedná o library.

Kromě jiného se mi líbí i styl psaní komponent. Třeba ty dva obrázky zeleného a červeného kolečka jsou ukázková komponenta, která používá Canvas v HTML stylem předefinování virtuální metody:

procedure TRxTickCross.RaDrawExtend(var AJavascript: String);
begin
  FCheckedMate := FChecked;
  AJavascript :=

    'var me=this;' +
    'me.CHECKED=' + IfThen(FChecked, 'true', 'false') + ';' +

    'me.onRender=function(){' +
      // it is better to render TickCross only after
      // "me.getDOM()" is inserted into the DOM tree
      'me.d=setTimeout(function(){' +
        'me.d=undefined;' +
        'me.canvas=document.createElement("canvas");' +
        'me.getDOM().appendChild(me.canvas);' +
        'me.refresh();' +
      '},0);' +
    '};' +

    'me.refresh=function(){' +
      'if(me.canvas){' +
        // REPLACE "REFRESH" BODY WITH YOUR CODE TO
        // CREATE CUSTOM CANVAS-BASED CONTROL
        'var width=me.getWidth(),' +
            'height=me.getHeight(),' +
            'minim=Math.min(width,height);' +
            'ctx=me.canvas.getContext("2d");' +
        'me.canvas.width=width;' +
        'me.canvas.height=height;' +
        'if(me.CHECKED){' +
          'ctx.beginPath();' +
          'ctx.fillStyle="green";' +
          'ctx.arc(minim/2,minim/2,minim/2,0,2*Math.PI,false);' +
          'ctx.fill();' +
          'ctx.beginPath();' +
          'ctx.strokeStyle="white";' +
          'ctx.lineWidth=7*minim/40;' +
          'ctx.moveTo(8*minim/40,18*minim/40);' +
          'ctx.lineTo(18*minim/40,28*minim/40);' +
          'ctx.lineTo(32*minim/40,12*minim/40);' +
          'ctx.stroke();' +
        '}else{' +
          'ctx.beginPath();' +
          'ctx.fillStyle="red";' +
          'ctx.arc(minim/2,minim/2,minim/2,0,2*Math.PI,false);' +
          'ctx.fill();' +
          'ctx.beginPath();' +
          'ctx.strokeStyle="white";' +
          'ctx.lineWidth=7*minim/40;' +
          'ctx.moveTo(11*minim/40,11*minim/40);' +
          'ctx.lineTo(29*minim/40,29*minim/40);' +
          'ctx.moveTo(29*minim/40,11*minim/40);' +
          'ctx.lineTo(11*minim/40,29*minim/40);' +
          'ctx.stroke();' +
        '};' +
      '};' +
    '};' +

    'me.onBoundsChanged=function(){' +
      'if(me.dbc){' +
        'clearTimeout(me.dbc);' +
        'me.dbc=undefined;' +
      '};' +
      // it is better to alter controls only
      // after borwser performs a reflow
      'me.dbc=setTimeout(function(){' +
        'me.dbc=undefined;' +
        'me.refresh();' +
      '},0);' +
    '};' +

    'me.onUnrender=function(){' +
      'if(me.d){' +
        'clearTimeout(me.d);' +
        'me.d=undefined;' +
      '};' +
      'if(me.dbc){' +
        'clearTimeout(me.dbc);' +
        'me.dbc=undefined;' +
      '};' +
      'if(me.canvas){' +
        'me.canvas=undefined;' +
      '};' +
    '};';

end;

Zavěr: jedná se o beta software, není tam moc komponent, ale ty základní ano a podle všeho budou rychle přibývat. Nepochybuji, že Embarcadero půjde podobnou cestou (viz. to co předvádí s HTML5 Builderem je začátek, a oznámení podpory Linux server tomu napovídá). UniGui je pořád vepředu, ale toto by mohla být zajímavá konkurence, zvláště když se jedná momentálně o freeware. IntraWeb je sice součástí Delphi, ale táhne za sebou historickou podporu prohlížečů a jeho licencování je šílené (5 konkurenčních session max. ve verzi Professional). Když nic jiného, tak to aspoň po očku sledujte. V další verzi má být DBGrid, což sice pro mobilní zařízení není košer, ale pro web ano a snad se přidají i další komponenty. Navíc v té starší verzi je jich halda, ale zase tam není tak pěkný designer.

Mi osobně se s tím pracovalo velmi pěkně a rychle, i když jsem ohledně komponent musel dělat kompromisy (např. bych ocenil OnClick na panelu atd).


Nabízíme Delphi školení a konzultace na různá témata, primárně ve Vaší firmě.

Tagy: , , , , ,

Komponenty

Komentáře

24.9.2012 15:00:17 #

Zdeněk Vašků

Ten webkit jako background je supr nápad.

Zdeněk Vašků

25.9.2012 8:21:49 #

frankee

možná něco blbě čtu, ale na té jejich wikině je "Raudus projects require ExtJS and/or SenchaTouch library files"...

frankee

25.9.2012 10:57:16 #

Zdeněk Vašků

Já jsem pochopil, že to je jenom pro Raudus Ext a Raudus St komponenty, které autor již nebude přidávat a byly tam jen pro začátek. Teď se soustřeďuje na Raudus VCL, kde ExtJS není a vše je uděláno nativně.

Zdeněk Vašků

25.9.2012 11:36:26 #

Radekc

Pravdu má Zdeněk. Do verze 0.8x to bylo postavené na ExtJS and/or SenchaTouch, od verze 0.9 nove komponenty budou jen Raudus VCL, které ale uživatel MUZE doplnit ExtJS nebo St - viz balíček Raudus X v demech.

Radekc

26.9.2012 12:03:50 #

frankee

ach so...
v tom případě se omlouvám za moji blbost.

Mám dotaz ohledně instalace na nějaký server, už jse to někdo absolvovali (hlavně teda uniGUI) ? chci dát zákazníkovi možnost podívat se jak by mohla konverze vypadat a nevím jak na to. veřejnou ip nemám ...
jak u toho postupovat ?

frankee

26.9.2012 13:01:51 #

Radekc

Pořídit si veřejnou IP, popř. nastavit si přesměrování na routeru na konkrétní port (to umějí v podstatě všechny).
Nebo si předplatit Amazon Cloud (nebo jak se to jmenuje), nebo si vzít k zákazníkovi notebook :-)

Radekc

8.10.2012 15:10:12 #

frankee

tak jsem to celé absolvoval...

- zaregistroval virtuální server s edicí ubuntu
- nainstaloval wine
- startx nejede (512mb ram), takže instlace FCE, které jede..
-instalace vnc serveru a složitá konfigurace aby to bylo jako výchozí moňas
-instalace WINE
-po několika pokusech zkopilovat aplikaci jako apache modul pro Linux (zde cesta nevede) jsem to zkompiloval jako exe pro windowsy a spustil tam s wine emulátorem..

jak to dopadlo se můžete podívat na vladan.eu, kde je odkaz na tu aplikačku
postřehy:
- práce s více dialogy je nějaká divná.. vše jsem nakonec radši převedl do mnoho tabů jednoho dialogu.
- konfigurace serveru trvala pekelně dlouho oproti očekávání, ale mnohé jsem se naučil (instalace a provoz apache, apod)

frankee

8.10.2012 15:11:16 #

frankee

zapomněl jsem napsat hlavní poznámku, že se jedná o uniGUI a ne o raudus...

frankee

8.10.2012 15:28:17 #

Radekc

Jak tě vůbec napadlo to kompilovat jako apache modul pro Linux? To UniGui nepodporuje - jen Raudus.

Radekc

8.10.2012 15:48:48 #

frankee

právě že první verzi jsem měl v plánu udělat jako Raudus modul na lazaru v linuxu.

bohužel to nefunguje...

modul pro windowsy jede, pro linux ne.

frankee

14.10.2012 14:30:36 #

rudo

Spracoval som na Raudus-e celý systém Hotline (db: firebird) ako podporu pre existujúci systém cez webrozhranie. Beží to ako služba pod Win. Jediné na čo som neprišiel, prečo mi to ťahá max 1000 riadkov z databázy. Ak niekto viete, prosím poraďte...

rudo

Komentování ukončeno

Naše nabídka

Partial English version.

MVP
Ing. Radek Červinka - Embarcadero MVP
profil na linkedin, Twitter:@delphicz

Nabízím placené poradenství a konzultace v oblasti programování a vývoje SW.
Dále nabízíme i vývoj speciálního software na zakázku.

Neváhejte nás kontaktovat (i ohledně reklamy nebo burzy práce).

Pokud chcete podpořit tento server libovolnou částkou, můžete použít PayPal. Moc děkuji.

Delphi Certified Developer

O Delphi.cz

Delphi je jediný moderní RAD nástroj podporující tvorbu nativních aplikací pro platformu Win32, Win64 , Mac OSX a na iPhone a Android (s výhledem na další platformy díky FireMonkey) na současném trhu (včetně Windows 8.1).

V současnosti je světová komunita přes dva miliónů vývojářů.

Delphi.cz je nezávislý portál pro uživatele Delphi. Portál není koncipován pro úplné začátečníky, i když i ti se zde nebudou nudit, ale spíše na programátory, kteří již něco znají a chtějí své znalosti dále rozvíjet a sledovat novinky.

Anketa

Poslední komentáře

Comment RSS