Methods, program products, and systems for heads-up scrolling are described. In heads-up scrolling, a scrolling control can be used to scroll through multiple data records in a database. When a slider of the scrolling control receives an input dragging the slider, a semitransparent window can be overlaid on content being displayed. The semitransparent window can have a user-specified layout for formatting one or more data fields of a data record. When the slider is dragged, the content being overlaid upon can remain static. Content in the semitransparent window can be updated to reflect content in a data record corresponding to a position of the slider. The content in the semitransparent window can be formatted according to the user-specified layout, which may be different from a format of the content under the semitransparent window.

TECHNICAL FIELD

This disclosure relates generally to graphical user interfaces.

BACKGROUND

In a graphical user interface (GUI), a scrollbar can be used to navigate through content that is too large to fit into a window entirely. The content can include continuous text, image, or data records from a database. A scrollbar can have a track and a slider that can be dragged along the track. The slider is also known as a thumb, an elevator, a wiper, a grip, a scroller, a navigation slider, or by many other names. When the slider is dragged along the track, various portions of the content can be shown in the window. Typically, a scrollbar includes navigation arrows on each end such that a user can navigate using the arrows without using the slider. The slider can have variable size reflecting a ratio between displayed content and entire content.

SUMMARY

Methods, program products, and systems for heads-up scrolling are described. In heads-up scrolling, a scrolling control can be used to scroll through multiple data records in a database. The scrolling control can be displayed with content that includes one or more of the data records. When a slider of the scrolling control receives an input dragging the slider, a semitransparent window can be overlaid on content currently being displayed. The semitransparent window can have a user-specified layout for formatting one or more data fields of a data record. When the slider is dragged, the content under the semi-transparent window can remain static. Content in the semitransparent window can be updated to reflect content in a data record corresponding to a position of the slider. The content in the semitransparent window can be formatted according to the user-specified layout, which may be different from a format of the content under the semi-transparent window.

In some implementations, a method of heads-up scrolling can include receiving, from a user interface, an input touching a slider of a scrolling control. The scrolling control can correspond to multiple data record rows in a database. Each data record can include one or more data fields. While the slider is receiving the input, the user interface can provide a heads-up display of a data record. The data record can be identified from the data record rows based on a current position of the slider on the scrolling control. The heads-up display can include a data field preselected from the one or more data fields according to a user-specified layout, and provide a preview of the data record. The user interface can update the heads-up display when an input moves the slider along the scrolling control.

Heads-up scrolling can be implemented to achieve the following advantages. A user can view content being scrolled in a user-specific way, for example, by selectively viewing one or two data fields the user considers most representative of a data record, rather than all data fields in the data record, which may clutter a display screen. The data being viewed can be displayed in a heads-up display semitransparently overlaid on content being scrolled, such that conventional advantages of content scrolling are preserved. Content in the heads-up display can be pre-fetched from the database, such that scrolling speed is unaffected or minimally affected by the heads-up display. The pre-fetched content can include only a small portion of each record, such that memory overhead is minimized.

The details of one or more implementations of heads-up scrolling are set forth in the accompanying drawings and the description below. Other features, aspects, and advantages heads-up scrolling will become apparent from the description, the drawings, and the claims.

DETAILED DESCRIPTION

HUD Window

FIG. 1illustrates exemplary heads-up scrolling user interface100. User interface100can be a graphical user interface for viewing data in a database that stores multiple data records. Each data record can have multiple data fields. User interface100can include a form view, where data records are displayed one at a time. The form view can be displayed on a display screen of a user device. Data fields102,104,106, and108can be displayed according to a layout. The layout can contain formatting information, including, for example, location, size, font, or color, for each of the data fields.

