Originalmente comencé a utilizar el componente TWebBrowser para mostrar secciones de ayuda en mis aplicaciones. Este enfoque es bastante sencillo: almacenamos archivos HTML estándar en una carpeta y los invocamos según sea necesario, como WebBrowser.Navigate(HelpDir + ‘index.html’);
El archivo HTML puede incluir todo lo que necesites: imágenes, referencias cruzadas y scripts compatibles con Internet Explorer.
Las cosas se volvieron mucho más interesantes cuando quise mostrar información de la base de datos a través de él y modificar programáticamente el contenido mostrado. Resulta que todo esto es completamente posible.
Agregar estilos CSS: La inserción de CSS sigue las convenciones web estándar. Por ejemplo, puedes agregar estilos antes de la etiqueta body:
<style type="text/css">
table {
border-collapse: collapse;
border-color: #E0E0E0;
font-size: x-small;
}
td {
border: 1px solid;
padding: 2px;
}
</style>
Mostrar contenido HTML personalizado: Para pasar cualquier cadena HTML a TWebBrowser, puedes hacer lo siguiente:
var
Doc: Variant;
begin
if NOT Assigned(wBrowser.Document) then
wBrowser.Navigate('about:blank');
Doc := wBrowser.Document;
Doc.Clear;
Doc.Write('Hello <b>World</b>');
Doc.Close;
end;
Desplazarse hasta el final después de cargar la página: Puedes desplazarte automáticamente hacia el final de la página agregando JavaScript justo antes de la etiqueta body de cierre:
<script>window.scrollTo(0,document.body.scrollHeight);</script>
Ejecutar código JavaScript desde Delphi: Puedes ejecutar JavaScript arbitrario utilizando este enfoque:
var
Doc: Variant;
begin
if NOT Assigned(wBrowser.Document) then
wBrowser.Navigate('about:blank');
Doc := wBrowser.Document;
Doc.parentWindow.execScript('alert("Hello World");', 'JavaScript');
end;
Leer valores de atributos: Puedes extraer valores de atributos de elementos HTML de esta manera:
function GetElementIdValue(WebBrowser: TWebBrowser; TagName, TagId, TagAttrib: string): string;
var
Document: IHTMLDocument2;
Body: IHTMLElement2;
Tags: IHTMLElementCollection;
Tag: IHTMLElement;
I: Integer;
begin
Result := '';
if not Supports(WebBrowser.Document, IHTMLDocument2, Document) then
raise Exception.Create('Invalid HTML document');
if not Supports(Document.body, IHTMLElement2, Body) then
raise Exception.Create('Cannot find element');
Tags := Body.getElementsByTagName(UpperCase(TagName));
for I := 0 to Pred(Tags.length) do begin
Tag := Tags.item(I, EmptyParam) as IHTMLElement;
if Tag.id = TagId then
Result := Tag.getAttribute(TagAttrib, 0);
end;
end;
// Ejemplo de uso:
Result := GetElementIdValue(WebBrowser1, 'input', 'result', 'value');
Comunicación desde JavaScript a Delphi: La parte más interesante: ¿cómo enviar datos o desencadenar eventos desde código JavaScript nuevamente a tu aplicación Delphi? Puedes lograr esto interceptando la navegación de enlaces a través del controlador de eventos OnBeforeNavigate2. Analiza la URL para extraer la información requerida y utiliza Cancel := true; para evitar la navegación real si es necesario. Es mejor utilizar un prefijo especial en la URL para distinguir estas llamadas de la navegación regular. Aquí hay un ejemplo del controlador:
procedure TMyForm.WebBrowserBeforeNavigate2(Sender: TObject; const pDisp: IDispatch; var URL, Flags, TargetFrameName, PostData, Headers: OleVariant; var Cancel: WordBool);
var
prefix: string;
colonPos: Integer;
begin
colonPos := Pos(':', URL);
if colonPos > 0 then begin
prefix := Copy(URL, 1, colonPos - 1);
if prefix = 'event' then begin
ShowMessage(Copy(URL, colonPos + 1, Length(URL) - colonPos));
Cancel := TRUE;
end;
end;
end;
El código HTML que desencadena este controlador de eventos podría parecer:
<input id="testButton" type="button" value="test" />
Nota: Una limitación de este enfoque aparece cuando se ejecuta en entornos de Terminal Server con políticas de seguridad estrictas. Los usuarios pueden encontrar un diálogo de advertencia de Internet Explorer durante la inicialización de la ventana, aunque a menudo es posible agregar la aplicación a las excepciones de seguridad.
