Chapter 8. User Interface Components
The set of user interface (UI) components provided by the browser as
HTML 4 elements is limited to <input>,
<select>, <textarea>, and
<button>. Generally, building a custom component requires
the creative use of HTML and CSS to produce something that looks like what
you want. Remember, HTML was originally designed for formatting text, not
for building UI widgets, so getting it to do your bidding is often a
challenge.
Even once you get the HTML and CSS right, there is still the matter of adding JavaScript so that it responds appropriately to user input events and testing it to make sure that it works consistently across web browsers. This is a time-consuming process, so it helps to leverage existing UI components. Fortunately, the Closure Library contains many UI components, the implementation of which exhibit the design principles of inheritance and event management in Closure described in Chapters 5 and 6, respectively.
The goog/ui folder in the Closure Library contains over
100 JavaScript files, so this chapter will not attempt to explain all of
them. (A list of the most commonly used UI widgets appears in Table 8-8.) Instead, the focus will be on explaining
the design behind the components, providing examples of how to use some of
the existing components, and then demonstrating how to implement your own
components. Together, these sections will provide the tools you need to
master the goog.ui package.
Due to the length of this chapter, you may ...
Get Closure: The Definitive Guide now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