User interface100can include scrolling control110. Scrolling control110can be a user interface item for controlling how to browse through the multiple data records when one record is displayed at a time. Scrolling control110can have slider112, which can be touched and dragged along a track. A position of slider112on the track can indicate a relative position of a data record currently being displayed. Scrolling control110can be a scrubber, where a size of slider112is fixed, or a scrollbar, where a size of slider112is variable. When slider112receives a touch input from a finger, a stylus, or a mouse click followed by dragging, slider112can move along the track. When the finger or stylus leaves slider112or a mouse button is released, a new data record is selected and displayed in user interface100according to a final position of slider112at time of release. The data record may have many data fields. The database transaction cost may be high. For example, if the database is stored remotely from the user device, the cost in memory usage, CPU usage, or network usage of updating data fields102,104,106, and108while slider112moves can be high.

When slider112is being dragged, the user device can provide heads-up display (HUD) window114for display in user interface100. HUD window114can correspond to a predicted data record that, if the finger or stylus stops touching slider112, will be displayed in user interface100in a complete form view. HUD window114can include a semi-transparent window overlaid on data fields102,104,106, and108. HUD window114can display database name116of a database, position information118indicating a current position of the predicted data record among all data records in the database, data field120of the predicted data record, and HUD editor control122.

Data field120can be a data field selected from multiple data fields of a data record. Data field120can be formatted according to a layout dedicated for HUD window114. The layout can be the same or different from the layout underlying user interface100. The layout can be user editable. Content of HUD window114can be overlaid, or superimposed, on the currently displayed data fields102,104,104, and108such that data fields102,104,106, and108are visible through HUD window114. The portions of data fields102,104,106, and108visible through HUD window114can be darkened or otherwise de-emphasized to appear as if displayed behind a piece of semi-transparent or dark glass.

When slider112is dragged along the track, content of HUD window114, e.g., position information118and content in data field120, can be updated according to position of slider112on track of scrolling control110. User interface100can remain focused on the current data record. The content in data fields102,104,106, and108can be static while slider112slides, even when content in HUD window114changes. The content in data fields102,104,106, and108can be maintained until slider112is released, e.g., when a stylus or finger leaves slider112. In some implementations, the content in data fields102,104,106, and108can be updated according to a data record corresponding to a final position of slider112after a threshold time has passed since slider112is released. For example, if the threshold time is set to two seconds, when (1) the final position of slider112corresponds to data record number “153,” and (2) currently, the content in data fields102,104,106, and108is from data record number “15,” the content in data fields102,104,106, and108can be updated according to data record “153” two seconds after slider112is released. If, during the threshold time, an input is received through HUD editor control122, a HUD editor can be displayed for editing the layout for HUD window114. Additional details of the HUD editor will be described below in reference toFIG. 2.

HUD Editor

FIG. 2illustrates an exemplary user interface for configuring a heads-up display window. The user interface can include HUD editor200. HUD editor200can be activated using HUD editor control122ofFIG. 1.

HUD editor200can include field list202. Field list202can be a list of data fields for a set of data records as stored in a database. HUD editor200can receive a user input selecting one or more data fields from field list202and placing the selected one or more fields each at a location in HUD editor200. The selection and placement can create or modify a layout for a HUD window. A list of selected data fields and the layout can be stored on a storage device when HUD editor200receives an input through user interface item204, which can be a “Done” button for saving data.

In some implementations, HUD editor200can configure a HUD window to display a data field designated for sorting the data records. Data records can be browsed in multiple levels of sort order, for example, ascending according to a primary data field designated for sorting, and then descending according to a secondary data field. HUD editor200can provide the sorting data fields for a user to select for a HUD window. For example, HUD editor200can provide for display option 1, where primary sort field206can be selected as a data field for displaying in a HUD window. HUD editor200can provide for display option 2, where both primary sort field206and secondary sort field208can be selected as data fields for displaying in a HUD window. Two sort fields are shown in this example. Additional sort fields can be listed.

HUD editor200can receive a selection of option 1 or option 2 when HUD editor200receives an input (e.g., a touch input) on option 1 or option 2. Sort field indicator210can indicate which option is selected.

