Atlas Study Notes

Sys. Component base class and Sys. UI. Control Base Class

All the Atlas client controls are inherited fromSys. UI. ControlBase class, and Sys. UI. Control inherits fromSys. ComponentBase Class

Attributes provided by Sys. Component:

1. Id: Identifier of the Atlas component, which connects the Atlas client component to the DOM element. This id value is the same as the id attribute value of the DOM element. Atlas uses this id to find the relevant DOM element.
2. Bindings: The binding set of the component.
3. DataContext: The operation object bound to the component. If you set this attribute, all bound entries inherit this object by default, but you can also override this default setting in the binding declaration.
4. IsInitialized: Boolean value, indicating whether the component has been initialized. Read-only.
5. IsUpdating: Whether the component is being updated. It is set to true when the beginUpdate () method is called and when the endUpdate () method is called, And the other time is false. Read-only.

Properties provided by Sys. UI. Control:

1. AccessKey: Get or set the accessKey of the Control. This property is the packaging of the accessKey attribute in the DOM element.
2. AssociatedElement: Return the DOM elements of the control. This attribute should be passed in to the control constructor and cannot be modified after the constructor is constructed.
3. Behaviors: The Behavior Set of the component.
4. CssClass: Gets or sets the CSS Class of the control, which is the packaging of the class attribute in the DOM element.
5. Enabled: Indicates whether the control is enabled. This property is wrapped by the enabled attribute in the DOM element.
6. Parent: Gets or sets the parent control of the control.
7. Style: Gets the style attribute value of the DOM element corresponding to the control.
8. TabIndex: Gets or sets the tab index of the control.
9. VisibilityMode: Gets or sets the display mode when the control is hidden. Optional enumerated values:Sys. UI. VisibilityMode. CollapseIndicates that the hidden control does not occupy page space,Sys. UI. VisibilityMode. HiddenIndicates that the widget remains in its position when hidden.
10. Visible: Gets or sets whether the control is visible.

Sys. Component provides the following methods:

1. BeginUpdateAndEndUpdate: Depending on the implementation of the base class, you can call these two methods to delay or update a batch of components together to improve performance or reduce screen flickering.
2. Initialize: Constructor. It does not need to be repeated. The Inheritance class can expand this method and initialize its own members.

Sys. UI. Control also provides the following methods:

1. AddCssClass: Add a CSS Class for the control.
2. RemoveCssClass: Delete a CSS Class of the control.
3. ContainsCssClass: Returns a Boolean value, indicating whether the control has a specified CSS Class.
4. ToggleCssClass: If the control does not have the specified CSS Class, add it. If yes, delete it.
5. Focus: Enables the control to obtain the input focus.
6. ScrollIntoView: Scroll the control to the visible area of the screen.
7. OnBubbleEvent: Process the Bubble event sent by the Child control of the control.
8. RaiseBubbleEvent: This method calls the onBubbleEvent method of all the parent controls of the control to implement the Bubble event.

Sys. Component provides the following events:

1. PropertyChanged: This event should be triggered when a property of the component changes. The implementation of Atlas binding depends on this event.

InputControl, TextBox, Button, and CheckBox

Sys. UI. InputControl

The InputControl class is an abstract class. As a base class for all controls that provide user input (such as TextBox, see the following section), it provides public operations such as input data verification.

The InputControl abstract class provides the following attributes:

1. IsValid: This attribute is read-only and returns a Boolean value, indicating whether the input data is valid after verification, that is, whether it has passed all Validator verification.
2. ValidationMessage: This attribute is read-only and returns a String. When verification fails, it contains the error message of the first Validator that fails to be thrown. If verification succeeds, it is a null string.
3. Validators: Return the Validator set of the InputControl. You can use this attribute to add/Delete A Validator to verify user input information.

Sys. UI. TextBox

TextBox Control is one of the controls that must be provided by any GUI and one of our most commonly used controls for interacting with users. TextBox in Atlas encapsulates the DOM element input whose type is input, or the DOM element textarea, which inherits from the InputControl base class for input data verification.

TextBox provides the following attributes.

1. Text: Get or set text in TextBox.

It is because TextBox is very common in actual programming, So we often need to extend it. For more information about TextBox space extension, see:

Sys. UI. Button

The Button control is equally important in the GUI. Atlas expands the "Button" concept in the DOM element so that the "Button" is not only an HTML input element whose type is "button" or "submit", but can also be applied to elements such as span and, provides unified programming interfaces for developers.

The Button provides the following two attributes:

1. Command: Gets or sets the String that represents the name of the command triggered by the Button. When the parent control of the Button allows event bubbling, The onBubbleEvent event processing function of the parent control can access this attribute to obtain the name of the command passed by the Button.
2. Argument: Gets or sets the String representing the command parameter triggered by the Button. When the parent control of the Button allows event bubbling, The onBubbleEvent event processing function of the parent control can access this attribute to obtain the parameters passed by the Button.

The Button also provides the following events:

1. Click: Triggered when the Button is clicked.

Note: When a Button is clicked, The click Event of the Button is triggered first, and then the onBubbleEvent event of the Button parent control is triggered.

Sys. UI. CheckBox

The CheckBox in Atlas encapsulates the input DOM element whose type is checkbox. You can use it to enter a Boolean value.

CheckBox provides the following attributes:

1. Checked: Obtain or set a Boolean value that indicates whether the CheckBox is selected.

CheckBox also provides the following events:

1. Click: Triggered when the CheckBox is clicked.

Label, HyperLink, Select, and Image

Sys. UI. Label

The Label control in Atlas can be used to display a piece of text and can also be used as a placeholder for an HTML section. The Label control has the following attributes:

1. Text: Get or set the content in the Label. This content can be displayed in text or HTML, depending on the setting of the htmlEncode attribute.
2. HtmlEncode: Get or set a Boolean value. Whether the content in the Label is displayed in plain text. The default value is false.

Sys. UI. HyperLink

The HyperLink control inherits from Sys. UI. Label and is used to encapsulate element a in HTML. In addition to all attributes of a Label, HyperLink also provides the following attributes:

1. NavigateURL: Gets or sets the navigation URL in HyperLink, which is the packaging of the href attribute of Element.

The following events:

1. Click: Triggered when the HyperLink is clicked.

Sys. UI. Select

The Select Control encapsulates the DOM element select, which can be used to represent a Drop Down List.

The Select control has the following attributes:

1. FirstItemText: Get or set the text of the first item in the List. Can be set to something like "Please Select ......" Text to prompt the user to enter. The default value is null, that is, the text prompted for input is not displayed.
2. SelectedValue: Gets or sets the value of the selected entries in the List.
3. Data: Gets or sets a able that represents the data in the Select statement.
4. TextProperty: Gets or sets a String that represents the DataTable in the data Attribute and will be used as the name of the text field displayed in the entry in the Select statement.
5. ValueProperty: Gets or sets a String that represents the DataTable in the data Attribute and will be used as the name of the field of the value in the Select statement.

The Select control has the following events:

1. SelectionChanged: Triggered when the selected entry changes in the Select statement.

Sys. UI. Image

As an encapsulation of DOM element img, the Image control provides the following attributes:

1. ImageURL: Gets or sets a string that represents the image path. It encapsulates the src attribute of the img element.
2. AlternateText: Gets or sets a string that represents the image text description. It is an encapsulation of the alt attribute of the img element.
3. Width: Get or set the image width.
4. Height: Get or set the Image Height.