Visual html szerkesztő saját kezűleg, példák delphi, cikkek, programozás -
Kell egy kicsit. Először is - delphi 5-7 (van a 7. verzió, és az összes kódot tesztelték ebben a változatban). Ezt a változatkorlátozást az okozza, hogy a twebbrowser összetevő először "regisztrált" volt az internetes lapon az 5. verzióban (a negyedikben Activex komponensként kellett telepíteni). Szükséges továbbá, hogy az Internet Explorer 4-es és újabb verziója telepítve legyen a rendszerben, annak okai miatt, hogy ez része a webbrowser alapjainak.
Nézzük meg! Hozzon létre egy új űrlapot, helyezze el a twebbrowser összetevőt és több tspeedbutton komponenst rajta. Ezután írja be a következő kódot: egység fő;
var
1. forma: tform 1;
disp: idispatch;
szerkesztő: ihtmldocument2;
eljárás tform 1.felszerelés1dokumentumkomplet (feladó: tobject;
const pdisp: idispatch; var url: meglariant);
var
currentwb: iwebbrowser;
szerkesztő: ihtmldocument2;
kezdődik
disp: = pdisp;
végén;
eljárás tform 1.speedbutton1click (sender: tobject);
var
currentwb: iwebbrowser;
kezdődik
currentwb: = disp as iwebbrowser;
szerkesztő: = (currentwb.document, mint ihtmldocument2);
editor.designmode: = 'on';
végén;
eljárás tform 1.form létrehozása (sender: tobject);
kezdődik
webbrowser1.navigate ('about:
végén;
Normál billentyűparancsok
"Minden bizonnyal jó, hogy vannak gyorsbillentyűk, de nem szeretnék mindet emlékezni" - mondhatod. Rendben van. Akkor nézzük meg, hogyan kényszerítsük a webbrowser-t a delphi-ről, hogy végrehajtsa ezeket a lépéseket. Ehhez az ihtmltxtrange execcommand interface (a mshtml_tlb modulban le van írva). Tekintsünk egy egyszerű példát. eljárás tform 1.speedbutton2click (sender: tobject);
var
tartomány: ihtmltxtrange;
kezdődik
tartomány: = (editor.select ion.createrange mint ihtmltxtrange);
range.execcommand ("félkövér", hamis, üresparam)
végén;
Néhány szó a tartományról. Amellett, hogy a már ismerős számunkra, ez az objektum számos tulajdonsággal és módszerrel rendelkezik, amelyek közül néhányat most megfontolunk.
Tartalmaz szelekciós szöveget (HTML-címkék nélkül)
Teljes kiválasztási szöveg
movestart (const unit_: widestring;
szám: egész szám)
Mozgatja a kezdeti kiválasztási pozíciót a karakterek jobbra számolásához (ha számlál<0, то влево), unit_-единицы измерения смещения (чаще всего используется 'character': 1 символ). При этом конечная позиция не смещается.
Ugyanez, csak a végső kiválasztási pozícióra.
pastehtml (const html: widestring);
Megjeleníti a cmdid parancsban megadott parancsot
Alkalmazás.
Elérhető parancsok
Beállítja vagy megkapja az aktuális kijelölés háttérszínét. értéknek tartalmaznia kell egy színnevet vagy egy shesnadzitirichny rgb egyenértéket (például # ffcc00).
A jelenlegi kijelölés szövegét félkövér és normál között váltja.
Tekintse meg az ezen elemekkel való együttműködés általános elveit. Mint a szöveg esetében, az első dolog, hogy hozzon létre egy kiválasztó objektumot (hívja tartomány):
ihtmlcontrolrange interfész speciálisan a különböző műveleteket a kijelölt objektumokat az oldalon, de ez teljesen lehetetlen alkalmazni a munka egy szöveghozzárendelési - kapsz egy kivétel eintfcasterror egy üzenetet, hogy a kiválasztott felület nem támogatott (ugyanez történik, ha használja ihtmltxtrange számára kontrollokkal). Az ilyen helyzetek elkerülése érdekében a type_: widestring mező be van adva az ihtmlselect ionobject felületre. A kiválasztás típusától függően "kontroll" vagy "szöveg" lesz (ha nincs kiválasztva semmi, ez a mező "nincs"). Itt egy egyszerű példa arra, hogyan lehet beszúrni egy képet egy bizonyos helyen, a dokumentum (hogyan lehet megnyitni a dokumentumot Edit módban leírták az első rövid cikk):
eljárás tform 1.speedbutton13click (sender: tobject);
var
ctrlrange: ihtmlcontrolrange;
texturge: ihtmltxtrange;
kezdődik
ha editor.select ion.type _ = 'control' majd
kezdődik
ctrlrange: = (editor.select ion.createrange mint ihtmlcontrolrange);
ha nem ctrlrange.querycommandenabled ('insertimage') majd
application.messagebox ('nem támogatott!', '');
más
ctrlrange.execcommand ('insertimage', false, 'c: my filesporshe1.jpg') vége
más
kezdődik
textrange: = (editor.select ion.createrange mint ihtmltxtrange);
textrange.execcommand ('insertimage', false, 'c: my filesporshe1.jpg')
végén;
végén;
Ne feledje, hogy ha az objektumot hozzárendeli, a querycommandenabled módszert használjuk annak biztosítására, hogy ez a parancs végrehajtható legyen a kiválasztott vezérlőn. Ez annak köszönhető, hogy például a beépített keret nem helyettesíthető egy képzel. Valójában ez az ellenőrzés opcionális, de még mindig javaslom, hogy ezt a kellemetlen következmények elkerülése végett hajtsák végre. Egy másik módszer a querycommandsupported (cmdid: widestring): a boolean lehetővé teszi annak meghatározását, hogy az adott parancs támogatja-e ezt a választást. Ugyanezek a módszerek léteznek az ihtmltxtrange felületen, de ebben az esetben nem szükséges.
A táblákkal a helyzet sokkal bonyolultabb. A Microsoft, a Microsoft dokumentációja szerint a htmltable, a htmlrow és a htmlcell vezérlőket úgy tervezték, hogy táblákat hozzanak létre, amikor a kiszolgálói oldalon egy oldalt alakítanak ki. Ennek megfelelően a mi esetünkben vannak nehézségek: különösen, hogy hogyan lehet hozzáadni az eredményül kapott táblázatot a dokumentumhoz (mindenesetre nem sikerült). Opcióként javaslom a következőket: létrehozhat egy htmltable típusú táblát, dolgozzon vele úgy, mintha dokumentumot hoznánk létre a kiszolgálón, majd használhatnánk az externalhtml tulajdonságot. Ez a mező a táblázat szöveges ábrázolását tartalmazza html formátumban. Tekintsük ezt a módszert részletesebben egy példára: eljárás tform 1.speedbutton14click (sender: tobject);
var
táblázat: htmltable;
texturge: ihtmltxtrange;
sor: htmltablerow;
col: htmltablecol;
i: egész szám;
kezdődik
ha editor.select ion.type_<>akkor a "kontroll"
kezdődik
táblázat: = (editor.createelement ('table') htmltable);
i: = 0 és 3 között
kezdődik
sor: = (table.insertrow (i) mint disphtmltablerow);
col: = (sor.insertcell (0) mint disztextilakol);
col.width: = '200';
col.style.bordercolor: = '# ff0000';
col.innertext: = 'Cell #' + inttostr (i);
végén;
table.style.bordercolor: = '# 00ff00';
textrange: = (editor.select ion.createrange mint ihtmltxtrange);
textrange.pastehtml (table.outerhtml);
végén;
végén;
var
i, j: egész szám;
ovtable: meglariant;
t: htmltable;
kezdődik
// A dokumentumnak egy táblázattal kell rendelkeznie.
//
ovtable: = webbrowser1.oleobject.document. getelementsbyname ('mytable') item (0);
//webbrowser1.oleobject.document. getelementsbyname ('mytable') -
// ez elemek gyűjteménye (elvégre több elem lehet
// id egyenlő a "mytable"
az i: = 0 és (ovtable.rows.length - 1) között
j: = 0 - (ovtable.rows.item (i) .cells.length - 1) nem
ovtable.rows.item (i) .cells.item (j) .innertext: = 'új szöveg!';
végén;