2012-05-21 15:12:37 +04:00
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
2002-08-04 05:37:25 +04:00
<!-- vim:sw=2:et:ts=2:tw=72:
-->
< !DOCTYPE html public "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
< html lang = "en-US" >
< head >
< title > Table Reflow Tech Talk, 2002-08-05< / title >
< style type = "text/css" >
html, body {
height: 100%;
overflow: visible;
}
body {
font-size: 1.4em;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
background: white;
color: black;
}
h1, h2, p {
margin: 0;
}
h1 {
font: inherit;
font-size: 1.5em;
/* text-align: center; */
margin-bottom: 0.8em;
border-bottom: 0.1em solid #006;
color: #006;
}
h2 {
font: inherit;
font-size: 1.2em;
text-align: left;
margin: 0.15em 0;
}
ul {
padding: 0 0 0 1.4em;
margin: 0;
}
li { margin: 0;
margin-top: 0.5em;
padding: 0;
font-size: 1.0em;}
div.slide {
position: relative;
min-height: 100%;
}
div.nav {
/*
position: absolute;
top: 4px;
right: 4px;
*/
float: right;
margin: 4px;
}
div.nav :link, div.nav :visited, div.nav span {
text-decoration: none;
background: #006;
color: white;
padding: 0 0.4em 0.2em 0.4em;
line-height: 1.4em;
}
div.nav :link:hover, div.nav :visited:hover {
background: #00f;
}
2002-08-04 10:05:25 +04:00
table {
2002-08-04 05:37:25 +04:00
margin: auto;
}
2002-08-04 10:05:25 +04:00
table.box {
border-collapse: collapse;
border: 2px solid black;
2014-02-06 23:32:05 +04:00
box-sizing: border-box;
2002-08-04 10:05:25 +04:00
width:98%;
height:96%;
}
row {
border: 2px solid black;
}
row.title {
border: hidden;
}
table td {
2002-08-05 04:26:59 +04:00
/*text-align: center;*/
2002-08-04 05:37:25 +04:00
empty-cells: hide;
}
2002-08-04 10:05:25 +04:00
table td.box {
height:100%;
border: 2px solid black;
}
table td.title {
border-top: hidden;
border-right: hidden;
border-left: hidden;
font-size: .5em;
}
table td.title2 {
border-bottom: hidden;
border-right: hidden;
border-left: hidden;
font-size: .5em;
}
2002-08-04 05:37:25 +04:00
table.tree tr:not(.arrows) td {
font-family: monospace;
border: 0.1em solid;
2002-08-05 04:26:59 +04:00
font-size: .7em;
text-align:center;
}
table td.left-arrow {
text-align: right;
}
table td.right-arrow {
text-align: left;
}
table td.center-arrow {
text-align: center;
2002-08-04 05:37:25 +04:00
}
2002-08-04 10:05:25 +04:00
span.html {
color:purple;
}
2002-08-05 04:26:59 +04:00
table td.space {
width: 5%;
}
table td.frame {
width: 22%;
}
2002-08-05 21:37:49 +04:00
span.comment {
color: red;
}
2002-08-04 05:37:25 +04:00
< / style >
< / head >
< body >
< div class = "slide" id = "s0" >
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s28" > < < / a >
2002-08-04 05:37:25 +04:00
< a href = "#s1" > > < / a >
< / div >
< table style = "margin: auto" > < tr > < td >
< center >
< h1 > Table Reflow Internals< br > Tech Talk< / h1 >
< p > Aug 5, 2002< / p >
< p style = "margin-top: 0.5em" > Chris Karnaze< / a > < / p >
< / center >
< / td > < / tr > < / table >
< / div >
< div class = "slide" id = "s1" >
< div class = "nav" >
< a href = "#s0" > < < / a >
< a href = "#s2" > > < / a >
< / div >
< h1 > Overview< / h1 >
< ul >
< li > Review of reflow< / li >
< li > Table frames< / li >
< li > Table reflow< / li >
2002-08-04 10:05:25 +04:00
< li > Intro to paginated reflow< / li >
< li > Table paginated reflow< / li >
2002-08-04 05:37:25 +04:00
< / ul >
< / div >
< div class = "slide" id = "s2" >
< div class = "nav" >
< a href = "#s1" > < < / a >
< a href = "#s3" > > < / a >
< / div >
< h1 > Review of Reflow< / h1 >
< ul >
< li > Reflow process starts when
< ul >
< li > An html document starts loading (the frame tree contains only viewport, scroll(s), canvas, html, body).< / li >
< li > The initial chunk of an xml doc is loaded.< / li >
< li > The initial chunk of an html doc (or a subsequent chunk of an xml doc) is loaded. The container posts a
dirty reflow command with itself as the target. < / li >
< li > Content is inserted, appended, or deleted through the DOM. The container posts a dirty reflow command
with itself as the target.< / li >
< li > Style changes through the DOM - javascript, browser change font (CTRL+/-), a preference changes, etc.< / li >
< / ul >
< / li >
< / ul >
< / div >
< div class = "slide" id = "s3" >
< div class = "nav" >
< a href = "#s2" > < < / a >
< a href = "#s4" > > < / a >
< / div >
< h1 > Review of Reflow< / h1 >
< ul >
2002-08-05 21:37:49 +04:00
< li > Reflow starts with pres shell
2002-08-05 04:26:59 +04:00
< ul >
2002-08-05 21:37:49 +04:00
< li > Which reflows the reflow root (usually the view port frame),< / li >
< li > Which reflows it children, etc.< / li >
2002-08-05 04:26:59 +04:00
< / ul >
< / li >
2002-08-04 05:37:25 +04:00
< li > Ususally it starts when the pres shell processes its queue of reflow commands.< / li >
< li > The reflower
< ul >
2002-08-05 21:37:49 +04:00
< li > Positions reflowee (if it can) before actually reflowing in case views are involved
(e.g. absolutely positioned elements) < / li >
2002-08-05 04:26:59 +04:00
< li > Reflows reflowee and passes a reflow state (in) and a reflow metrics (in/out)< / li >
2002-08-04 05:37:25 +04:00
< / ul >
2002-08-05 04:26:59 +04:00
< / li >
2002-08-04 05:37:25 +04:00
< / ul >
< / div >
< div class = "slide" id = "s4" >
< div class = "nav" >
< a href = "#s3" > < < / a >
< a href = "#s5" > > < / a >
< / div >
< h1 > Review of Reflow< / h1 >
< ul >
2002-08-05 21:37:49 +04:00
< li > The reflow state:
2002-08-05 04:26:59 +04:00
< ul >
< li > Is a node in a tree structurally equivalent to the frame tree of reflow participants< / li >
< li > contains:
< ul >
< li > reflow type,< / li >
2002-08-05 21:37:49 +04:00
< li > avail size,< / li >
2002-08-05 04:26:59 +04:00
< li > various computed values,< / li >
< li > resolved style structs< / li >
< li > possible request for preferred size and more.< / li >
< / ul >
< / li >
< / ul >
< / li >
< / ul >
< / div >
< div class = "slide" id = "s5" >
< div class = "nav" >
< a href = "#s4" > < < / a >
< a href = "#s6" > > < / a >
< / div >
< h1 > Review of Reflow< / h1 >
< ul >
< / li >
< li > the reflow metrics contains:
< ul class = nested >
2002-08-04 05:37:25 +04:00
< li > max element size (if requested) - the minimum size it can be< / li >
< li > preferred size (if requested) - the size it would like to be given no size constraints.< / li >
< li > desired size - the size it would like to be given the avail size. This
2002-08-05 04:26:59 +04:00
is equivalent to preferred size if the avail size is not constrained.< / li >
2002-08-04 05:37:25 +04:00
< / ul >
< / li >
2002-08-05 04:26:59 +04:00
< / ul >
< / div >
< div class = "slide" id = "s6" >
< div class = "nav" >
< a href = "#s5" > < < / a >
< a href = "#s7" > > < / a >
< / div >
< h1 > Review of Reflow< / h1 >
< ul >
< li > The reflowee sets various sizes in the reflow metrics after (possibly) reflowing some or all of its children
which reflows it children, etc.< / li >
< li > The reflowee returns a reflow status which indicates
2002-08-04 05:37:25 +04:00
< ul class = nested >
< li > if it is complete, and thus not have to continue (split)< / li >
< li > breaking status (in the case of some inline frames)< / li >
< li > if there is truncation (it can't fit in the space and can't split). This is just a convience mechanism.< / li >
< / ul >
< / li >
2002-08-05 04:26:59 +04:00
2002-08-04 05:37:25 +04:00
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s7" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s6" > < < / a >
< a href = "#s8" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
2002-08-05 04:26:59 +04:00
2002-08-04 05:37:25 +04:00
< h1 > Kinds of reflows< / h1 >
< ul >
2002-08-05 21:37:49 +04:00
< li > Initial - reflowee's first reflow must be of this type (reflower's responsibility).< / li >
< li > Resize - reflowee gets a change in available space only. Similar to initial, except it can reoccur.< / li >
< li > Incremental - has a reflow path (tree) where each node has a command with a target frame, < br > reflow command types are:< / li >
2002-08-04 05:37:25 +04:00
< ul class = nested >
< li > dirty - something changed inside a target (e.g. it gains, loses children)< / li >
< li > style changed - a target changed stylisticly (recall, size is a style property)< / li >
< li > content changed - a target's content changed (e.g. a text run)< / li >
< li > user defined - currently only used for fixed positioned frames < / li >
< / ul >
< / li >
< / ul >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s8" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s7" > < < / a >
< a href = "#s9" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
< h1 > Kinds of reflows< / h1 >
< ul >
2002-08-05 21:37:49 +04:00
< li > Incremental reflow (continued)
2002-08-04 05:37:25 +04:00
< ul class = nested >
< li > reflower not allowed to change available size of reflowee< / li >
< li > reflow commands get coalesced to streamline processing< / li >
< / ul >
< / li >
2002-08-05 21:37:49 +04:00
< li > Style change
2002-08-04 05:37:25 +04:00
< ul class = nested >
< li > a target changed stylistic if there is a target, otherwise every frame may need to respond< / li >
< li > parent of target usually turns it into an incremental reflow with a style changed command type< / li >
< / ul >
< / li >
< / ul >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s9" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s8" > < < / a >
< a href = "#s10" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
< h1 > Table Frames< / h1 >
2002-08-05 04:26:59 +04:00
< BR >
< table class = "tree" width = 90% >
< tr > < td class = frame > < td class = space style = "width:2%" > < td class = frame > < td class = space style = "width:2%" >
< td class = frame > < td class = space > < td class = frame > < / tr >
< tr > < td > < td > < td class = frame > < td >
< td > nsTableOuter Frame< td > < td > < / tr >
< tr class = "arrows" > < td > < td > < td > < td class = left-arrow > ↙ < td > < td class = right-arrow > ↘ < / tr >
< tr > < td > < td > < td > nsTable< BR > Frame< td > < td > < td > < td > nsTableCaption< BR > Frame< / tr >
< tr class = "arrows" > < td > < td class = left-arrow > ↙ < td > < td class = right-arrow > ↘ < td > < td > < td class = center-arrow > ↓ < / tr >
< tr > < td > nsTableCol< BR > GroupFrame< td > < td > < TD > < td > nsTableRow< BR > GroupFrame< td > < td > nsBlockFrame< / tr >
< tr class = "arrows" > < td class = center-arrow > ↓ < td > < td > < td > < td class = center-arrow > ↓ < / tr >
< tr > < td > nsTableCol< BR > Frame< td > < TD > < TD > < td > nsTableRow< BR > Frame< / tr >
< tr class = "arrows" > < td > < td > < td > < td > < td class = center-arrow > ↓ < / tr >
< tr > < td > < td > < td > < TD > < td > nsTableCell< BR > Frame< / tr >
< tr class = "arrows" > < td > < td > < td > < td > < td class = center-arrow > ↓ < / tr >
< tr > < td > < td > < td > < TD > < td > nsBlock< BR > Frame< / tr >
< / table >
2002-08-04 05:37:25 +04:00
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s10" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s9" > < < / a >
< a href = "#s11" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
< h1 > Table Reflow< / h1 >
< ul >
2016-06-16 15:14:08 +03:00
< li > table wrapper reflows table and caption (if present)< / li >
2002-08-05 21:37:49 +04:00
< li > Table reflows row groups in multiple passes< / li >
2002-08-04 05:37:25 +04:00
< ul class = nested >
< li > Pass 1 - unconstrained width, height and requests max elem width.< / li >
< li > The table figures out the column widths (balances) given the style width constraints
2002-08-05 04:26:59 +04:00
on the table, col groups, cols, cells the preferred and max element sizes of the cells
2002-08-04 05:37:25 +04:00
(from the pass 1 reflow), and considers colspans< / li >
< li > Pass 2 - cell widths are constrained by the column widths (heights are only
2002-08-04 10:05:25 +04:00
constrained in paginated mode).< / li >
2002-08-05 04:26:59 +04:00
< / ul >
< / li >
< / ul >
< / div >
< div class = "slide" id = "s11" >
< div class = "nav" >
< a href = "#s10" > < < / a >
< a href = "#s12" > > < / a >
< / div >
< h1 > Table Reflow< / h1 >
< ul >
2002-08-05 21:37:49 +04:00
< li > Table reflows row groups (continued)< / li >
2002-08-05 04:26:59 +04:00
< ul class = nested >
2002-08-04 05:37:25 +04:00
< li > The row group figures out the row heights given the its style height constraints
its rows and cells and the actual heights of its rows and cells from the pass 2 reflow< / li >
< li > If the table has a style height, it allocates extra height to its row groups, rows and cells.< / li >
< / ul >
< / li >
2002-08-05 21:37:49 +04:00
< li > In each pass, row groups reflow rows which reflow cells which reflow cell blocks< / li >
2002-08-04 05:37:25 +04:00
< / ul >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s12" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s11" > < < / a >
< a href = "#s13" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
2002-08-04 10:05:25 +04:00
< h1 > Table Reflow Example< / h1 >
< table width = 100% >
< tr >
< td width = 100% >
< pre style = "font-size:.6em;" >
2016-06-16 15:35:43 +03:00
tblW 030176CC r=0 a=8940,UC c=0,0 cnt=429
2002-08-04 10:05:25 +04:00
tbl 030178C4 r=0 a=8940,UC c=4470,UC cnt=430
rowG 03017A7C r=0 a=UC,UC c=UC,UC cnt=431
row 03017C08 r=0 a=UC,UC c=UC,UC cnt=432
cell 03017DA8 r=0 a=UC,UC c=UC,UC cnt=433
block 03017E08 r=0 a=UC,UC c=UC,UC cnt=434
block 03017E08 d=870,300 me=480
cell 03017DA8 d=930,360 me=540
cell 0301A8CC r=0 a=UC,UC c=UC,UC cnt=436
block 0301A92C r=0 a=UC,UC c=UC,UC cnt=437
block 0301A92C d=1335,300 me=465
cell 0301A8CC d=1395,360 me=525
row 03017C08 d=UC,360
rowG 03017A7C d=UC,360
rowG 03017A7C r=2 a=4470,UC c=4470,UC cnt=442
row 03017C08 r=2 a=4470,UC c=4470,UC cnt=443
cell 03017DA8 r=2 a=1755,UC c=1695,UC cnt=444
block 03017E08 r=2 a=1695,UC c=1695,UC cnt=445
block 03017E08 d=1695,300
cell 03017DA8 d=1755,360
cell 0301A8CC r=2 a=2625,UC c=2565,UC cnt=446
block 0301A92C r=2 a=2565,UC c=2565,UC cnt=447
block 0301A92C d=2565,300
cell 0301A8CC d=2625,360
row 03017C08 d=4470,360
rowG 03017A7C d=4470,360
tbl 030178C4 d=4500,450
2016-06-16 15:35:43 +03:00
tblW 030176CC d=4500,450
2002-08-05 21:37:49 +04:00
< a href = "frame_reflow_debug.html" > frame reflow debugging< / a > gives instructions
for turning this on.
< / pre >
2002-08-04 10:05:25 +04:00
< / td >
< td >
< pre style = "font-size:.7em;" >
< < span class = html > table< / span > width=300>
< < span class = html > tr< / span > >
< < span class = html > td< / span > > foo< < span class = html > /td< / span > >
< < span class = html > td< / span > > bar zap< < span class = html > /td< / span > >
< < span class = html > /tr< / span > >
< < span class = html > /table< / span > >
< / pre >
< BR >
< BR >
< pre style = "font-size:.7em;" >
Key:
r = reflow reason,
0 (initial),
2 (resize)
a = avail w, h
c = computed w, h
d = desired w, h
me = max elem w
< pre >
< / td >
< / tr >
< / table >
2002-08-04 05:37:25 +04:00
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s13" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s12" > < < / a >
< a href = "#s14" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
< h1 > Table reflow optimizations< / h1 >
< ul >
2002-08-05 04:26:59 +04:00
< li > If the table is already balanced, pass 1 constrains the width (like a normal pass 2) based on the current
2002-08-05 21:37:49 +04:00
column widths. The pass 2 will get skipped if the table doesn't need to rebalance. <!-- <span class="comment">please clarify when can this happen</span> --> < / li >
2002-08-04 05:37:25 +04:00
< li > Nested table reflowed with an unconstrained width (i.e. an ancestor is doing a pass 1 reflow)
will only do a pass 1 reflow on its children< / li >
2016-06-16 15:14:08 +03:00
< li > table wrapper caches last avail width and avoids reflowing children if resize reflow is the same as previous< / li >
2002-08-04 05:37:25 +04:00
< li > Table caches max element, preferred widths in case they are requested and it isn't rebalanced< / li >
< li > Cell caches prior avail width. if this doesn't change, the row may not have to reflow the cell< / li >
< / ul >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s14" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s13" > < < / a >
< a href = "#s15" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
< h1 > Table incremental reflow< / h1 >
< ul >
2016-06-16 15:14:08 +03:00
< li > table wrapper is a target when a caption is added or removed (dirty) or the table or caption margin
2002-08-04 05:37:25 +04:00
changes (style changed).< / li >
< li > Caption is a target when it changes stylistically (style changed).< / li >
< li > Table, row group, row, col group, col is a target when a child is added or removed (dirty) or it changes
2002-08-05 21:37:49 +04:00
stylistically (style changed). <!-- <span class="comment">please show how the column style change is propagated
into the cell reflows as the cells are reflowed by their parent rows and not cols< / span > -->< / li >
2002-08-04 05:37:25 +04:00
< li > In the dirty cases, a target posted the reflow command in AppendFrames, InsertFrames, or DeleteFrame.< / li >
< / ul >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s15" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s14" > < < / a >
< a href = "#s16" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
< h1 > Table incremental reflow< / h1 >
< ul >
< li > In the style change cases where a target is between the table and the cell, the table is told to rebalance.< / li >
< li > When a target is the cell or below and the cell changes size, the row tells the table so it can decide if
it needs to rebalance< / li >
< li > When a target is inside the cell's block, the cell
requests max element, preferred sizes of its block in case they change< / li >
< li > After the table reflows the row group(s) containing the targets, if it rebalances, it then does a pass 2 reflow.< / li >
< / ul >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s16" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s15" > < < / a >
< a href = "#s17" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
< h1 > Special height reflow< / h1 >
< ul >
< li > When there is a % height frame inside a cell without a computed height< / li >
< ul class = nested >
< li > the frame will never get a chance to size based on the final cell height< / li >
2002-08-04 10:05:25 +04:00
< li > in paginated mode when there is a height on the table, the table doesn't allocate
2002-08-04 05:37:25 +04:00
extra height to rows until after it does a pass 2 reflow and then it is too late< / li >
< / ul >
< / li >
< li > This can be fixed by doing a special 3rd pass reflow< / li >
< / ul >
< / div >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s17" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s16" > < < / a >
< a href = "#s18" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
2002-08-04 10:05:25 +04:00
< h1 > Special Reflow Example< / h1 >
2002-08-05 04:26:59 +04:00
< table width = 100% style = "text-align:left;" >
2002-08-04 10:05:25 +04:00
< tr >
< td >
2002-08-05 04:26:59 +04:00
< pre style = "font-size:.7em; text-align:left;" >
2002-08-04 10:05:25 +04:00
< < span class = html > table< / span > border=2 width=300>
< < span class = html > tr< / span > >
< < span class = html > td< / span > >
This cell's width is
constrained by the
table and image widths.
Its exact height is
hard to determine.
< < span class = html > /td< / span > >
< < span class = html > td< / span > >
< < span class = html > img< / span > src=raptor.jpg
width=200 height=100%>
< < span class = html > /td< / span > >
< < span class = html > /tr< / span > >
< < span class = html > /table< / span > >
< / pre >
< / td >
< td >
< table border = 2 width = 300 >
< tr >
< td style = "font-size:.7em;" > This cell's width is constrained
2002-08-05 04:26:59 +04:00
by the table and image widths. < BR > < BR > Its height
is hard to determine.< BR > < BR > The image needs to be as high as the cell.
2002-08-04 10:05:25 +04:00
< td >
2002-08-08 10:12:35 +04:00
<!-- need ?raw=1 for lxr to cough up the image data, not a pretty page -->
< img src = "raptor.jpg?raw=1"
2002-08-04 10:05:25 +04:00
width=200 height=100%>
< / td >
< / tr >
< / table >
< / tr >
< / table >
2002-08-04 05:37:25 +04:00
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s18" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s17" > < < / a >
< a href = "#s19" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
< h1 > Special height reflow< / h1 >
< ul >
< li > The reflow state holds an observer and initiator< / li >
2002-08-05 21:37:49 +04:00
< li > Observer< / li >
2002-08-04 05:37:25 +04:00
< ul class = nested >
< li > is the table cell used as the height basis< / li >
< li > set by frame without computed height in DidReflow< / li >
< li > gives its block a computed height during 3rd pass< / li >
< li > doesn't change height during 3rd pass< / li >
< / ul >
< / li >
2002-08-05 21:37:49 +04:00
< li > Initiator< / li >
2002-08-04 05:37:25 +04:00
< ul class = nested >
< li > is the table containing the observer< / li >
< li > starts the 3rd pass reflow and sets a bit in the reflow state< / li >
< li > gives its block a computed height during 3rd pass< / li >
< li > could also be inside a cell which is an observer< / li >
< / ul >
< / li >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s19" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s18" > < < / a >
< a href = "#s20" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
< h1 > Special height reflow< / h1 >
< ul >
2002-08-05 21:37:49 +04:00
< li > Optimizations< / li >
2002-08-04 05:37:25 +04:00
< ul class = nested >
< li > only frames needing 3rd pass actually get it< / li >
< li > frames gettting a 3rd pass only get it once< / li >
< / ul >
< / li >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s20" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s19" > < < / a >
< a href = "#s21" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
2002-08-04 10:05:25 +04:00
< h1 > Intro to paginated reflow< / h1 >
2002-08-04 05:37:25 +04:00
< ul >
< li > When a reflowee's available height is constrained, it may not fit and need to either
split/continue on the next page, or start on the next page.< / li >
< ul class = nested >
< li > If it can continue, it returns an incomplete status.< / li >
< li > If it can't continue it returns a complete status.< / li >
< / ul >
< / li >
< li > A continuation may also need to be continued< / li >
< li > Continuations are linked together by prevInFlow and nextInFlow pointers < / li >
< / ul >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s21" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s20" > < < / a >
< a href = "#s22" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
2002-08-04 10:05:25 +04:00
< h1 > Pagination Illustration< / h1 >
< table class = box style = "height:500px" >
< tr > < td class = "title" > nsSimplePageSequence< / td > < / tr >
< tr >
< td class = box >
< table class = box style = "height:40%;" >
< tr > < td class = title > nsPageFrame< / td > < / tr >
< tr >
< td class = box >
< table class = box style = "height:100%;" >
< tr > < td class = title > nsPageContentFrame< / td > < / tr >
< tr >
< td class = box style = "border-bottom: hidden" >
< table class = box style = "height:100%; border-bottom:hidden" >
< tr > < td class = title > areaFrame (html)< / td > < / tr >
< tr >
< td class = box >
< table class = box style = "height:100%; border-bottom:hidden" >
< tr > < td class = title > blockFrame (body)< / td > < / tr >
< tr >
< td class = box >
< table class = box style = "height:100%; border-bottom:hidden" >
2016-06-16 15:14:08 +03:00
< tr > < td class = title > nsTableWrapperFrame< / td > < / tr >
2002-08-04 10:05:25 +04:00
< tr >
< td class = box > < / td >
< / tr >
< / table >
< / td >
< / tr >
< / table >
< / td >
< / tr >
< / table >
< / tr >
< / table >
< / td >
< / tr >
< / table >
< BR >
< table class = box style = "height:40%;" >
< tr >
< td class = box >
< table class = box style = "height:100%;" >
< tr >
< td class = box style = "border-top: hidden" >
< table class = box style = "height:100%; border-top:hidden" >
< tr >
< td class = box >
< table class = box style = "height:100%; border-top:hidden" >
< tr >
< td class = box >
< table class = box style = "height:100%; border-top:hidden" >
< tr >
< td class = box > < / td >
< / tr >
2016-06-16 15:14:08 +03:00
< tr > < td class = title2 > nsTableWrapperFrame< / td > < / tr >
2002-08-04 10:05:25 +04:00
< / table >
< / td >
< / tr >
< tr > < td class = title2 > blockFrame (body)< / td > < / tr >
< / table >
< / td >
< / tr >
< tr > < td class = title2 > areaFrame (html)< / td > < / tr >
< / table >
< / tr >
< tr > < td class = title2 > nsPageContentFrame continued< / td > < / tr >
< / table >
< / td >
< / tr >
< tr > < td class = title2 > nsPageFrame continued< / td > < / tr >
< / table >
< / td >
< / tr >
< / table >
2002-08-04 05:37:25 +04:00
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s22" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s21" > < < / a >
< a href = "#s23" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
2002-08-04 10:05:25 +04:00
< h1 > Intro to paginated reflow< / h1 >
2002-08-04 05:37:25 +04:00
< ul >
< li > The page sequence starts with one page and reflows it. If the page is incomplete then the page sequence
creates a continuation for the page and sets it as the page's next sibling (it is also the page's
nextInFlow).< / li >
< li > The page was incomplete because the page content was incomplete because the doc root was incomplete< / li >
< li > The doc root was incomplete because it contained lines that didn't fit (or if it was mapped to a table,
because the table didn't fit) becacause a line contained something that didn't fit, etc.< / li >
< / ul >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s23" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s22" > < < / a >
< a href = "#s24" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
2002-08-04 10:05:25 +04:00
< h1 > Intro to paginated reflow< / h1 >
2002-08-04 05:37:25 +04:00
< ul >
< li > If the reflowee is incomplete, the reflower has the responsiblity to:
< ul >
< li > Create a continuation for the reflowee< / li >
< li > Ensure that the continuation gets put in the frame hierarchy at the right place
and gets reflowed at the right time.< / li >
< li > Typically, a reflower accomplishes this by putting the continuation (c) on an overflow
list which the reflower owns. When the reflower's continuation gets reflowed, it takes c
and its siblings as children and reflows them.< / li >
< / ul >
< / li >
< li > If the reflowee is complete, truncated (it didn't fit), not at the top of page,
the reflower should put the reflowee on its overflow list and return an incomplete status.< / li >
< / ul >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s24" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s23" > < < / a >
< a href = "#s25" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
2002-08-04 10:05:25 +04:00
< h1 > Intro to paginated reflow< / h1 >
2002-08-04 05:37:25 +04:00
< ul >
< li > Special assumptions
< ul >
< li > There are only initial and (possibly) resize reflows. Incremental
and style change reflows are not allowed.< / li >
< li > Multiple resize reflows may be necessary (e.g. a child is truncated and gets reflowed on a
subsequent page) but they should not change the available width from the last time.< / li >
< li > Multiple resize reflows may require special handling if a frame split previously. It may need
to "pull up" children from a continuation.< / li >
< / ul >
< / li >
< / ul >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s25" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s24" > < < / a >
< a href = "#s26" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
< h1 > Table paginated reflow< / h1 >
< ul >
2016-06-16 15:14:08 +03:00
< li > The block containing the table wrapper reflows it. If it is incomplete, the block will
2002-08-04 05:37:25 +04:00
< ul >
2016-06-16 15:14:08 +03:00
< li > create a continuation for the table wrapper (which also creates a continuation for the table).< / li >
2002-08-04 05:37:25 +04:00
< li > put the continuation on a new line and place that line on its overflow lines property.< / li >
< / ul >
< / li >
2016-06-16 15:14:08 +03:00
< li > The table wrapper reflows the table and just returns the status of the table.< / li >
2002-08-04 05:37:25 +04:00
< li > The table does a pass 1 reflow and balances. If it is incomplete,< / li >
< ul >
< li > it will become the first-in-flow< / li >
< li > it will be the only frame among its continuations to ever balance or calc the cell map, and it only
does this once< / li >
< / ul >
< / li >
< / ul >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s26" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s25" > < < / a >
< a href = "#s27" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
< h1 > Table paginated reflow< / h1 >
< ul >
< li > The table does a pass 2 reflow constraining both avail heights and widths. If a row group is incomplete, the table
< ul >
< li > creates a continuation for the row group< / li >
< li > puts the continuation in its overflow frames property< / li >
< / ul >
< / li >
< li > What follows only applies during the pass 2 reflow.< / li >
< li > The row group< / li >
< ul >
< li > reflows all of its rows with unconstrained heights and calculates the row heights,< / li >
< li > figures out which row falls on a page boundary and reflows it with a constrained height. If there
will be a pass 3 reflow then this should (bug) happen at that time instead.< / li >
2002-08-05 04:26:59 +04:00
< / ul >
< / li >
< / ul >
< / div >
< div class = "slide" id = "s27" >
< div class = "nav" >
< a href = "#s26" > < < / a >
< a href = "#s28" > > < / a >
< / div >
< h1 > Table paginated reflow< / h1 >
< ul >
< li > The row group (continued)< / li >
< ul >
< li > creates a continuation for the incomplete row (which also creates continuations for all of its cells
2002-08-04 05:37:25 +04:00
and all of the cell blocks)< / li >
< li > puts the continuation in its overflow frames property. If the row was truncated and not top of page,
the row is put in the overflow frames property.
< / ul >
< / li >
< / ul >
< / div >
2002-08-05 04:26:59 +04:00
< div class = "slide" id = "s28" >
2002-08-04 05:37:25 +04:00
< div class = "nav" >
2002-08-05 04:26:59 +04:00
< a href = "#s27" > < < / a >
2002-08-04 10:05:25 +04:00
< a href = "#s0" > > < / a >
2002-08-04 05:37:25 +04:00
< / div >
< h1 > Table paginated reflow< / h1 >
< ul >
< li > The row and cells (getting the constrained height reflow) just reflow their children with a constrained height.
They don't need an overflow list for continued children because the continuations were created when the
row group created the row's continutation.< / li >
< li > A cell is incomplete because its block is incomplete. The block uses the overflow lines mechanism
(mentioned above) for its continued children< / li >
< / li >
< li > There are two splitting scenarios for a table
< ul >
2016-06-16 15:14:08 +03:00
< li > An incomplete cells block causes the cell, row, row group, table, table wrapper to
2002-08-04 05:37:25 +04:00
be incomplete< / li >
< li > A truncated row or a row that started too far down the page causes the row group,
2016-06-16 15:14:08 +03:00
table, table wrapper to be incomplete.< / li >
2002-08-04 05:37:25 +04:00
< / ul >
< / li >
< / ul >
< / div >
< / body >
< / html >
