Opened 7 years ago

Closed 7 years ago

Last modified 7 years ago

#15317 closed defect (invalid)

TabBar buttons not centered in dojox.mobile.Heading

Reported by: Eric Wang Owned by: Eric Durocher
Priority: undecided Milestone: tbd
Component: DojoX Mobile Version: 1.7.2
Keywords: todoapp Cc: cjolif
Blocked By: Blocking:

Description (last modified by cjolif)

this issue includes

  1. TabBar buttons not centered in dojox.mobile.Heading at the startup
  2. hide the left tabBar button will cause the center ones move to left, what expect is the center ones go to center

3, display the left tabBar button, the center ones not in the center.

put the test file into /dojox/mobile/tests folder and open in browser to see the result.

Attachments (3)

TabNotCenterInHeading.html (2.4 KB) - added by Eric Wang 7 years ago.
TabNotCenterInHeading-fixed.html (2.5 KB) - added by Eric Durocher 7 years ago.
Modified sample with correct layout.
15317.patch (1.1 KB) - added by Eric Durocher 7 years ago.
Fix test_Heading.html so tab bar is centered in heading with buttons on the sides - Eric Durocher (IBM, CCLA)

Download all attachments as: .zip

Change History (8)

Changed 7 years ago by Eric Wang

Attachment: TabNotCenterInHeading.html added

comment:1 Changed 7 years ago by cjolif

Keywords: todoapp added
Owner: changed from ykami to Eric Durocher
Status: newassigned

comment:2 Changed 7 years ago by cjolif

Description: modified (diff)

Changed 7 years ago by Eric Durocher

Modified sample with correct layout.

comment:3 Changed 7 years ago by Eric Durocher

Resolution: invalid
Status: assignedclosed

The layout that you want can be achieved using nested tables (and probably other HTML layout combinations as well). I am attaching a modified version of your sample that seems to work as you expect. The sample uses a second nested table to center the toolbar, and also uses visibility="hidden" instead of display="none" to hide the left button.

EricWang, please tell me if this works for you.

Changed 7 years ago by Eric Durocher

Attachment: 15317.patch added

Fix test_Heading.html so tab bar is centered in heading with buttons on the sides - Eric Durocher (IBM, CCLA)

comment:4 Changed 7 years ago by Eric Durocher

Cc: cjolif added

Attaching a patch for the test_Heading.html test case, so users can cut/paste the correct HTML to get a centered tab bar in a heading with buttons on each side.

comment:5 Changed 7 years ago by cjolif

In [28643]:

refs #15317. Enhance test to show how to get a tab bar with centered header and left/right buttons. Thanks Eric Durocher (IBM, CCLA).

Note: See TracTickets for help on using tickets.