twebbrowser

Create a new project in Delphi, then put a WebBrowser and two buttons to the form. Double click the form, in the formcrate procedure add the navigate codes. Then double click the button1 and button2, assign proper codes in its onclick handler.

procedure TForm1.FormCreate(Sender: TObject);
begin
  WebBrowser1.Navigate("codeback.net");
end;

procedure TForm1.Button1Click(Sender: TObject);
begin
  with WebBrowser1 do
  begin
    OleObject.document.body.Style.scrollbarFaceColor := '#FF6699';
    OleObject.Document.body.Style.scrollbarTrackColor := '#CCCC99';
    OleObject.document.body.Style.scrollbarHighlightColor := '#99FF99';
    OleObject.document.body.Style.scrollbar3DLightColor := '#6699CC';   
    OleObject.Document.body.Style.scrollbarShadowColor := '#6600FF';
    OleObject.document.body.Style.scrollbarDarkShadowColor := '#00CC66';   
    OleObject.document.body.Style.scrollbarArrowColor := '#336699';
  end;
end;

procedure TForm1.Button2Click(Sender: TObject);
begin
  WebBrowser1.OleObject.Document.Body.Style.OverflowX := 'hidden';
  WebBrowser1.OleObject.Document.Body.Style.OverflowY := 'hidden';
end;

Run the program, click button1 and button2, see what happen.

You may be interesting in the following articles:
how to capture a webpages content and save it to an image
how-to-use-twebbrowser-to-load-a-document-from-memoryfrom-a-string
How to get the inner html source of a selected object in a TWebbrowser?
how-to-add-alternative-text-to-an-image-in-twebbrowser-in-delphi
How to add alternative text to an image in TWebBrowser in Delphi
how-to-open-a-new-web-page-in-your-custom-window-with-twebbrowser-in-delphi
How to use TWebBrowser to load a document from memory(from a string)?
hot-to-get-the-image-properties-in-twebbrowser-in-delphi
how-to-make-twebbrowser-get-focus-in-delphi
use-the-twebbrowser-as-a-html-editor-in-delphi
how-to-get-a-webpages-html-source-by-using-twebbrowser-component-in-delphi

 

Well, let us just to see the example. This example use a TButton and a TWebBrowser component in a form. Double click the button, add the following codes.

