Saját Web-böngésző készítése III

 

Az előző cikkekben emlegettem, hogy a böngészőbe fogunk írni egy weblapkészítőt is, ebben a cikkben a lapkészítőnek az elkészítését fogom bemutatni.

 

Kinézet

 

Mint ahogy az első cikkben is utaltam rá, ez a böngésző nem lesz túl csicsás, ez jellemzi majd a lapkészítőt is, mivel a program fő célja nem szépség, hanem az, hogy megtanuljuk hogyan kell használni a különböző komponenseket. Ezen felül pedig ha kész lesz, akkor saját célra tudjuk majd használni és az sem elhanyagolható szempont, hogy később módosíthatunk rajta, így a böngészőnkbe olyan feladatokat is elhelyezhetünk, amik nincsenek benne egyetlen másik böngészőben sem.

Szóval egy lehetséges kinézetet vázolok, de mindenki olyat csinál amilyet jónak lát.

 

Mit használjunk

 

Először is készítsünk egy új form-ot.

A lap megmutatására használjunk egy sima lapmegjelenítőt (Twebbrowser) viszont ezzel van egy kis probléma (tehát ne helyezzük fel most), mégpedig hogy hogyan fog frissülni a lap? Hiszen amikor készítünk egy weblapot azt meg is szeretnénk tekinteni. Amikor ezt a problémát felismertem én először arra gondoltam, hogy majd megoldom úgy, hogy egy bizonyos időre beállítom a frissítést egy timer segítségével, de hamarosan (amikor elkezdtem benne csinálni egy lapot) rájöttem, hogy ez mégsem olyan jó ötlet. Mivel a megjelenítő frissült akkor is amikor még egy hosszabb (mondjuk java) kifejezést nem zártam le, sok galibát tud okozni, arról nem is beszélve, hogy bármikor kifagyhat. Ezért gondolkozni kezdtem a problémán és arra jöttem rá, hogy amikor éppen a lapon dolgozunk, akkor nem fogjuk nézegetni azt, csak miután kész egy fejlesztés, ezért felhelyeztem a form-ra egy TabbedNotebook-ot (Win 3.1-es fül alatt van) majd beállítottam hogy takarja el a form teljes területét (Align : alClient). Majd e füleket hoztam létre: Forráskód, Nézet böngészőben, Segítség. Ezt a pages-re kattintva lehet megtenni. Majd a forráskód részre felhelyeztem egy Memo-t, de persze lehet más szövegszerkesztő is. De vigyázzunk, ha a Richedit-et használjuk, mivel amikor ment nem sima szöveget ment hanem rtf formátumot, és ezért plusz adatokat tesz a szövegbe, ezt ki lehet iktatni, ha a PlainText változóját true-ra változtatjuk (PlainText : true) ezt lehet változtatni futtatási időben is.

Ezek után fület váltottam, ezt az ActivePage-el lehet és a nézet böngészőben részre felhelyeztem a webbrowser-t, ezzel meg is oldottam a talányt, mivel a fülek váltásakor frissül a lap, hiszen véletlenül csak nem kattintunk rá.

 

Rakjuk össze a programot

 

Tehát a következőket gondoltam az OnChange eseményhez kötni:

 

memo1.Lines.SaveToFile('c:\temp.html');

webbrowser1.Navigate('c:\temp.html');

 

Illetve én ezeket kötöttem volna hozzá, de aztán jöttem rá, hogy ha megnyitok egy lapot, és abban képekkel dolgozok, akkor azokat nem fogja megtalálni a lapmegjelenítő. Ezért létrehoztam egy string változót, aminek először megadtam a c:-t, igen, nem hiba, nincs ott a perjel ezt majd később elmagyarázom. Tehát kössük ezeket az OnChange eseményhez:

 

memo1.Lines.SaveToFile(dir+'\temp.html');

webbrowser1.Navigate(dir+'\temp.html');

 

Így a perjel is a helyére kerül. A dir-nek az értékét a form létrehozásakor adjuk meg, tehát kössük a form OnCreate eseményéhez a következőket:

 

dir:='c:';

 

Mivel a lapmegjelenítő az új ablak megnyitására válaszol ezért az ilyen hívások egy Internet Explorer ablakot jelenítenek meg ezt viszont ki lehet kapcsolni, hiszen nem böngészni akarunk a megjelenítővel, hanem csak az aktuálisan szerkesztett lapot megnézni. Ennek megoldására kössük a webbrowser OnNewWindow2 eseményéhez ezt:

cancel:=true;

 

Ezáltal nem nyílik új ablak. Ezután hozzunk létre egy gombot vagy menüt a megnyitás létrehozásához. Helyezzünk fel a form-ra egy OpenDialog-ot, majd a megnyitáshoz kössük ezt:

 

If opendialog1.Execute then begin

FileNAme:=Opendialog1.FileName;

Dir:=ExtractFilePath(FileName);

memo1.Lines.LoadFromFile(opendialog1.FileName);

memo1.Lines.SaveToFile(dir+'\temp.html');

end;

 

Az ExtractFilePath visszaadja azt a könyvtárat, amelyben van a fájl, viszont a végére nem rak perjelet, tehát ezért kellett a temp.html elé rakni.

Most már csak ki kell bővíteni a menüt vagy felrakni még egy gombot a mentéshez, és felhelyezni egy SaveDialog-ot a form-ra. Majd a gomb OnClick-jéhez kötni a következőket:

 

If savedialog1.Execute then begin

SaveDialog1.FileName:=FileName;

SaveDialog1.InitialDir:=dir;

memo1.Lines.SaveToFile(savedialog1.FileName);

FileName:=SaveDialog1.FileName;

Dir:=ExtractFilePath(FileNAme);

end;

 

Ezeken túl lehet még mást is ráépíteni, mint például azt, hogy amikor ki akar lépni a felhasználó és még nem mentett, akkor megkérdezze, hogy el akarja e menteni a dokumentumot. Ezt viszont már mindenkinek a fantáziájára bízom, de a következő számban ezt is leírom, így mindenki összevetheti a saját megoldásával (ha van kedve).

 

Továbbiak

 

Lassan a végére érünk a böngészőnk készítésének, maradt még a kedvencek kezelése és a levélfogadó és az első cikkben említettem egy saját komponenst, ami a címek gyorsabb keresését teszi lehetővé, ennek a forrását és a telepítését a kedvencek kezelésével együtt fogom leírni.

 

Forrás:

 

procedure TForm6.TabbedNotebook1Change(Sender: TObject; NewTab: Integer;

  var AllowChange: Boolean);

begin

memo1.Lines.SaveToFile(dir+'\temp.html');

webbrowser1.Navigate(dir+'\temp.html');

end;

 

procedure TForm6.FormCreate(Sender: TObject);

begin

dir:='c:';

FileNAme:=’’;

end;

 

procedure TForm6.WebBrowser1NewWindow2(Sender: TObject;

  var ppDisp: IDispatch; var Cancel: WordBool);

begin

cancel:=true;

end;

 

procedure TForm6.Ments1Click(Sender: TObject);

begin

SaveDialog1.FileName:=FileName;

SaveDialog1.InitialDir:=dir;

If savedialog1.Execute then begin

FileName:=SaveDialog1.FileName;

Dir:=ExtractFilePath(FileNAme);

end;

end;

 

procedure TForm6.Megnyits1Click(Sender: TObject);

begin

If opendialog1.Execute then begin

FileName:=OpenDialog1.FileName;

Dir:=ExtractFilePath(FileNAme);

memo1.Lines.LoadFromFile(opendialog1.FileName);

end;

end;

 

Csubák Péter - chuby@chello.hu