Button (computing)

Last updated
An example of a clickable button
Different types of buttons in GTK Gimp-buttons.png
Different types of buttons in GTK

In computing, the term button (sometimes known as a command button or push button ) refers to any graphical control element that provides the user a simple way to trigger an event, like searching for a query at a search engine, or to interact with dialog boxes, like confirming an action. [1]

Contents

Overview

A typical button is a rectangle or rounded rectangle, wider than it is tall, with a descriptive caption in its center. [2] The most common method of pressing a button is clicking it with a pointer controlled by a mouse, but other input such as keystrokes can be used to execute the command of a button. A button is not however always restricted to a rectangular shape. The sole requirement of button interaction is that the user can execute a command by a click action. Thus pictures and background areas can be programmed as buttons. When pressed, in addition to performing a predetermined task, buttons often undergo a graphical change to mimic a mechanical button being depressed.

Depending on the circumstance, buttons may be designated to be pushed only once and execute a command, while others may be used to receive instant feed back and may require the user to click more than once to receive the desired result. Other buttons are designed to toggle behavior on and off like a check box. [3] These buttons will show a graphical clue (such as staying depressed after the mouse is released) to indicate the state of the option.

A button often displays a tooltip when a user moves the pointer over it. The tooltip serves as built-in documentation that briefly explains the purpose of the button.

Some very common incarnations of the button widget are:

Appearance

macOS

Buttons in macOS's Aqua interface are usually depicted as rounded-rectangles of crystallised glass. Normally these buttons are light grey in color, and turn blue when pressed. The button with keyboard focus (selectable with the spacebar) appears with a blue glow surrounding it. The default button in an active window (selectable with the return key) animates between a bright blue and a darker blue (the same color as a pressed button).

Also used, primarily within application toolbars, are slightly rounded rectangles with a light grey metallic appearance. These buttons appear darker and "pushed inward" when pressed.

Window management controls appear in the top left corner of each window. These buttons are similar in style to standard aqua buttons, but are color-coded as a memory aid. From left to right, these are: "Close Window", shown in red; "Minimize Window", shown in yellow; and "Zoom", shown in green, which causes the window to resize to best fit its contents.

Windows shell

Buttons in Microsoft Windows are usually rectangular, with mildly rounded corners in Windows XP, Vista, and 7. In Windows 8, the buttons are rectangular with sharp corners. A button with active focus is shown with a black dotted line just inside the border of the button. In addition, more recent versions, the default button is shown with a blue border. In Windows Vista and Windows 7, the default button will slowly fade between its normal appearance and the blue border. Window management controls are in the upper right-hand corner of the application window, and, from left to right: "minimize" the window (causing it to disappear into the taskbar at the bottom of the screen); maximize the window (causing it to expand to cover the whole screen; if the window is already maximized, the button will restore it to its previous size and position); and close the window.

Linux and other Unix-like systems

The appearance and behavior of buttons in Linux and other Unix-like operating systems is defined primarily by which widget toolkit is being employed, the most popular being GTK and Qt, though other toolkits are used as well. The use of multiple toolkits can lead to less uniform look and feel across applications. Most widget toolkits also have theming capabilities, so there is no single standard appearance as there is with Mac OS and Windows.

HTML

Buttons appear as elements of HTML forms to carry out actions such as clearing user input or submitting the form contents to the server. Buttons specified in HTML may be rendered by web browsers in different ways, typically either using the native button appearance of the underlying OS, or by using a button definition from within the browser. Buttons may also be styled by the developer of the web site the form appears on by using cascading style sheets.

HTML links are sometimes represented by a graphic closely resembling a button. Sometimes this type of link is used in advertisements to induce the user to click the ad and visit the advertiser's site.

Related Research Articles

Scrollbar

A scrollbar is an interaction technique or widget in which continuous text, pictures, or any other content can be scrolled in a predetermined direction on a computer display, window, or viewport so that all of the content can be viewed, even if only a fraction of the content can be seen on a device's screen at one time. It offers a solution to the problem of navigation to a known or unknown location within a two-dimensional information space. It was also known as a handle in the very first GUIs. They are present in a wide range of electronic devices including computers, graphing calculators, mobile phones, and portable media players. The user interacts with the scrollbar elements using some method of direct action, the scrollbar translates that action into scrolling commands, and the user receives feedback through a visual updating of both the scrollbar elements and the scrolled content.

XUL, which stands for XML User Interface Language, is a user interface markup language developed by Mozilla. XUL is an XML dialect for writing graphical user interfaces, enabling developers to write user interface elements in a manner similar to web pages.