When HUD editor200selects data fields according to a sort order, content in a resulting HUD window can update less frequently than when the data fields are unsorted. Because data records are sorted based on a sort data field, content in the HUD window can be updated only when content of the sort data field change. Content of the sort data field can remain unchanged until multiple data records have been browsed. Accordingly, selecting data fields according to a sort order can reduce cache size, network load, or CPU time. Additional details on the operations of HUD window for multiple levels of sorts are described below in reference toFIG. 3.

FIG. 3illustrates an example heads-up scrolling user interface for multiple levels of sorts. HUD window300can include primary sort field302and secondary sort field304. Primary sort field302can be an image data field. For example, data records in a database can be sort primarily on size of an image in the image data field. Accordingly, data records having a same image (e.g., records of cars having a same make, model, and trim having a same title image) can be grouped together. Secondary sort field304can be a text data field. Data records that have the same image can be further sorted by the text data field. For example, data records of cars having a same make, model, and trim can further be sorted by option packages.

When slider112receives a touch input, a HUD management module can connect to a database through a database interface and retrieve data records including the data fields for displaying in HUD window300. In this example, the data fields can be primary sort field302and secondary sort field304. The retrieved data fields can be associated with a row identifier indicating which data record had what value in the data fields. The management module can store the retrieved row identifier and the values of the data fields in a HUD buffer. The HUD buffer can be indexed, such that the total amount of storage is less that the number of user-selected data records times the number of each data record.

When slider112moves, the management module can update content in secondary sort field304only when the content in secondary sort field304changes. The change may occur after multiple data fields have been bypassed. Likewise, the management module can update content in primary sort field302only when the content in primary sort field302changes. The change may occur after multiple updates in secondary sort field304, instead of occurring at every slight movement of slider112.

If a sort order of a database changes, e.g., by a database management program, sort fields302and304can change accordingly. The change in sort field302and304can be synchronized with external changes, including changes in sort order (e.g., from a first data field to a second data field), or changes of position of current data record due to insertion or deletion of data records or modification of data field values (e.g., changing one image to another). In some implementations, when an external program changes the sort order, the displayed content in HUD window300can remain static; slider112can jump to a new position to reflect the change in sort order. If content in a data field in a field currently displayed in HUD window300changes, displayed content in sort field302or304may change. Slider112can remain at a current position if the change in content does not result in a change in rank of the currently displayed record (e.g., 153 out of 230), or jump to another position if the change in content results in a change in rank of the currently displayed record (e.g., from 153 out of 230 to 59 out of 230).

FIG. 4illustrates an exemplary heads-up display window overlaid on a table view. User interface400can be a graphical user interface for viewing data in a database that stores multiple data records. Each data record can have multiple data fields. User interface400can include table view402and scrolling control404, which includes slider406. Scrolling control404can be a vertical scrolling control in which slider406moves vertically.

Table view402can be a view of database data that displays multiple data records each time. The multiple data records can be displayed in a tabular format in which, for example, each data record is displayed as a row, and data fields in the data record are displayed as columns.

When slider406receives an input moving slider406up or down, table view402can remain static. Rows of data records displayed in table view need not change. For example, data record407can be a data record in focus, e.g., being selected and ready to open for display in a form view. While slider406moves up or down, data record407can remain in focus. Focus can be changed when slider406is released. While slider406moves up or down, content in data field120of HUD window114can change in a manner that reflects the current row of data as determined by a position of slider406. For example, if slider406is located at a position in sliding control404that corresponds to data record number 153, an image in data field120can correspond to an image of an image data field of data record number 153. HUD window114can be semitransparent, such that the records of table view402can be visible through HUD window114.

HUD window114can be closed, and scrolling control404may be removed, when, through any operation, the number of data records in the database falls below two. Scrolling control404may be added back when the number of data records in the database increases to two or more.

In some implementations, slider406can be associated with action icon408. Action icon408can be displayed when slider406receives a touch input. Action icon408can be associated with a user-specified action, e.g., sending an email, print a current record, or export a current record being in focus in table view402, or a predicted data record a data field of which is displayed in HUD window114. Action icon408can receive a selection input, e.g., a touch input. Upon receiving the selection input, action icon408can cause the user-specified action to be performed.

