898324 - There is 1px shifting down of selection border

Status: VERIFIED FIXED

(Firefox OS Graveyard :: Gaia::Video, defect)

Description

[John Hu [:johnhu][:johu][:醬糊小弟]]

Branch: master/v1.1.0hd
Symptom: The border of selected video is shifting 1px
STR:
    1. open video app
    2. tap selection button
    3. select video

Note:
   This bug only happens on HDPI device. If I use non-HDPI device, I can't see this bug. It may be the rounding bug

Comment 1

[John Hu [:johnhu][:johu][:醬糊小弟]]

Attachment: screenshot

Comment 3

[Neo Hsieh [:neo]]

Hi Patryk, Please have a look about this issue. Our SW scale the border from 4.5px to 3px. And I think now it's fine. But I need to know the standard solution for this kind of problem. (WVGA HD+)

Comment 4

[John Hu [:johnhu][:johu][:醬糊小弟]]

The device will show 4px so that the border can't wrap the whole list item. The attachment is this case.

The original css settings is using 3px. When device shows, it render as 3 x 1.5 = 4.5px. I think this case happens on all odd number of border size.

Comment 5

[Patryk Adamczyk [:patryk] UX]

Can we get it to round up... to 5px? This is a big problem if we can't. We should never have instances of half pixels.

Comment 6

[John Hu [:johnhu][:johu][:醬糊小弟]]

Attachment: change css setting

We use the following css to configure the border which using outline:

  outline: solid #00aacc 0.3rem;
  outline-offset: -0.3rem;

The outline is already round up to 5px. But the key is in the outline-offset: -0.3rem. It rounds up to -4px. This is the root of this bug. To prevent this and have an expected UI. I move this css settings to inner div and change -0.3rem to -0.2rem. The patched result can be found at the attachment list.

Comment 7

[John Hu [:johnhu][:johu][:醬糊小弟]]

Attachment: patched-landscape.png

Comment 8

[John Hu [:johnhu][:johu][:醬糊小弟]]

Attachment: patched-nonhdpi-portrait.png

Comment 9

[John Hu [:johnhu][:johu][:醬糊小弟]]

Attachment: patched-portrait.png

Comment 10

[John Hu [:johnhu][:johu][:醬糊小弟]]

Attachment: patched-nonhdpi-landscape.png

Comment 11

[Wayne Chang [:wchang]]

HD+ UI adjustment

Comment 12

[KM Lee [:rexboy] (inactivate after Sep. 22)]

Comment on attachment 782390 [details]
change css setting

The patch looks good to me.

I'm not sure if the behavior to border is expected or need to be fixed in Gecko, but this workaround looks good for me. IMO we can try to discuss if we need to open a bug for that.

Comment 13

[John Hu [:johnhu][:johu][:醬糊小弟]]

landed to master:

https://github.com/mozilla-b2g/gaia/commit/a3528ad962afb6d7c566b05df5949733e9d4fd21


I will find a time to discuss with you.

Comment 14

[John Hu [:johnhu][:johu][:醬糊小弟]]

Tim,

This bug needs to be uplifted to v1.1.0hd.

Comment 15

[Tim Guan-tin Chien [:timdream] (please needinfo)]

For master -> v1.1hd please uplift the code yourself. Thanks.

Comment 16

[John Hu [:johnhu][:johu][:醬糊小弟]]

merged to v1.1.0hd:
https://github.com/mozilla-b2g/gaia/commit/8059864bd278645ab5d2598b5ed595154136c253

Comment 17

[Al Tsai [:atsai]]

[2013/10/21 Helix Testing]
Gaia:     c829a2042594b6c3a4899ee27979799a0f301534
Gecko:    http://hg.mozilla.org/releases/mozilla-b2g18_v1_1_0_hd/rev/f7c657f6d019
BuildID   20131015042201
Version   18.0