In computing, a window is a graphical control element. It consists of a visual area containing some of the graphical user interface of the program it belongs to and is framed by a window decoration. It usually has a rectangular shape that can overlap with the area of other windows. It displays the output of and may allow input to one or more processes.

Look and feel

In software design, the look and feel of a graphical user interface comprises aspects of its design, including elements such as colors, shapes, layout, and typefaces, as well as the behavior of dynamic elements such as buttons, boxes, and menus. The term can also refer to aspects of a non-graphical user interface, as well as to aspects of an API – mostly to parts of an API that are not related to its functional properties. The term is used in reference to both software and websites.

Text box

A text box, text field or text entry box is a control element of a graphical user interface, that should enable the user to input text information to be used by a program. Human Interface Guidelines recommend a single-line text box when only one line of input is required, and a multi-line text box only if more than one line of input may be required. Non-editable text boxes can serve the purpose of simply displaying text.

Point and click are the actions of a computer user moving a pointer to a certain location on a screen (pointing) and then pressing a button on a mouse, usually the left button (click), or other pointing device. An example of point and click is in hypermedia, where users click on hyperlinks to navigate from document to document.

A taskbar is an element of a graphical user interface which has various purposes. It typically shows which programs are currently running.

Aqua (user interface) User interface of macOS by Apple

Aqua is the graphical user interface, design language and visual theme of Apple's macOS operating system. It was originally based on the theme of water, with droplet-like components and a liberal use of reflection effects and translucency. Its goal is to "incorporate color, depth, translucence, and complex textures into a visually appealing interface" in macOS applications. At its introduction, Steve Jobs noted that "... it's liquid, one of the design goals was when you saw it you wanted to lick it".

Graphical widget Element of interaction in a graphical user interface

A graphical widget in a graphical user interface is an element of interaction, such as a button or a scroll bar. Controls are software components that a computer user interacts with through direct manipulation to read or edit information about an application. User interface libraries such as Windows Presentation Foundation, GTK, and Cocoa, contain a collection of controls and the logic to render these.

Window manager Type of system software

A window manager is system software that controls the placement and appearance of windows within a windowing system in a graphical user interface. Most window managers are designed to help provide a desktop environment. They work in conjunction with the underlying graphical system that provides required functionality—support for graphics hardware, pointing devices, and a keyboard, and are often written and created using a widget toolkit.

In computer user interfaces, a cursor is an indicator used to show the current position for user interaction on a computer monitor or other display device that will respond to input from a text input or pointing device. The mouse cursor is also called a pointer, owing to its resemblance in usage to a pointing stick.

GNOME Terminal Terminal emulator from GNOME

GNOME Terminal is a terminal emulator for the GNOME desktop environment written by Havoc Pennington and others. Terminal emulators allow users to access a UNIX shell while remaining on their graphical desktop.

A menu bar is a graphical control element which contains drop-down menus.

Tkinter is a Python binding to the Tk GUI toolkit. It is the standard Python interface to the Tk GUI toolkit, and is Python's de facto standard GUI. Tkinter is included with standard Linux, Microsoft Windows and Mac OS X installs of Python.

Layout managers are software components used in widget toolkits which have the ability to lay out graphical control elements by their relative positions without using distance units. It is often more natural to define component layouts in this manner than to define their position in pixels or common distance units, so a number of popular widget toolkits include this ability by default. Widget toolkits that provide this function can generally be classified into two groups:

qooxdoo

qooxdoo is an open-source Ajax web application framework. It is an LGPL- and/or EPL-licensed client-side and server-agnostic solution, and includes support for professional JavaScript development, a graphical user interface (GUI) toolkit and high-level client-server communication.

fpGUI

fpGUI, the Free Pascal GUI toolkit, is a cross-platform graphical user interface toolkit developed by Graeme Geldenhuys. fpGUI is open source and free software, licensed under a Modified LGPL license. The toolkit has been implemented using the Free Pascal compiler, meaning it is written in the Object Pascal language.

ReAction GUI is the widget toolkit engine that is used in AmigaOS 3.2-4.1.

MicroB

MicroB was a mobile web browser developed by Nokia for use in smartphones and mobile devices that run the Maemo operating system. The browser is Mozilla-based and uses the Gecko layout engine.

References

  1. button at FOLDOC
  2. "Mozilla button description". Archived from the original on 2012-04-02. Retrieved 2009-09-18.
  3. Archived 2012-04-02 at the Wayback Machine checkState button attribute in Mozilla 's XUL