Dynamic Box

The Tizen Home screen contains the Dynamic Box and Drop View areas. The Dynamic Box provides the essential or latest information about applications. The Drop View is a hidden area that appears when the Dynamic Box is flicked down, and allows users to quickly access a detail screen or perform tasks.

Dynamic Box and Drop View
Dynamic Box and Drop View

Dynamic Box

The Dynamic Box is a component showing examples of content, such as:

  • Specific data or content within an application
    The Dynamic Box can have content, such as a contact or contact groups from the contacts application to directly call or send a message, or a specific album or a picture from the Gallery. In addition, the Dynamic Box can contain internet bookmarks. 
    Dynamic Box content information, such as the source of an application or the type of content, can be displayed with an image. Important information, such as a contact or bookmark name, can be placed at the bottom of the screen.                                 

    Dynamic Box containing a contact, Gallery album, and bookmarkDynamic Box containing a contact, Gallery album, and bookmark
  • Information or a set value for an application
    The Dynamic Box can display weather information for a particular city, or check stock changes in real time. The user can also create a Dynamic Box with a clock application that has an alarm function.                                  
    Dynamic Box displaying city weather, stock information, and an alarmDynamic Box displaying city weather, stock information, and alarm
  • Shortcut to an application
    The Dynamic Box can provide a shortcut to Wi-Fi, Bluetooth, or sound settings in the device settings, or access the email inbox.                                 
    Dynamic Box with email access
    Dynamic Box with a sound setting and email access

Drop View

A Dynamic Box can have a Drop View. The Drop View can be used to provide detailed information or convenient functions related to the Dynamic Box. 
For example, the current weather can be displayed in the Dynamic Box, and the weekly weather forecast provided in the Drop View.  Similarly, information about music currently being played or the album art can be displayed in the Dynamic Box, and the key control buttons placed in Drop View.

Dynamic Box and Drop View with weather and music applications
Dynamic Box and Drop View with weather and music applications

When providing detailed functions associated with the Dynamic Box, place them in the bottom of the Drop View. Placing an icon shortcut on the default screen of an application at the bottom right corner of the Drop View gives the user a fast access to the application screen even when the Drop View is open. 
The Tizen platform provides common components for the Drop View area, such as the Update, Launch, Previous, and Next buttons. It is recommended to make the content layout of the Drop View area similar to the application UX.

Using the Dynamic Box and Drop View

The Drop View is opened when the Dynamic Box is flicked down, and closed when the outer area of the Dynamic Box or Drop View is tapped. If there are many content items in the Drop View, they can be viewed by scrolling up, down, left, or right.

Opening the Drop View
Opening the Drop View
 
Scrolling content in the Drop View
Scrolling content in Drop View

Dynamic Box Size and Layout

The Dynamic Box size can be 1x1, 2x1, or 2x2. Generally, larger size displays more content.

Dynamic Box content according to size
Dynamic Box Content according to Size
Dynamic Box Content according to Size

The Dynamic Box created from an application can be resized by dragging it.

Resizing the Dynamic Box
Resizing the Dynamic Box

The Dynamic Box can contain a combination of icons, text, and images. It is recommended to compose the Dynamic Box with text and images.

Table: Basic Dynamic Box layout options

Size Image only with icon Text only with icon Image and text with icon
1ₓ1
2ₓ1
2ₓ2

The following rules apply when composing the Dynamic Box and Drop View:

  • Compose the Dynamic Box with content items.
  • Compose the Dynamic Box with a single large image rather than several subdivided images to produce a simpler look.
  • Do not use text written in fine letters to provide clear readability.
  • It is recommended to create the Dynamic Box for all sizes.
  • Place key function buttons in the Drop View, not in the Dynamic Box.
  • Provide a button to access an application at the bottom right corner of the Drop View area.