Exemplary System Components

FIG. 5is a block diagram of system500implementing heads-up scrolling features. System500can include one or more processors programmed to perform heads-up scrolling operations.

System500can include scrolling management subsystem502. Scrolling management subsystem502can be configured to manage scrolling controls, e.g., scrolling controls110and404as described above. System500can interact with database interface504to obtain a total number of data records in a database table, and to inform database interface504which data record is currently being displayed in a form view, or which data record is in focus in a table view. Scrolling management subsystem502can determine, based on a position of a slider, one or more predicted data records. A predicted data record can be a data record being browsed that, if a slider of a scrolling control is released, will be displayed in the form view or will be in focus in a table view. The total number of data records (e.g., 10,000 records) can be accessed by a scrolling control can be large compared to a total number of pixels (e.g., 1,000 pixels) of the scrolling control as displayed. Accordingly, a position of a slider can correspond to more than one predicted data records (e.g., 10 data records).

Database interface504can determine the total number of data records by performing one or more queries in database506. Database506can be an organized collection of data. Examples of database506can be relational databases, object-oriented databases, or ad hoc databases.

System500can include HUD management subsystem508. HUD management subsystem508can be configured to manage one or more HUD windows, e.g., HUD windows114and300, and one or more HUD editors, e.g. HUD editor200. HUD management subsystem508can receive, from scrolling management subsystem502, an identifier of a predicted data record, and a direction of slider movement. Based on the slider position, HUD management subsystem508can display selected data fields of a predicted data record in a HUD window. If HUD management subsystem508receives multiple identifiers of predicted data records, HUD management subsystem508can select, based on the direction of slider movement, one of the predicted data records for display in a HUD window. For example, if the slider moves forward, HUD management subsystem508can select a last predicted data record for display in a HUD window; if the slider moves backward, HUD management subsystem508can select a first predicted data record for display in a HUD window.

System500can include HUD buffer510. HUD buffer510can store one or more data fields for display in a HUD window. The data fields stored in HUD buffer510can be correspond to data fields for display in a HUD window. HUD management subsystem508can retrieve the data fields from HUD buffer510using an identifier of a predicted data record as an index. The data fields stored in HUD buffer510can be retrieved from database506using database interface504.

System500can include HUD layout subsystem512. HUD layout subsystem512can receive configuration information from HUD management subsystem508as provided from a HUD editor. HUD layout subsystem512can generate a layout using the configuration and store the layout in association with a database table. The layout can be stored in database506through database interface504. HUD layout subsystem512can provide the layout to HUD management subsystem508for formatting and displaying a HUD window.

Exemplary Processes

The system can receive (602), from a user interface including a scrolling control and a current data record, an input accessing a slider of the scrolling control. The scrolling control can correspond to multiple data record rows in a database. Each data record can include one or more data fields. The current data record can be a data record, among the multiple data records, being displayed or being in focus. In some implementations, the scrolling control can be a scrubber, where the slider has a fixed size regardless of number of data record rows in the database. In some implementations, the scrolling control can be a scrollbar, where the slider has a variable size that correspond to a ratio between a number of displayed data records and a total number of data records. A greater ratio can correspond to a larger slider size.

While the input continues, the system can provide (604) for display a HUD window of a predicted data record. The predicted data record can be identified from the data record rows based on a current position of the slider on the scrolling control. The HUD window, e.g., HUD window114, can include a preview of the predicted data record. The preview can be overlaid on the current data record. The preview can include a data field preselected from the one or more data fields of the predicted data record. The HUD window can be a semi-transparent window displaying the data field. The HUD window can include a control, e.g., HUD editor control122. The control, when activated, can cause a HUD editor, e.g., HUD editor200, to be displayed. The HUD editor can be used to edit a layout of the HUD window. The HUD editor can be used to select the data field from the one or more data fields and configure formatting of the selected data field.

In some implementations, the input can include a touch and a drag on the slider. Upon receiving the touch on the slider, the system can retrieve, from the database, multiple partial data record rows. Each partial data record row can correspond to a data record row and include the preselected data field. The partial data record rows can be stored in HUD buffer510ofFIG. 5.

