Common Controls Overview

HTC Common Controls Overview

HTC has developed a suite of customized controls which are part of the HTC OpenSense UI framework. These controls are general purpose controls that extend the existing set of Android widgets and are called common controls. The HTC common controls can be reused by application and widget developers to provide a HTC look and feel in their applications.

The common controls are part of the HTC OpenSense UI framework and projects using these controls should target the latest HTC devices. In addition to the controls there are additional support classes provided that are used by the common controls. With this first release of the HTC OpenSense SDK, we will initially preview a specific control that currently runs on several versions of HTC Sense on various phones and tablets and will release a more comprehensive list of controls at a future date.

The following common control is demonstrated with the included sample code:

TabPlus - HTC has developed the TabPlus control which functions like a tabbed pane control but with additional features and the HTC Sense look and feel. The TabPlus control is used to group items (views or activities) under different customizable "tabs". The TabPlus provides the following additional features.

  • Add, remove or re-order the tabs by using a tab-pool
  • Store the state of the tabs in the application side database automatically
  • Support for nested tab

The TabPlus control display is designed to:

  • Integrate several views in an application where each view is associated (controlled) with a tab.
  • Allow editing (add/remove/shift) the tabs (and their content) from the carousel widget (tab selection bar) by providing a separate edit mode view.

The TabPlus control is comprised primarily of the Java classes, CarouselActivuty, CarouselHost and CarouselWidget. The TabPlus control is referenced in the documentation and code by "Carousel".

The tabs portion of the TabPlus control is shown at the bottom of this screenshot which is displaying a selected tab's pane containing an activity that simply displays an image.

You'll see that for this example, we are using similar icons for the tabs found in the HTC Sense native Music application. In fact, the TabPlus control is used in that and many other HTC Sense applicattions. Developers can now include this control in their own applications so that their users can have a seamless UI experience with the common applications they use regularly.

Note: In future articles and tutorials we will also describe how applications can target both devices with HTC Sense and those without it. The sample provided will only run on devices running recent versions of HTC Sense.