procedure TForm1.Button1Click(Sender: TObject);
strHtml String;
begin
  if Webbrowser1.OleObject.Document.Selection.type = 'Control' then
  begin
    strHtml = Webbrowser1.OleObject.Document.Selection.CreateRange.CommonParentElement.innerHtml;      ShowMessage('The selected object's inner html source is: ' + strHtml);
  end
  else
  begin
    strHtml = Webbrowser1.OleObject.Document.Selection.createRange.innerHtml;
    ShowMessage('The selected text's inner html source is: " + strHtml);
  end;
end;

Ok, run the program to check the result. Good luck!

 

I am writing a simple web editor like dreamweaver, I used the TWebBrowser as the editing component. When I run the program, the webbrowser component's design mode has already been set to on, and I can also edit the html elements in my webbrowser window now.

While one problem I found was that I could not move the element by drag and drop. When I select an element in the window and then hold the left mouse button down, then try to move the element to another place by drag the frag of this element, but fail. I found the mouse cursor changed as a crNo shap.

Since I used to use this function in Delphi, I check my codes carefully and found nothing wrong. Late I found out a program I wrote before, and make comparation between these two progrmas many times. Finally I found, I forget to call the OleInitialize function which I remember I already wrote in the form create event.

So, to add these 2 functions, I make my program works on drag and drop editing mode.
OleInitialize(nil);
OleUninitialize;

You could also see carefully specification to these 2 functions in article TCppWebBrowser/TWebBrowser has been set to the edit mode, but the copy and paste do not work .

 

Usually when we open a new URL in our program using TWebBrowser, it runs  the Internet Explorer(or the program which has been registered to be the default browser) and navigate to the new url. This is always not what we want. Following codes shows how to open the new window by ourself's custom window.

proceduer TForm1.FormShow(Sender :TObject);
begin
  WebBrowser1.Navigate('http://codeback.net');
end;

procedure TForm1.WebBrowser1NewWindow2(Sender: TObject;
  var ppDisp: IDispatch; var Cancel: WordBool);
var
  NewWindow: TForm1;
begin
  // a new instance of the form will be created
  NewWindow := TForm1.Create(self);
  NewWindow.Show;

  ppDisp := NewWindow.Webbrowser1.DefaultDispatch;
end;

If you are using C++Builder instead of Delphi, check here for the solusion Open new url in my custom window usging TCppWebBrowser in C-Builder .

 

This example shows how to get the image properties using TWebbrowser in delphi.

Create a new project in Delphi. Put a webbrowser, a button, a listbox onto the form. Then put the codes to the proper position.

uses
  MSHTML_TLB;

//In the FormCreate Handler, assign the following codes to
//make the browser navigate to a web page
procedure TForm1.FormCreate(Sender: TObject);
begin
  Webbrowser1.Navigate('www.codeback.net');
end;

//Double click button1 to assign the following code:
procedure TForm1.Button1Click(Sender: TObject);
var
  ImgWidth, ImgHeight: Integer;
  ImgHref, ImgFileSize, ImgAltText: string;
  doc: IHtmldoc2;
  i: integer;
begin
  //Getting all images in the Webbrowser1
  for i := 0 to WebBrowser1.OleObject.doc.Images.Length - 1 do
  begin
    doc := WebBrowser1.doc as IHtmldoc2;

    //Getting image width.
    ImgWidth := WebBrowser1.OleObject.doc.Images.Item(i).Width;

    //Getting image height.
    ImgHeight := WebBrowser1.OleObject.doc.Images.Item(i).Height;

    //Getting image file size.
    ImgFileSize := (doc.Images.Item(i, 0) as IHTMLImgElement).FileSize;

    //Getting URL of the image
    ImgHref := (doc.Images.Item(i, 0) as IHTMLImgElement).Href;

    //Getting alternative text of this image.
    ImgAltText := (doc.Images.Item(i, 0) as IHTMLImgElement).alt;

    //Display all information in a TListbox
    ListBox1.Items.Add(Format('%s : %d x %d Pixels; %s Bytes; %s',
      [ImgHref, ImgWidth, ImgHeight, ImgFileSize, ImgAltText]));
  end;
end;

Run the program, see what happen.

 

This example shows how to use the execCommand and pasteHTML method to put an alternative text to an image in TWebBrowser control in Delphi.

procedure TForm1.Button1Click(Sender: TObject);
var
  HtmlDoc: IHTMLDocument2;
  HtmlSelObj: IHTMLSelectionObject;
  HtmlTxtRng: IHTMLTxtRange;
begin
  HtmlDoc := WebBrowser1.Document as IHTMLDocument2;
  HtmlDoc.execCommand('InsertImage', False, '');
  HtmlSelObj := HtmlDoc.selection;
  if HtmlSelObj.type_ = 'Control' then
    HtmlSelObj.Clear;
  HtmlTxtRng := HtmlSelObj.createRange as IHTMLTxtRange;
  HtmlTxtRng.pasteHTML('This is the alternative text ');
end;

Note that the function HtmlDoc.execCommand('InsertImage', False, ''), when the second parameter is set to true, the TWebBrowser document will prompt a dialog for select an image to insert.

 

  Since TWebBrowser is inherited methods from TControl, you may think immediately to use the method 'SetFocus' to make it get the focus. Unfortunately, it does not work. So we have to find out some way else to accomplish this task. I have found three ways to make it focused.

1. The first way need to write a function to get it.

  procedure TForm1.WebBrowserSetFocus;
  begin
   if WebBrowser1.Document nil then
    with WebBrowser1.Application as IOleobject do
     DoVerb(OLEIVERB_UIACTIVATE, nil, WebBrowser1, 0, Handle, GetClientRect);
  end;

2. Another easy way to get it.

  if WebBrowser1.Document nil then
   IHTMLWindow2(IHTMLDocument2(WebBrowser1.Document).ParentWindow).focus

3. The best way I found to get it.

  if WebBrowser1.Document nil then
   IHTMLWindow4(WebBrowser1.Document).focus

Ok, when you need to determind if a webbrowser has the focus, use the following code:

  if IHTMLWindow4(WebBrowser1.Document).hasfocus then
 

 

We konw that use the TWebBrowser to load a html file is easy by the Navigate funtion. While sometimes we need to load a variant string(html formate of contents) from the memory and show it on the webbrowser. Of course you can do it by saving the string to temporary html file and then loading it. Yet this method seens not so good. Here is a better way to do that, also it could get a faster speed.

Create a new project, drag a TWebBrowser component onto the form. Adding a procedure named loadStringHtml showed below and adding the shows code in the onFormCreate event.

procedure loadStringHtml(WebBrowser: TWebBrowser; HTMLCode: string) ;
var
   strList:   TStringList;
   memStream: TMemoryStream;
begin
   WebBrowser.Navigate('about:blank') ;
   while WebBrowser.ReadyState < READYSTATE_INTERACTIVE do
    Application.ProcessMessages;

   if Assigned(WebBrowser.Document) then
   begin
     strList := TStringList.Create;
     try
       memStream := TMemoryStream.Create;
       try
         strList.Text := HTMLCode;
         strList.SaveToStream(memStream) ;
         memStream.Seek(0, 0) ;
         (WebBrowser.Document as IPersistStreamInit).Load(TStreamAdapter.Create(memStream)) ;
       finally
         memStream.Free;
       end;
     finally
       strList.Free;
     end;
   end;
end;

procedure TForm1.FormCreate(Sender: TObject) ;
var
  strHtml : string;
begin
   strHtml='Programer's Home--CodeBack.NET';
   loadStringHtml(WebBrowser1,strHtml) ;
end; 

Run the project to see what happen! Enjoy your job.

 

Still, the Navigate method is used to complete this task. Create a new project, add a TWebBrowser and a TButton component to your form. Assign the following codes in the proper places.

procedure TForm1.FormCreate(Sender: TObject) ;
begin
   WebBrowser1.Navigate('http://codeback.com');
end;

procedure TForm1.Button1Click(Sender: TObject) ;
begin
   WebBrowser1.Navigate('about:blank');
end;

In fact, the navigate method is very important a method in TWebBrowser component.

 

 

If you want to preview a Microsoft word document in your programs, an easy way is to use the TWebBrowser component as the container. TWebBrowser is the internet explorer engine, you just need to use its navigate method to assign a Word document, it would identify the format automatically. Let us see the codes.

Create a new project, drag a TWebBrowser onto the form. Adding codes as below. Here we assume you have a word document saved in "c:\docuemnts\myword.doc". Of course you could put a button on the form then use its OnClick event to specify a document in the running time.

procedure TWordPreviewForm.FormCreate(Sender: TObject) ;
begin
   //This codes would open a Word document you specify in WebBrowser1.
   WebBrowser1.Navigate('c:\docuemnts\myword.doc') ;
end;

In the onNavigateComplete2 event, you could adding these codes to control some attributes of the opened document.
procedure TWordPreviewForm.WebBrowser1NavigateComplete2(Sender: TObject;
   const pDisp: IDispatch; var URL: OleVariant) ;
begin
     with (WebBrowser1.Document AS _Document) do
     begin
       //Hides all non-printing characters such as enters, bookmarks, tab characters, etc.
       ActiveWindow.View.ShowAll := False;

       //Hides the table grid lines. 
       ActiveWindow.View.TableGridlines := False;

       //Hides the rulers.
       ActiveWindow.DisplayRulers := False;

       //Sets the "view type" to a "Print layout" mode.
       ActiveWindow.View.type_ := wdPageView;
     end;
end;

Now run your program to see if the effect is what you need.

 
Start
Prev
1