6 Design Guidelines for BlackBerry 4.2 to 4.5

This chapter describes how to accommodate the behavior of BlackBerry browsers 4.2 to 4.5.

This chapter includes the following sections:

6.1 Introduction to BlackBerry Browser Display Behavior

The BlackBerry browser behaves differently than other browsers in that it does not display pages using horizontal scrolling. Instead, it fits a page to the width of the screen.

6.2 Formatting Tables to Prevent Wrapping

Browsers wrap long words between fields. When formatting tables, avoid placing such words on lines that contain multiple fields.

Note:

Within this chapter, a word refers to a series of characters. In this context, a word does not include white space.

Because the default mode of the BlackBerry browser limits the browser width to that of the physical screen, any field that cannot fit within a line is displayed on the next line. If the intent of an application is to display multiple elements on one line, then you must ensure that the total width of the fields are within the width of the browser. Like other browsers, the BlackBerry browser wraps multiple lines when needed. The column width cannot be reduced beyond the size of the longest word in the field.

6.2.1 How to Prevent Fields from Wrapping in Tables

To prevent fields from wrapping, ensure that the total of the size attribute values in a table's row satisfies the following formula when all of the fields in a row are input fields.

3*Number of columns + the Sum of the size attributes in all columns <=X, when X=48

In general, field sizes in table columns should satisfy the following formula:

3 * Number of Columns + 
Sum of size attributes in all input field columns + 
Sum of number of characters in longest words in all output field columns <=  X, when X=48 

If the field still wraps, decrease the value of X until the field fits the row.

6.3 Formatting Label and Message Panels

To preserve the intended programming flexibility, ADF Mobile supports nowrap attributes in Trinidad components. You may encounter problems if you add nowrap to a component definition if you program an application to support paging.

6.4 Formatting Column Width

When formatting columns, set the percentage of the width for both the LabelWidth and the FieldWidth attributes in the tr:panelFormLayout component at 100%.

6.5 What You May Need to Know About Display Variations on BlackBerry Smartphones

The same application may display differently on different devices. The following circumstances can contribute to such discrepancies:

6.5.1 Changes to the Minimum Font Size

Changing the minimum font size through user preferences affects the formatting ability of the ADF Mobile browser renderer. For example, input fields and their corresponding labels align properly when the font is set to its default size of 6 pt., as shown in Figure 6-1.

Figure 6-1 Application Display Using the Default Font Size of 6 pt.

Properly alligned fields and labels

However, increasing the font size to 10 pt. disrupts the display by shifting the input fields beneath their corresponding labels. As a result, the page is difficult to read.

Figure 6-2 shows a page that is too large for the display screen.

Figure 6-2 Increasing the Font Size

Effect of increased font size

6.5.2 Form Factor Variations

Differing screen sizes can affect display. Even if the font size is at the default size of 6 pt. (illustrated in Figure 6-1), the same application appears differently on other devices. In Figure 6-3, the input fields barely fit the device's screen, even though they are easily accommodated on other devices running the same application, as shown in Figure 6-1.

Figure 6-3 Difficulty Displaying Input Fields and Labels with Font Size at 6 pt.

Improper field and label display

In addition, input fields may display properly on the screen of one device, but may appear crowded on the screen of another type of device.

Figure 6-4 shows an application whose table cells are not wide enough to accommodate the text, causing it to wrap.

Figure 6-4 Wrapping Text

A table with wrapping contents