IN some implementations, the system can determine a between a count of the data record rows and a length of the slide control as measured in number of pixels. The system can identify the predicted data record for display in the HUD window based on the ratio. The system can identify the predicted data record further based on a scrolling direction.

The system can update (606) the HUD window when the input moves the slider along the scrolling control while maintaining a display of the current data record. In some implementations, the system can determine a first sort order based on a first data field of each of the data record rows and a second sort order on a second data field of each of the data record rows. The system can store unique values of the first data field and unique values of the second data field in a HUD buffer (e.g., HUD buffer510) on a storage device. The values can be indexed. Updating the HUD window can include displaying new content for the second data field while maintaining content of the first data field.

The system can synchronize the heads-up display and the predicted data record when the predicted data record is changed. The system can detect that the input ceases to access the slider. For example, the system can detect that the slider is released. The system can then select a predicted data record a data field of which is displayed in a last HUD window. The system can then retrieve all data fields of the selected data record for display in a form view.

Exemplary System Architecture

FIG. 7is a block diagram of an exemplary system architecture700for implementing the features and operations ofFIGS. 1-6. Other architectures are possible, including architectures with more or fewer components. In some implementations, architecture700includes one or more processors702(e.g., dual-core Intel® Xeon® Processors), one or more output devices704(e.g., LCD), one or more network interfaces706, one or more input devices708(e.g., mouse, keyboard, touch-sensitive display) and one or more computer-readable mediums712(e.g., RAM, ROM, SDRAM, hard disk, optical disk, flash memory, etc.). These components can exchange communications and data over one or more communication channels710(e.g., buses), which can utilize various hardware and software for facilitating the transfer of data and control signals between components.

The term “computer-readable medium” refers to a medium that participates in providing instructions to processor702for execution, including without limitation, non-volatile media (e.g., optical or magnetic disks), volatile media (e.g., memory) and transmission media. Transmission media includes, without limitation, coaxial cables, copper wire and fiber optics.

Computer-readable medium712can further include operating system714(e.g., a Linux® operating system), network communication module716, scrolling management module720, database interface module730, and HUD management module740. Operating system714can be multi-user, multiprocessing, multitasking, multithreading, real time, etc. Operating system714performs basic tasks, including but not limited to: recognizing input from and providing output to devices706,708; keeping track and managing files and directories on computer-readable mediums712(e.g., memory or a storage device); controlling peripheral devices; and managing traffic on the one or more communication channels710. Network communications module716includes various components for establishing and maintaining network connections (e.g., software for implementing communication protocols, such as TCP/IP, HTTP, etc.).

Scrolling management module720can include computer instructions that, when executed, cause processor702to perform operations of scrolling management subsystem502as described above in reference toFIG. 5. Database interface module730can include computer instructions that, when executed, cause processor702to perform operations of database interface504as described above in reference toFIG. 5. HUD management module740can include computer instructions that, when executed, cause processor702to perform operations of HUD management subsystem508as described above in reference toFIG. 5.

Architecture700can be implemented in a parallel processing or peer-to-peer infrastructure or on a single device with one or more processors. Software can include multiple software components or can be a single body of code.

To provide for interaction with a user, the features can be implemented on a computer having a display device such as a CRT (cathode ray tube) or LCD (liquid crystal display) monitor or a touch-sensitive display screen for displaying information to the user and a keyboard and a pointing device such as a mouse or a trackball by which the user can provide input to the computer. The computer can have a voice input device for receiving voice commands from the user.

A system of one or more computers can be configured to perform particular actions by virtue of having software, firmware, hardware, or a combination of them installed on the system that in operation causes or cause the system to perform the actions. One or more computer programs can be configured to perform particular actions by virtue of including instructions that, when executed by data processing apparatus, cause the apparatus to perform the actions.

A number of implementations of the invention have been described. Nevertheless, it will be understood that various modifications can be made without departing from the spirit and scope of the invention.