Opened 4 years ago

Closed 4 years ago

#5066 closed defect (fixed)

The sort arrow gets covered by the column caption text if column is aligned right

Reported by: Jouni Koivuviita Owned by: Jonatan Kronqvist
Priority: critical Milestone: Vaadin 6.5.0.pre1
Component: Component - client side Version: 6.3.2
Keywords: Cc: hannu@…
Depends on:
Workaround:
Verified:

Description (last modified by Matti Tahvonen)

Currently the sort arrow gets covered by the column caption text if column is aligned right or the column is too narrow (see also #2681).

Attachments (2)

Screen shot 2010-09-17 at 8.18.34 PM.png (37.0 KB) - added by Matti Tahvonen 4 years ago.
Mac style sort indicator
Screen shot 2010-09-17 at 8.18.06 PM.png (12.0 KB) - added by Matti Tahvonen 4 years ago.
Win7 style sort indicator

Download all attachments as: .zip

Change History (15)

comment:1 Changed 4 years ago by Jouni Koivuviita

  • Description modified (diff)

comment:2 Changed 4 years ago by Matti Tahvonen

see also #2681

comment:3 Changed 4 years ago by Artur Signell

  • Milestone set to Vaadin 6.4.4
  • Priority changed from normal to critical

comment:4 Changed 4 years ago by Jonatan Kronqvist

  • Owner changed from ticketmaster to Jonatan Kronqvist
  • Status changed from new to accepted

comment:5 Changed 4 years ago by Jonatan Kronqvist

Suggested fix in [14995]

comment:6 Changed 4 years ago by Matti Tahvonen

  • Description modified (diff)
  • Summary changed from Right aligned table header column headers should show the sort arrow on the left side of the column to The sort arrow gets covered by the column caption text if column is aligned right

IMO aligning the sort indicator is bad way to solve this issue. It doesn't feel familiar from other GUI frameworks. Sort indicator should either be like in Window 7 Explorer (top middle of header) or Mac (on right side, shifts text bit left). The Windows 7 way would solve also #2681 very easily.

In any case it would be good if there was enough class names so that the theme builder can put it anywhere by his/her preferences. But this is secondary goal (and can be postponed), primary goal must be to make this and the related #2681.

PS. The ticket is/was (modified) kind of invalid. The issue should be described in summary if defect, not the suggested solution. Original suggestion from Jouni here:

Right aligned table header column headers could show the sort arrow on the left side of the column

This could be solved with CSS only in modern browsers supporting attribute selectors, but IE fails to comply so the next best thing is probably additional classnames for the column header cell depending on the alignment.

The last option (could probably be the best) is to use an actual element inside the caption for the arrow and not just a CSS background image. This will require much more changes and testing, though.

Changed 4 years ago by Matti Tahvonen

Mac style sort indicator

Changed 4 years ago by Matti Tahvonen

Win7 style sort indicator

comment:7 Changed 4 years ago by Matti Tahvonen

  • Cc hannu@… added

Hannu could also give his vision about the issue.

comment:8 Changed 4 years ago by Artur Signell

  • Milestone changed from Vaadin 6.4.5 to Vaadin 6.4.6

comment:9 Changed 4 years ago by Jonatan Kronqvist

  • Owner changed from Jonatan Kronqvist to Matti Tahvonen
  • Status changed from accepted to assigned

comment:10 Changed 4 years ago by Artur Signell

  • Milestone changed from Vaadin 6.4.6 to Vaadin 6.5.0

Discussed this and came to the conclusion that the arrow should always be on the right and the caption text should be on the left side (move left when sorting indicator is added). If there is not enough room the caption should be clipped.

comment:11 Changed 4 years ago by Jonatan Kronqvist

  • Owner changed from Matti Tahvonen to Jonatan Kronqvist
  • Status changed from assigned to accepted

comment:12 Changed 4 years ago by Jonatan Kronqvist

  • affects_release_notes changed from 0 to 1
  • Resolution set to fixed
  • Status changed from accepted to closed

Fixed in [16130], release notes in [16131].
Reviewed by John Ahlroos.

comment:13 Changed 4 months ago by Artur Signell

  • Fv unset
Note: See TracTickets for help on using tickets.