The `goog.ui` Namespace

The `goog.ui.AbstractSpellChecker` Class

Abstract base class for spell checker editor implementations. Provides basic functionality such as word lookup and caching. … more

The `goog.ui.ActivityMonitor` Class

Once initialized with a document, the activity monitor can be queried for the current idle time. … more

The `goog.ui.AdvancedTooltip` Class

Advanced tooltip widget with cursor tracking abilities. Works like a regular tooltip but can track the cursor position and direction to determine if the tooltip should be dismissed or remain open. … more

The `goog.ui.AnimatedZippy` Class

Zippy widget. Expandable/collapsible container, clicking the header toggles the visibility of the content. … more

The `goog.ui.AttachableMenu` Class

Deprecated. Use goog.ui.PopupMenu.

An implementation of a menu that can attach itself to DOM element that are annotated appropriately. The following attributes are used by the AttachableMenu menu-item - Should be set on DOM elements that function as items in the menu that can be selected. classNameSelected - A class that will be added to the element's class names when the item is selected via keyboard or mouse. … more

The `goog.ui.AutoComplete` Class

Deprecated. Use {@link goog.ui.ac.AutoComplete} instead.

This is a stub for backward compatibility. For actual documentation, please see {@link goog.ui.ac.AutoComplete}. … more

The `goog.ui.BaseRoundedPanel` Class

Base class for the hierarchy of RoundedPanel classes. Do not instantiate directly. Instead, call goog.ui.RoundedPanel.create(). The HTML structure for the RoundedPanel is:

- div (Contains the background and content. Class name: goog-roundedpanel)
  - div (Contains the background/rounded corners. Class name:
      goog-roundedpanel-bg)
  - div (Contains the content. Class name: goog-roundedpanel-content)

… more

The `goog.ui.BidiInput` Class

Default implementation of BidiInput. … more

The `goog.ui.Bubble` Class

The Bubble provides a general purpose bubble implementation that can be anchored to a particular element and displayed for a period of time. … more

The `goog.ui.Button` Class

A button control, rendered as a native browser button by default. … more

The `goog.ui.ButtonRenderer` Class

Default renderer for {@link goog.ui.Button}s. Extends the superclass with the following button-specific API methods:

{@code getValue} - returns the button element's value
{@code setValue} - updates the button element to reflect its new value
{@code getTooltip} - returns the button element's tooltip text
{@code setTooltip} - updates the button element's tooltip text
{@code setCollapsed} - removes one or both of the button element's borders

For alternate renderers, see {@link goog.ui.NativeButtonRenderer}, {@link goog.ui.CustomButtonRenderer}, and {@link goog.ui.FlatButtonRenderer}. … more

The `goog.ui.ButtonSide` Enum

Constants for button sides, see {@link goog.ui.Button.prototype.setCollapsed} for details. … more

The `goog.ui.CharCounter` Class

CharCounter widget. Counts the number of characters in a input field or a text box and displays the number of additional characters that may be entered before the maximum length is reached. … more

The `goog.ui.CharPicker` Class

Character Picker Class. This widget can be used to pick any Unicode character by traversing a category-subcategory structure or by inputing its hex value. See charpicker.html demo for example usage. … more

The `goog.ui.CheckBoxMenuItem` Class

Class representing a checkbox menu item. This is just a convenience class that extends {@link goog.ui.MenuItem} by making it checkable. … more

The `goog.ui.Checkbox` Class

3-state checkbox widget. Fires CHECK or UNCHECK events before toggled and CHANGE event after toggled by user. The checkbox can also be enabled/disabled and get focused and highlighted. … more

The `goog.ui.CheckboxRenderer` Class

Default renderer for {@link goog.ui.Checkbox}s. Extends the superclass to support checkbox states: … more

The `goog.ui.ColorButton` Class

A color button control. Identical to {@link goog.ui.Button}, except it defaults its renderer to {@link goog.ui.ColorButtonRenderer}. This button displays a particular color and is clickable. It is primarily useful with {@link goog.ui.ColorSplitBehavior} to cache the last selected color. … more

