From Smart Mobile Studio
Jump to: navigation, search

Base HTML element.

Unit: W3Components.pas

Property-icon.png InnerHtml
Property-icon.png InnerText
Property-icon.png ObjectReady
Property-icon.png TagId
Protected Methods
Protected method-icon.png FinalizeObject
Protected method-icon.png InitializeObject
Protected method-icon.png StyleTagObject
Method-icon.png BeginUpdate
Method-icon.png EndUpdate


Property-icon.png TW3TagObj.InnerHtml

Specify content of element in html format. All html specific tags within property value will be processed by browser.

property InnerHTML: String read getInnerHTML write setInnerHTML;


W3Panel1.InnerHTML := 'Hello <b>World</b>';

Display result:

Display result-hello world.png


This property is different than InnerText property of same class.

Property-icon.png TW3TagObj.InnerText

Specify content of element. If value contain any html or script code they will be ignored.

property InnerText: String read getInnerText write setInnerText;


W3Panel1.InnerHTML := 'Hello <b>World</b>';

Display result:

Hello <b>World</b>

Property-icon.png TW3TagObj.ObjectReady

Determine if object (element) is fully initialized.

property ObjectReady: Boolean read FObjReady;


Value of this property is set to True at the end of TW3TagObj constructor, after InitializeObject and StyleTagObject methods are processed.

Property-icon.png TW3TagObj.TagId

Return unique id of object that match id property of DOM element for component.

property TagId: String read FTagId write FTagId;

Value of this property is set inside constructor and it consist from string OBJ and auto incremented number of object.




<div id="OBJ5" class="TW3Panel" style="visibility: visible; display: inline-
block; position: absolute; overflow: hidden; left: 16px; top: 56px; width: 200px;
height: 80px;"></div>

By targeting Element’s id with CSS selector, component may be additionally styled with css:

Example CSS:

#OBJ5 {
	margin-bottom: 20px;

Protected Methods

Protected method-icon.png TW3TagObj.FinalizeObject

Destroy child components.

procedure FinalizeObject; virtual;

Called inside destructor, before Handle is released.

It is recommended to override this method rather than overriding destructor in descendant classes.

Protected method-icon.png TW3TagObj.InitializeObject

Init object.

procedure InitializeObject; virtual;

This method is called inside TW3TagObj constructor after tag is created and style is applied.

It is recommended to override this method rather than overriding destructor in descendant classes.

Protected method-icon.png TW3TagObj.StyleTagObject

Place for setting initial styles of element.

procedure StyleTagObject; virtual;

This method is called inside constructor. Descendant classes should override this method to init css style attributes.


procedure TW3MyControl.StyleTagObject;
  inherited;['line-height'] := '50px';


Method-icon.png TW3TagObj.BeginUpdate

Start postponing updates of element.

procedure BeginUpdate;

Increase update count (private field FUpdating) which leads to postponing methods such as Refresh and similar methods. Every BeginUpdate method must be paired with EndUpdate method.

Method-icon.png TW3TagObj.EndUpdate

End postponing updates of element.

procedure EndUpdate; virtual;

Decrease update count (private field FUpdating) previously increased by counterpart BeginUpdate method. When update count is set again to 0, AfterUpdate protected virtual method is called.