Closed Bug 511493 Opened 10 years ago Closed 10 years ago

Tab strip should dynamically reflow thumbnails based on screen size

Categories

(Firefox for Android Graveyard :: General, defect)

x86
Linux
defect
Not set

Tracking

(Not tracked)

RESOLVED FIXED
fennec1.0b4

People

(Reporter: mfinkle, Assigned: vingtetun)

References

Details

Attachments

(2 files)

We currently hard code 4 thumbnails per column. We should flow based on available space.
tracking-fennec: --- → ?
Attached patch Patch v0.1Splinter Review
This patch use moz-column-width to flow the content accordingly to the available space.
vivien: why do you need the update size/column count/width/height settings?  I would like for this code to just auto-flow, possibly ahving to call onAFterVisibleMove whenever a tab gets added/removed to make sure we stay in sync.
(In reply to comment #2)
> vivien: why do you need the update size/column count/width/height settings?  I
> would like for this code to just auto-flow,

me too..
I'm not sure if it's a bug or not but ordering content with moz-column doesn't update the width of the container. The columns outside the container seems to be generated like :after/:before, I mean as frame that are outside of the document flow.
Reading the spec (http://www.w3.org/TR/css3-multicol/) I've found nothing about it.


> possibly ahving to call
> onAFterVisibleMove whenever a tab gets added/removed to make sure we stay in
> sync.

yeah, I've forgot the bv.onAfterVisibleMove call.
lets ask roc -- would rather not land the complicated version in here.  can you post your testcase in here as well?
Attached file testcase
the tescase, i was expecting the container to grow accordingly to content.
The problem is that you've set 'height' on the -moz-column element. That forces the height to be fixed and we'll avoid overflowing the height by adding columns horizontally.

If you remove the 'height' the columns will reflow as you expect.
Also, does this really give good UI behaviour?
If you have enough space for 4 tabs across and you have 4 tabs then the thumbnails will be displayed
 1 2 3 4

If you then add a tab, you'll get
 1 3 5
 2 4

So every tab except for the first one changes position, and tabs that used to be close together (like 2 and 3) are no longer close together.
(In reply to comment #8)
> The problem is that you've set 'height' on the -moz-column element. That forces
> the height to be fixed and we'll avoid overflowing the height by adding columns
> horizontally.
> 
> If you remove the 'height' the columns will reflow as you expect.

Sorry, it missed a little context here. 
if the testcase is done like that, it's for reproduce what we want for the tabs strip of Fennec : the tabs are constraint in a container and try to overflow horizontally, not vertically.

That's why i set the height of the container, that's the behavior i want.
I mean, i want the tab to expand horizontally and i expect the container to grow accordingly (in width).

(In reply to comment #9)
> Also, does this really give good UI behaviour?
> If you have enough space for 4 tabs across and you have 4 tabs then the
> thumbnails will be displayed
>  1 2 3 4
> 

yes, but initially the tabs strip only have an available width to display one tab, so they will fit like:
|1|
|2|
|3|
|4|

> If you then add a tab, you'll get
>  1 3 5
>  2 4
> 
> So every tab except for the first one changes position, and tabs that used to
> be close together (like 2 and 3) are no longer close together.

And with the height constraint, they will expand :
|1| 5 9
|2| 6 *
|3| 7
|4| 8


My problem is that the container doesn't expand its width.
CSS blocks never expand their width to contain their contents, sorry but that's just how CSS works.

Perhaps when you add or remove a tab from the container you could manually set the width to the necessary width?
(In reply to comment #11)
> CSS blocks never expand their width to contain their contents, sorry but that's
> just how CSS works.
> 
> Perhaps when you add or remove a tab from the container you could manually set
> the width to the necessary width?

Thanks. Actually that's what i'm doing in the attached patch, i just want to confirm that the right way to do it.

Thanks again.
Comment on attachment 395486 [details] [diff] [review]
Patch v0.1

Stuart, after that, does it make sense to use moz-column?

(Personally, I'll be very happy to remove the current vbox hack)
Attachment #395486 - Flags: review?(mark.finkle) → review?(pavlov)
Attachment #395486 - Flags: review?(pavlov) → review+
Blocks: 477628
pushed:
https://hg.mozilla.org/mobile-browser/rev/961104d62837
Status: NEW → RESOLVED
Closed: 10 years ago
Resolution: --- → FIXED
Target Milestone: --- → B4
tracking-fennec: ? → ---
You need to log in before you can comment on or make changes to this bug.