The `goog.ui.ColorButtonRenderer` Class

Renderer for {@link goog.ui.ColorButton}s. Uses {@link goog.ui.ColorMenuButton}s but disables the dropdown. … more

The `goog.ui.ColorMenuButton` Class

A color menu button control. Extends {@link goog.ui.MenuButton} by adding an API for getting and setting the currently selected color from a menu of color palettes. … more

The `goog.ui.ColorMenuButtonRenderer` Class

Renderer for {@link goog.ui.ColorMenuButton}s. … more

The `goog.ui.ColorPalette` Class

A color palette is a grid of color swatches that the user can highlight or select via the keyboard or the mouse. The selection state of the palette is controlled by a selection model. When the user makes a selection, the component fires an ACTION event. Event listeners may retrieve the selected color using the {@link #getSelectedColor} method. … more

The `goog.ui.ColorPicker` Class

Create a new, empty color picker. … more

The `goog.ui.ColorSplitBehavior` Class

Constructs a ColorSplitBehavior for combining a color button and a menu. To use this, provide a goog.ui.ColorButton which will be attached with a goog.ui.ColorMenuButton (with no caption). Whenever a color is selected from the ColorMenuButton, it will be placed in the ColorButton and the user can apply it over and over (by clicking the ColorButton). Primary use case - setting the color of text/background in a text editor. … more

The `goog.ui.ComboBox` Class

A ComboBox control. … more

The `goog.ui.ComboBoxItem` Class

Class for combo box items. … more

The `goog.ui.Component` Class

Default implementation of UI component. … more

The `goog.ui.Container` Class

Base class for containers. Extends {@link goog.ui.Component} by adding the following:

a {@link goog.events.KeyHandler}, to simplify keyboard handling,
a pluggable renderer framework, to simplify the creation of containers without the need to subclass this class,
methods to manage child controls hosted in the container,
default mouse and keyboard event handling methods.

… more

The `goog.ui.ContainerRenderer` Class

Default renderer for {@link goog.ui.Container}. Can be used as-is, but subclasses of Container will probably want to use renderers specifically tailored for them by extending this class. … more

The `goog.ui.ContainerScroller` Class

Plug-on scrolling behavior for a container. Use this to style containers, such as pop-up menus, to be scrolling, and automatically keep the highlighted element visible. To use this, first style your container with the desired overflow properties and height to achieve vertical scrolling. Also, the scrolling div should have no vertical padding, for two reasons: it is difficult to compensate for, and is generally not what you want due to the strange way CSS handles padding on the scrolling dimension. The container must already be rendered before this may be constructed. … more

The `goog.ui.Control` Class

Base class for UI controls. Extends {@link goog.ui.Component} by adding the following:

a {@link goog.events.KeyHandler}, to simplify keyboard handling,
a pluggable renderer framework, to simplify the creation of simple controls without the need to subclass this class,
the notion of component content, like a text caption or DOM structure displayed in the component (e.g. a button label),
getter and setter for component content, as well as a getter and setter specifically for caption text (for convenience),
support for hiding/showing the component,
fine-grained control over supported states and state transition events, and
default mouse and keyboard event handling.

This class has sufficient built-in functionality for most simple UI controls. All controls dispatch SHOW, HIDE, ENTER, LEAVE, and ACTION events on show, hide, mouseover, mouseout, and user action, respectively. Additional states are also supported. See closure/demos/control.html for example usage. … more

`.ControlContent`

Type declaration for text caption or DOM structure to be used as the content of {@link goog.ui.Control}s.

@typedef: {string|Node|Array.<Node>|NodeList}

The `goog.ui.ControlRenderer` Class

Default renderer for {@link goog.ui.Control}s. Can be used as-is, but subclasses of Control will probably want to use renderers specifically tailored for them by extending this class. Controls that use renderers delegate one or more of the following API methods to the renderer:

{@code createDom} - renders the DOM for the component
{@code canDecorate} - determines whether an element can be decorated by the component
{@code decorate} - decorates an existing element with the component
{@code setState} - updates the appearance of the component based on its state
{@code getContent} - returns the component's content
{@code setContent} - sets the component's content

Controls are stateful; renderers, on the other hand, should be stateless and reusable. … more

The `goog.ui.CookieEditor` Class

Displays and edits the value of a cookie. … more

The `goog.ui.Css3ButtonRenderer` Class

Custom renderer for {@link goog.ui.Button}s. Css3 buttons can contain almost arbitrary HTML content, will flow like inline elements, but can be styled like block-level elements. … more

The `goog.ui.Css3MenuButtonRenderer` Class

Custom renderer for {@link goog.ui.MenuButton}s. Css3 buttons can contain almost arbitrary HTML content, will flow like inline elements, but can be styled like block-level elements. … more

The `goog.ui.CssRoundedPanel` Class

RoundedPanel class specifically for browsers that support CSS attributes for elements with rounded borders (ex. Safari 3.0+, Firefox 3.0+). Do not instantiate directly. Instead, call goog.ui.RoundedPanel.create(). … more

The `goog.ui.CustomButton` Class

A custom button control. Identical to {@link goog.ui.Button}, except it defaults its renderer to {@link goog.ui.CustomButtonRenderer}. One could just as easily pass {@code goog.ui.CustomButtonRenderer.getInstance()} to the {@link goog.ui.Button} constructor and get the same result. Provided for convenience. … more

The `goog.ui.CustomButtonRenderer` Class

Custom renderer for {@link goog.ui.Button}s. Custom buttons can contain almost arbitrary HTML content, will flow like inline elements, but can be styled like block-level elements. … more

The `goog.ui.CustomColorPalette` Class

A custom color palette is a grid of color swatches and a button that allows the user to add additional colors to the palette … more

The `goog.ui.DatePicker` Class

DatePicker widget. Allows a single date to be selected from a calendar like view. … more

The `goog.ui.DatePickerEvent` Class

Object representing a date picker event. … more

The `goog.ui.Dialog` Class

Class for showing simple dialog boxes. The Html structure of the dialog box is:

 Element         Function                Class-name, modal-dialog = default
----------------------------------------------------------------------------
- iframe         Iframe mask              modal-dialog-bg
- div            Background mask          modal-dialog-bg
- div            Dialog area              modal-dialog
    - div        Title bar                modal-dialog-title
       - span                             modal-dialog-title-text
         - text  Title text               N/A
       - span                             modal-dialog-title-close
         - ??    Close box                N/A
    - div        Content area             modal-dialog-content
       - ??      User specified content   N/A
    - div        Button area              modal-dialog-buttons
       - button                           N/A
       - button
       - ...

… more

The `goog.ui.DimensionPicker` Class

A dimension picker allows the user to visually select a row and column count using their mouse and keyboard. The currently selected dimension is controlled by an ACTION event. Event listeners may retrieve the selected item using the {@link #getValue} method. … more

The `goog.ui.DimensionPickerRenderer` Class

Default renderer for {@link goog.ui.DimensionPicker}s. Renders the palette as two divs, one with the un-highlighted background, and one with the highlighted background. … more

The `goog.ui.DragDropDetector` Class

Creates a new drag and drop detector. … more

The `goog.ui.DrilldownRow` Class

Builds a DrilldownRow component, which can overlay a tree structure onto sections of an HTML table. … more

The `goog.ui.FilterObservingMenuItem` Class

Class representing a filter observing menu item. … more

The `goog.ui.FilterObservingMenuItemRenderer` Class

Default renderer for {@link goog.ui.FilterObservingMenuItem}s. Each item has the following structure:

...(content)...

… more

The goog.ui Namespace

.ControlContent

The `goog.ui` Namespace

`.ControlContent`