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: new → assigned

comment:2 Changed 7 years ago by cjolif

Description: modified (diff)

Changed 7 years ago by Eric Durocher

Attachment: TabNotCenterInHeading-fixed.html​ added

Modified sample with correct layout.

comment:3 Changed 7 years ago by Eric Durocher

Resolution: → invalid
Status: assigned → closed

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.