- From: Phil Cupp via cvs-syncmail <cvsmail@w3.org>
- Date: Sat, 11 Feb 2012 00:38:35 +0000
- To: public-css-commits@w3.org
Update of /sources/public/csswg/css3-grid-align
In directory hutz:/tmp/cvs-serv22297
Modified Files:
Overview.html
Log Message:
Updates to Grid Track Sizing algorithms.
Index: Overview.html
===================================================================
RCS file: /sources/public/csswg/css3-grid-align/Overview.html,v
retrieving revision 1.14
retrieving revision 1.15
diff -u -d -r1.14 -r1.15
--- Overview.html 3 Feb 2012 00:03:19 -0000 1.14
+++ Overview.html 11 Feb 2012 00:38:32 -0000 1.15
@@ -48,7 +48,7 @@
<div class="head">
<p><a href="http://www.w3.org/"><img src="http://www.w3.org/Icons/w3c_home" alt="W3C" width="72" height="48" /></a></p>
<h1 class="title" id="title">CSS Grid Layout</h1>
- <h2>Editor's Draft, 2 Februrary 2012</h2>
+ <h2>Editor's Draft, 10 February 2012</h2>
<dl>
<dt>This version:</dt><dd><a href="http://dev.w3.org/csswg/css3-grid-align">http://dev.w3.org/csswg/css3-grid-align</a></dd>
<dt>Latest published version:</dt><dd><a href="http://www.w3.org/TR/css3-grid-layout">http://www.w3.org/TR/css3-grid-layout</a></dd>
@@ -153,8 +153,7 @@
<li class="tocline"><a class="tocxref" href="#calculating-size-of-grid-tracks"><span class="secno">10. </span>Calculating the Size of Grid Tracks</a>
<ul class="toc">
<li class="tocline"><a class="tocxref" href="#definition-of-terms-for-grid-track-sizing-calculations"><span class="secno">10.1 </span>Definition of Terms for Use in Calculating Grid Track Sizes</a></li>
- <li class="tocline"><a class="tocxref" href="#definition-of-functions-for-grid-track-sizing-calculations"><span class="secno">10.2 </span>Definition of Functions for Use in Calculating Grid Track Sizes</a></li>
- <li class="tocline"><a class="tocxref" href="#grid-track-sizing-algorithm"><span class="secno">10.3 </span>Grid Track Sizing Algorithm</a></li>
+ <li class="tocline"><a class="tocxref" href="#grid-track-sizing-algorithm"><span class="secno">10.2 </span>Grid Track Sizing Algorithm</a></li>
</ul>
</li>
<li class="tocline"><a class="tocxref" href="#changes-from-previous-version"><span class="secno">A. </span>Changes from Previous Version</a></li>
@@ -1460,7 +1459,7 @@
<div id="buttons">
<button id="cancel">Cancel</button>
<button id="back">Back</button>
- <button> id="next">Next</button>
+ <button id="next">Next</button>
</div>
</form></pre>
<div id="automatic-grid-item-placement-algorithm" class="section">
@@ -1710,6 +1709,10 @@
<h3><span class="secno">10.1. </span>Definition of Terms for use in Calculating Grid Track Sizes</h3>
<dl>
<dt>
+ <dfn id="">AvailableSpace</dfn>
+ </dt>
+ <dd>The Grid element’s content box size in the applicable dimension.</dd>
+ <dt>
<dfn id="">MaxTrackSizingFunction</dfn>
</dt>
<dd>One of the <a href="#grid-columns-and-rows-properties"><track-breadth></a> sizing functions assigned as the maximum breadth of a <a href="#grid-track">Grid Track</a>.</dd>
@@ -1720,7 +1723,7 @@
<dt>
<dfn id="">RemainingSpace</dfn>
</dt>
- <dd>The max of zero and the Grid element’s content box size in the applicable dimension less the sum of all <a href="#grid-track">Grid Track</a> UsedBreadth values. This is undefined if the Grid element's box size is also undefined (i.e. the Grid element is shrink-to-fit or the height is auto.)</dd>
+ <dd>The max of zero and the AvailableSpace less the sum of all <a href="#grid-track">Grid Track</a> UsedBreadth values. This is undefined if AvailableSpace is undefined (i.e. the Grid element is shrink-to-fit or the height is auto.)</dd>
<dt>
<dfn id="">SpanCount</dfn>
</dt>
@@ -1729,418 +1732,489 @@
<!--End Section: Definition of Terms for use in Calculating Grid Track Sizes-->
</div>
- <div id="definition-of-functions-for-grid-track-sizing-calculations" class="section">
- <h3><span class="secno">10.2. </span>Definition of Functions for use in Calculating Grid Track Sizes</h3>
- <dl>
+ <div id="grid-track-sizing-algorithm" class="section">
+ <h3><span class="secno">10.2. </span>Grid Track Sizing Algorithm</h3>
+ <ol>
+ <li>Call ComputedUsedBreadthOfGridTracks for Grid Columns to resolve their logical width.</li>
+ <li>Call ComputedUsedBreadthOfGridTracks for Grid Rows to resolve their logical height. The logical width of Grid Columns from the prior step is used in the formatting of <a href="#grid-item">Grid Item</a>s in content-sized Grid Rows to determine their required height.</li>
+ <li>If the minimum content size of any <a href="#grid-item">Grid Item</a> has changed based on available height for the <a href="#grid-item">Grid Item</a> as computed in step 2, adjust the min content size of the <a href="#grid-item">Grid Item</a> and restart the <a href="#grid-track">Grid Track</a> Sizing algorithm (once only).</li>
+ </ol>
+
+ <dl>
<dt>
- <dfn id="function-DistributeSpaceToTracks">DistributeSpaceToTracks</dfn>
+ <dfn id="function-ComputeUsedBreadthOfGridTracks">ComputeUsedBreadthOfGridTracks</dfn>
</dt>
<dd>
<p>
- Ensures that for each <a href="#grid-track">Grid Track</a> in RecipientTracks, a value will be computed, UpdatedTrackBreadth, that represents the <a href="#grid-track">Grid Track</a>'s share of SpaceToDistribute.
+ This is the core <a href="#grid-track">Grid Track</a> sizing algorithm. It is run for Grid columns and Grid rows. The goal of the function is to ensure:
</p>
+ <ol>
+ <li>That each <a href="#grid-track">Grid Track</a> satisfies its MinTrackSizingFunction</li>
+ <li>That each <a href="#grid-track">Grid Track</a> grows from the breadth which satisfied its MinTrackSizingFunction to a breadth which satifies its MaxTrackSizingFunction, subject to RemainingSpace.</li>
+ </ol>
<p>
- There are two parts to this function. The first for loop in step 2 is giving each <a href="#grid-track">Grid Track</a> an equal share of the space, but without exceeding their MaxBreadth values.
- Because there are different MaxBreadths assigned to the different <a href="#grid-track">Grid Track</a>s, the first loop can result in their uneven growth.
+ For the purposes of resolving the breadth that satisfies the MinTrackSizingFunction and MaxTrackSizingFunction, each <a href="#grid-track">Grid Track</a> falls into one of three categories:
</p>
+ <ol>
+ <li>A percentage or length value which can be trivially resolved.</li>
+ <li>A min-content or max-content value which will be resolved based on the measurements of the <a href="#grid-item">Grid Item</a>s which cover the <a href="#grid-track">Grid Track</a>.</li>
+ <li>A fraction value which can only be resolved after determining the RemainingSpace in the <a href="#grid-element">Grid Element</a>'s content box after having considered all contributions from the prior two categories of <a href="#grid-track">Grid Track</a>s.</li>
+ </ol>
<p>
- If the first loop completes having grown every <a href="#grid-track">Grid Track</a> to its MaxBreadth, and there is still SpaceToDistribute, then divide that space evenly
- and assign it to each <a href="#grid-track">Grid Track</a> without regard for its MaxBreadth. This phase of growth will always be even, but only occurs when the IgnoreMaxBreadth flag is true.
+ The breadths which satisfy MinTrackSizingFunctions and MaxTrackSizingFunctions for the first category of <a href="#grid-track">Grid Track</a>s are resolved in step 1 during <a href="#grid-track">Grid Track</a> variable initialization.
+ The breadths which satisfy the MinTrackSizingFunctions and the MaxTrackSizingFunctions for the second category of content-sized <a href="#grid-track">Grid Track</a>s are resolved in step 2. At the end of step 2, the first goal of ComputeUsedBreadthOfGridTracks function has been satisfied:
+ the UsedBreadth variable of each GridTrack now satisfies its MinTrackSizingFunction. The MaxBreadth variable for each <a href="#grid-track">Grid Track</a> now contains the resolved value for its MaxTrackSizingFunction.
+ </p>
+ <p>
+ In step 3, the second goal of this function is satisified as each (non-fraction-sized) <a href="#grid-track">Grid Track</a>
+ attempts to grow from the UsedBreadth value to the MaxBreadth value, subject to RemainingSpace.
+ </p>
+ <p>
+ Finally in step 4, the third category of fraction-sized <a href="#grid-track">Grid Track</a>s can be resolved using what is now the RemainingSpace having updated the UsedBreadth of each <a href="#grid-track">Grid Track</a> at the end of step 3.
</p>
<dl>
<dt>
- <dfn id="function-DistributeSpaceToTracks-inputs">Inputs</dfn>
+ <dfn id="function-ComputeUsedBreadthOfGridTracks-inputs">Inputs</dfn>
</dt>
<dd>
<ul>
- <li>RecipientTracks: The set of <a href="#grid-track">Grid Track</a>s to receive a share of SpaceToDistribute.</li>
- <li>SpaceToDistribute: A length to be distributed among the supplied set of <a href="#grid-track">Grid Track</a>s.</li>
- <li>Accumulator: A function which, given a <a href="#grid-track">Grid Track</a>, returns the variable used to accumulate the results of the UpdatedTrackBreadth between calls to this function.</li>
- <li>IgnoreMaxBreadth: A flag to indicate whether the growth of a <a href="#grid-track">Grid Track</a> is subject to a cap defined by the <a href="#grid-track">Grid Track</a>'s MaxBreadth value.</li>
+ <li>GridTracks: The set of <a href="#grid-track">Grid Track</a>s for which the <a href="#grid-track">Grid Track</a> variable UsedBreadth will be computed.</li>
</ul>
</dd>
</dl>
<dl>
<dt>
- <dfn id="function-DistributeSpaceToTracks-algorithm">Algorithm</dfn>
+ <dfn id="function-ComputeUsedBreadthOfGridTracks-algorithm">Algorithm</dfn>
</dt>
<dd>
<code>
<ol>
- <li>Sort RecipientTracks by t.MaxBreadth - Accumulator( t ) ascending (where t is an element in the RecipientTrack set).</li>
- <li>For i = 0 to RecipientTracks.length - 1
+ <li>Initialize per <a href="#grid-track">Grid Track</a> variables
<ol>
- <li>t = RecipientTracks[i]</li>
- <li>share = Min ((SpaceToDistribute / ( RecipientTracks.length - i )), (t.MaxBreadth - Accumulator (t)))</li>
- <li>t.TempBreadth = Accumulator( t ) + share</li>
- <li>SpaceToDistribute -= share</li>
+ <li>For each <a href="#grid-track">Grid Track</a> t in GridTracks
+ <ol>
+ <li>If t.MinTrackSizingFunction is a percentage or length, then t.UsedBreadth = resolved length</li>
+ <li>If t.MinTrackSizingFunction is min-content, max-content, or a fraction, then t.UsedBreadth = 0</li>
+ <li>If t.MaxTrackSizingFunction is percentage or length, then t.MaxBreadth = resolved length
+ <ol>
+ <li>If the resolved length of the MaxTrackSizingFunction is less than the MinTrackSizingFunction, t.MaxBreadth = t.UsedBreadth.</li>
+ </ol>
+ </li>
+ <li>If t.MaxTrackSizingFunction is min-content, or max-content, then t.MaxBreadth = Infinity</li>
+ <li>If t.MaxTrackSizingFunction is a fraction, then t.MaxBreadth = t.UsedBreadth</li>
+ <li>t.SpanGroupInWhichMaxBreadthWasMadeFinite = null</li>
+ </ol>
+ </li>
</ol>
</li>
- <li>If SpaceToDistribute > 0 and IgnoreMaxBreadth = true
+ <li>Resolve content-based TrackSizingFunctions
<ol>
- <li>For i = 0 to RecipientTracks.length - 1
+ <li>Call ResolveContentBasedTrackSizingFunctions, with arguments:
+ <ul>
+ <li>GridItems: All <a href="#grid-item">Grid Item</a>s.</li>
+ </ul>
+ </li>
+ </ol>
+ </li>
+ <li>Grow all <a href="#grid-track">Grid Track</a>s in GridTracks from their UsedBreadth up to their MaxBreadth value until RemainingSpace is exhausted.
+ <ol>
+ <li>If RemainingSpace == defined
<ol>
- <li>t = RecipientTracks[i]</li>
- <li>share = SpaceToDistribute / ( RecipientTracks.length - i )</li>
- <li>t.TempBreadth += share</li>
- <li>SpaceToDistribute -= share</li>
+ <li>Iterate over all GridTracks and assign UsedBreadth to UpdatedTrackBreadth</li>
+ <li>Call DistributeSpaceToTracks, with arguments:
+ <ul>
+ <li>SpaceToDistribute: RemainingSpace</li>
+ <li>TrackGrowthConstraint: A function which given a <a href="#grid-track">Grid Track</a> returns its MaxBreadth.</li>
+ <li>TracksForGrowth: All <a href="#grid-track">Grid Track</a>s</li>
+ <li>SubsetOfTracksForGrowthBeyondTrackGrowthConstraint: The empty set.</li>
+ <li>CurrentBreadth: A function which given a <a href="#grid-track">Grid Track</a> returns the UsedBreadth.</li>
+ </ul>
+ </li>
+ <li>Iterate over all GridTracks and assign UpdatedTrackBreadth to UsedBreadth</li>
+ </ol>
+ </li>
+ <li>Else
+ <ol>
+ <li>For each <a href="#grid-track">Grid Track</a> t in GridTracks
+ <ol>
+ <li>t.UsedBreadth = t.MaxBreadth</li>
+ </ol>
+ </li>
</ol>
</li>
</ol>
</li>
- <li>For each <a href="#grid-track">Grid Track</a> t in GridTracks, t.UpdatedTrackBreadth = Max( t.UpdatedTrackBreadth, t.TempBreadth)</li>
+ <li>Grow all <a href="#grid-track">Grid Track</a>s having a fraction as the MaxTrackSizingFunction
+ <ol>
+ <li>normalizedFractionBreadth = 0
+ <li>If RemainingSpace == defined
+ <ol>
+ <li>normalizedFractionBreadth = Call ComputeNormalizedFractionBreadth, with arguments:
+ <ul>
+ <li>GridTracks: GridTracks</li>
+ <li>SpaceToFill: AvailableSpace</li>
+ </ul>
+ </li>
+ </ol>
+ </li>
+ <li>Else
+ <ol>
+ <li>For each <a href="#grid-track">Grid Track</a> t in GridTracks having a fraction as the MaxTrackSizingFunction
+ <ol>
+ <li>normalizedFractionBreadth = Max( normalizedFractionBreadth, t.UsedBreadth / t.MaxTrackSizingFunction.FractionValue )
+ </li>
+ </ol>
+ </li>
+ <li>For each <a href="#grid-item">Grid Item</a> i, which crosses a set of GridTracks s
+ <ol>
+ <li>itemNormalizedFractionBreadth = Call ComputeNormalizedFractionBreadth, with arguments:
+ <ul>
+ <li>GridTracks: s</li>
+ <li>SpaceToFill: max-content size of i</li>
+ </ul>
+ </li>
+ <li>normalizedFractionBreadth = Max( normalizedFractionBreadth, itemNormalizedFractionBreadth )
+ </li>
+ </ol>
+ </li>
+ </ol>
+ </li>
+ <li>For each <a href="#grid-track">Grid Track</a> t in GridTracks
+ <ol>
+ <li>t.UsedBreadth = Max( t.UsedBreadth, normalizedFractionBreadth * t.MaxTrackSizingFunction.FractionValue )</li>
+ </ol>
+ </li>
+
+ </ol>
+ </li>
</ol>
</code>
</dd>
</dl>
</dd>
- <!--End Function Definition: DistributeSpaceToTracks-->
+ <!--End Function Definition: ComputeUsedBreadthOfGridTracks-->
</dl>
- <dl>
+ <dl>
<dt>
- <dfn id="function-DistributeSpaceToTracksBySpanCount">DistributeSpaceToTracksBySpanCount</dfn>
+ <dfn id="function-ResolveContentBasedTrackSizingFunctions">ResolveContentBasedTrackSizingFunctions</dfn>
</dt>
<dd>
<p>
- This function prioritizes the distribution of space driven by <a href="#grid-item">Grid Item</a>s in content-sized <a href="#grid-track">Grid Track</a>s by the <a href="#grid-item">Grid Item</a>'s SpanCount. That is, <a href="#grid-item">Grid Item</a>s having a
- lower SpanCount have an opportunity to increase the size of the <a href="#grid-track">Grid Track</a>s they cover before those with larger SpanCounts.
- </p>
- <p>
- The rationale for grouping <a href="#grid-item">Grid Item</a>s by SpanCount, is that when one <a href="#grid-item">Grid Item</a> having a smaller SpanCount is completely covered by another <a href="#grid-item">Grid Item</a> with a larger SpanCount,
- that the <a href="#grid-item">Grid Item</a> with the larger SpanCount won't prematurely grow all its content-sized <a href="#grid-track">Grid Track</a>s, as it could be the case that the <a href="#grid-item">Grid Item</a> with a smaller SpanCount
- would have grown its subset of <a href="#grid-track">Grid Track</a>s enough to satisfy both <a href="#grid-item">Grid Item</a>s. That is, this approach produces tighter Grid layouts.
- </p>
- <p>
- The approach in the pseudocode below is to group <a href="#grid-item">Grid Item</a>s having the same SpanCount, and then call DistributeSpaceToTracks for each <a href="#grid-item">Grid Item</a> in the
- group to determine how much each <a href="#grid-item">Grid Item</a> needs to grow the <a href="#grid-track">Grid Track</a>s that it covers. The maximum contribution made by any <a href="#grid-item">Grid Item</a> is accumulated into a temporary per <a href="#grid-track">Grid Track</a> variable,
- and at the end of the band, the space is recorded into a final <a href="#grid-track">Grid Track</a> variable as determined by the Accumulator function.
+ The purpose of this function is to resolve the contribution that each <a href="#grid-item">Grid Item</a> makes to any min-content or max-content TrackSizingFunctions for the <a href="#grid-track">Grid Track</a>s it covers. There are four permutations: min-content or max-content in either the MinTrackSizingFunction or MaxTrackSizingFunction. MinTrackSizingFunctions are resolved before MaxTrackSizingFunctions, and min-content contributions are resolved before max-content contributions. Note that when resolving min-content contributions they may grow tracks that have either min-content or max-content keywords, as seen in 3.a.i and 3.b.i below.
</p>
<p class="issue">
- <a href="#grid-item">Grid Item</a>s having a SpanCount > 1 can cause undesirable growth in content-sized <a href="#grid-track">Grid Track</a>s. In general authors want content-sized
- <a href="#grid-track">Grid Track</a>s to stay "tight" around their content, but accomodating a spanning <a href="#grid-item">Grid Item</a> might make it seem like that principle is lost for <a href="#grid-item">Grid Item</a>s
- contained completely within a single <a href="#grid-track">Grid Track</a>. Currently, popular scenarios where growth due to a spanning <a href="#grid-item">Grid Item</a> is unwanted typically involves the spanning
- <a href="#grid-item">Grid Item</a> crossing a fraction-sized <a href="#grid-track">Grid Track</a>. For that reason, when this function is called, <a href="#grid-item">Grid Item</a>s having a SpanCount > 1 that cross a fraction-sized <a href="#grid-track">Grid Track</a> are excluded
- from the GridItems argument. Perhaps a better solution would be to allow authors some control over whether a <a href="#grid-item">Grid Item</a> should be considered when growing content-sized <a href="#grid-track">Grid Track</a>s?
- </p>
+ Currently this algorithm embodies several heuristics which regulate the growth of spanning <a href="#grid-item">Grid Item</a>s to accomodate certain use cases. (E.g. the game example in Figures 2 and 3 above.) These heuristics should be a normative part of this specification to ensure interoperability. To the extent additional use cases can be identified that cannot be satisfied by following the current heuristics, the normative algorithm can be updated, or additional mechanisms can be introduced for fine-grained control of content-based TrackSizingFunction.
+ </p>
<dl>
<dt>
- <dfn id="function-DistributeSpaceToTracksBySpanCount-inputs">Inputs</dfn>
+ <dfn id="function-ResolveContentBasedTrackSizingFunctions-inputs">Inputs</dfn>
</dt>
<dd>
<ul>
- <li>GridItems: The set of <a href="#grid-item">Grid Item</a>s which will contribute to the Growth of <a href="#grid-track">Grid Track</a>s.</li>
- <li>ItemTargetSize: A function which returns one of min-content or max-content for the <a href="#grid-item">Grid Item</a> depending on when this function is called.</li>
- <li>Accumulator: A function which returns the variable used to accumulate the results of the UpdatedTrackBreadth from DistributeSpaceToTracks given a <a href="#grid-track">Grid Track</a>.</li>
+ <li>GridItems: The set of <a href="#grid-item">Grid Item</a>s for which min-content or max-content keywords should be resolved.</li>
</ul>
</dd>
</dl>
<dl>
<dt>
- <dfn id="function-DistributeSpaceToTracksBySpanCount-algorithm">Algorithm</dfn>
+ <dfn id="function-ResolveContentBasedTrackSizingFunctions-algorithm">Algorithm</dfn>
</dt>
<dd>
<code>
<ol>
- <li>Sort <a href="#grid-item">Grid Item</a>s in ascending order by SpanCount</li>
- <li>For each group of <a href="#grid-item">Grid Item</a>s g having the same SpanCount
+ <li>Filter all <a href="#grid-item">Grid Item</a>s into a set g, such that each <a href="#grid-item">Grid Item</a> has either a SpanCount of 1 or does not cross a fraction-sized <a href="#grid-track">Grid Track</a></li>
+ <li>Group all <a href="#grid-item">Grid Item</a>s in set g by their SpanCount ascending</li>
+ <li>For each group of <a href="#grid-item">Grid Item</a>s
<ol>
- <li>For each <a href="#grid-item">Grid Item</a> i in g
+ <li>Resolve content-based MinTrackSizingFunctions
<ol>
- <li>Call DistributeSpaceToTracks, with arguments:
+ <li>Call ResolveContentBasedTrackSizingFunctionsForItems, with arguments:
<ul>
- <li>RecipientTracks: Tracks covered by current <a href="#grid-item">Grid Item</a> i</li>
- <li>SpaceToDistribute: ItemTargetSize( i )</li>
- <li>IgnoreMaxBreadth: true</li>
- <li>Accumulator: Accumulator</li>
+ <li>GridItems: All <a href="#grid-item">Grid Item</a>s in the current group.</li>
+ <li>AdditionalSpaceRequiredByItem: A function which given a <a href="#grid-item">Grid Item</a> returns the min-content size of that <a href="#grid-item">Grid Item</a> less the summed UsedBreadth of all <a href="#grid-track">Grid Track</a>s it covers.</li>
+ <li>TrackGrowthConstraint: A function which given a <a href="#grid-track">Grid Track</a> returns its MaxBreadth.</li>
+ <li>TracksForGrowth: A function which given a <a href="#grid-item">Grid Item</a> returns the set of <a href="#grid-track">Grid Track</a>s covered by that <a href="#grid-item">Grid Item</a> that have a min-content or max-content MinTrackSizingFunction.</li>
+ <li>SubsetOfTracksForGrowthBeyondTrackGrowthContstraint: A function which given a set of <a href="#grid-track">Grid Track</a>s returns the subset of <a href="#grid-track">Grid Track</a>s having a min-content or max-content MaxTrackSizingFunction. If that set is the empty set, return the input set instead.</li>
+ <li>Accumulator: A function which given a <a href="#grid-track">Grid Track</a> returns a reference to its UsedBreadth variable.</li>
+ </ul>
+ </li>
+ <li>Call ResolveContentBasedTrackSizingFunctionsForItems, with arguments:
+ <ul>
+ <li>GridItems: All <a href="#grid-item">Grid Item</a>s in the current group.</li>
+ <li>AdditionalSpaceRequiredByItem: A function which given a <a href="#grid-item">Grid Item</a> returns the max-content size of that <a href="#grid-item">Grid Item</a> less the summed UsedBreadth of all <a href="#grid-track">Grid Track</a>s it covers.</li>
+ <li>TrackGrowthConstraint: A function which given a <a href="#grid-track">Grid Track</a> returns its MaxBreadth.</li>
+ <li>TracksForGrowth: A function which given a <a href="#grid-item">Grid Item</a> returns the set of <a href="#grid-track">Grid Track</a>s covered by that <a href="#grid-item">Grid Item</a> that have a max-content MinTrackSizingFunction.</li>
+ <li>SubsetOfTracksForGrowthBeyondTrackGrowthContstraint: A function which given a set of <a href="#grid-track">Grid Track</a>s returns the subset of <a href="#grid-track">Grid Track</a>s having a max-content MaxTrackSizingFunction. If that set is the empty set, return the input set instead.</li>
+ <li>Accumulator: A function which given a <a href="#grid-track">Grid Track</a> returns a reference to its UsedBreadth variable.</li>
</ul>
</li>
</ol>
</li>
- <li>For each <a href="#grid-track">Grid Track</a> t
+ <li>Resolve content-based MaxTrackSizingFunctions
<ol>
- <li>Accumulator( t ) = Max( Accumulator( t ), t.UpdatedTrackBreadth )</li>
+ <li>Call ResolveContentBasedTrackSizingFunctionsForItems, with arguments:
+ <ul>
+ <li>GridItems: All <a href="#grid-item">Grid Item</a>s in the current group.</li>
+ <li>AdditionalSpaceRequiredByItem: A function which given a <a href="#grid-item">Grid Item</a> returns the min-content size of that <a href="#grid-item">Grid Item</a> less the summed MaxBreadth (unless the MaxBreadth is infinite, in which case use the UsedBreadth) of all <a href="#grid-track">Grid Track</a>s it covers.</li>
+ <li>TrackGrowthConstraint: A function which given a <a href="#grid-track">Grid Track</a> returns its MaxBreadth.</li>
+ <li>TracksForGrowth: A function which given a <a href="#grid-item">Grid Item</a> returns the set of <a href="#grid-track">Grid Track</a>s covered by that <a href="#grid-item">Grid Item</a> that have a min-content or max-content MaxTrackSizingFunction.</li>
+ <li>SubsetOfTracksForGrowthBeyondTrackGrowthContstraint: The identity function.</li>
+ <li>Accumulator: A function which given a <a href="#grid-track">Grid Track</a> returns a reference to its MaxBreadth variable.</li>
+ </ul>
+ </li>
+ <li>Call ResolveContentBasedTrackSizingFunctionsForItems, with arguments:
+ <ul>
+ <li>GridItems: All <a href="#grid-item">Grid Item</a>s in the current group.</li>
+ <li>AdditionalSpaceRequiredByItem: A function which given a <a href="#grid-item">Grid Item</a> returns the max-content size of that <a href="#grid-item">Grid Item</a> less the summed MaxBreadth (unless the MaxBreadth is infinite, in which case use the UsedBreadth) of all <a href="#grid-track">Grid Track</a>s it covers.</li>
+ <li>TrackGrowthConstraint: A function which given a <a href="#grid-track">Grid Track</a> returns infinity if the <a href="#grid-track">Grid Track</a>'s SpanGroupInWhichMaxBreadthWasMadeFinite is equal to the current group; otherwise return the <a href="#grid-track">Grid Track</a>'s MaxBreadth.</li>
+ <li>TracksForGrowth: A function which given a <a href="#grid-item">Grid Item</a> returns the set of <a href="#grid-track">Grid Track</a>s covered by that <a href="#grid-item">Grid Item</a> that have a max-content MaxTrackSizingFunction.</li>
+ <li>SubsetOfTracksForGrowthBeyondTrackGrowthContstraint: The identity function.</li>
+ <li>Accumulator: A function which given a <a href="#grid-track">Grid Track</a> returns a reference to its MaxBreadth variable.</li>
+ </ul>
+ </li>
</ol>
</li>
</ol>
+ </li>
+ <li>For each <a href="#grid-track">Grid Track</a> t from the set of all <a href="#grid-track">Grid Track</a>s
+ <ol>
+ <li>If t.MaxBreadth == infinity then t.MaxBreadth = t.UsedBreadth</li>
+ </ol>
</li>
</ol>
</code>
</dd>
</dl>
</dd>
- <!--End Function Definition: DistributeSpaceToTracksBySpanCount-->
+ <!--End Function Definition: ResolveContentBasedTrackSizingFunctions-->
</dl>
<dl>
<dt>
- <dfn id="function-CalculateNormalizedFractionBreadth">CalculateNormalizedFractionBreadth</dfn>
+ <dfn id="function-ResolveContentBasedTrackSizingFunctionsForItems">ResolveContentBasedTrackSizingFunctionsForItems</dfn>
</dt>
<dd>
- This method computes a '1fr' value, referred to as the NormalizedFractionBreadth, for a set of <a href="#grid-track">Grid Track</a>s. The value computed will ensure that when the NormalizedFractionBreadth is multiplied by the fractions associated with GridTracks, that the UsedBreadths of GridTracks will increase by an amount equal to the maximum of zero and the specified SpaceToFill less the sum of the current UsedBreadths.
- <dl>
- <dt>
- <dfn id="function-CalculateNormalizedFractionBreadth-inputs">Inputs</dfn>
- </dt>
- <dd>
- <ul>
- <li>GridTracks: The set of <a href="#grid-track">Grid Track</a>s whose fraction sizing functions are considered for the purposes of a computing a NormalizedFractionBreadth that will cause GridTracks to fill SpaceToFill.</li>
- <li>SpaceToFill: The space to be filled by GridTracks.</li>
- </ul>
- </dd>
- </dl>
+ <p>
+ The above function, ResolveContentBasedTrackSizingFunctions, groups <a href="#grid-item">Grid Item</a>s based on the number of <a href="#grid-track">Grid Track</a>s each <a href="#grid-item">Grid Item</a> spanned. ResolveContentBasedTrackSizingFunctionsForItems, below, then calls DistributeSpaceToTracks for each <a href="#grid-item">Grid Item</a> in the
+ group to determine how much each <a href="#grid-item">Grid Item</a> needs to grow the <a href="#grid-track">Grid Track</a>s that it covers. The maximum contribution made by any <a href="#grid-item">Grid Item</a> is accumulated into a temporary, per-<a href="#grid-track">Grid Track</a> variable,
+ and at the end of the group, the space is recorded into a final <a href="#grid-track">Grid Track</a> variable as determined by the Accumulator function.
+ </p>
<dl>
<dt>
- <dfn id="function-CalculateNormalizedFractionBreadth-inputs">Returns</dfn>
+ <dfn id="function-ResolveContentBasedTrackSizingFunctionsForItems-inputs">Inputs</dfn>
</dt>
<dd>
<ul>
- <li>The 1fr value required by GridTracks to fill SpaceToFill.</li>
+ <li>GridItems: The set of <a href="#grid-item">Grid Item</a>s which will contribute to the growth of <a href="#grid-track">Grid Track</a>s.</li>
+ <li>AdditionalSpaceRequiredByItem: A function which returns the difference between either the min-content or max-content for the <a href="#grid-item">Grid Item</a> and the space already allocated to the <a href="#grid-track">Grid Track</a>s covered by the <a href="#grid-item">Grid Item</a> in earlier phases of the algorithm.</li>
+ <li>TrackGrowthConstraint: A function which given a <a href="#grid-track">Grid Track</a> returns a value that limits the amount by which it may be grown by the <a href="#grid-item">Grid Item</a>s which cover it.</li>
+ <li>TracksForGrowth: A function which given a <a href="#grid-item">Grid Item</a> identifies the set of <a href="#grid-track">Grid Track</a>s to be grown in this phase of the algorithm.</li>
+ <li>SubsetOfTracksForGrowthBeyondTrackGrowthConstraint: A function which identifies a subset of <a href="#grid-track">Grid Track</a>s from TracksForGrowth that may be grown in this phase of the algorithm after all <a href="#grid-track">Grid Track</a>s in the TracksForGrowth set have already grown to their TrackGrowthConstraint.</li>
+ <li>Accumulator: A function which given a <a href="#grid-track">Grid Track</a> returns the variable used to accumulate the results of the UpdatedTrackBreadth from DistributeSpaceToTracks.</li>
</ul>
</dd>
</dl>
<dl>
<dt>
- <dfn id="function-CalculateNormalizedFractionBreadth-algorithm">Algorithm</dfn>
+ <dfn id="function-ResolveContentBasedTrackSizingFunctionsForItems-algorithm">Algorithm</dfn>
</dt>
<dd>
<code>
<ol>
- <li>allocatedSpace = the sum of the UsedBreadth for each <a href="#grid-track">Grid Track</a> in GridTracks</li>
- <li>fractionTracks = the subset of GridTracks whose MaxTrackSizingFunction is a fraction</li>
- <li>For each <a href="#grid-track">Grid Track</a> t in fractionTracks
+ <li>For each <a href="#grid-track">Grid Track</a> t
<ol>
- <li>t.NormalizedFractionValue = t.UsedBreadth / t.MaxTrackSizingFunction.FractionValue</li>
+ <li>t.UpdatedTrackBreadth = Accumulator( t )</li>
</ol>
</li>
- <li>Sort fractionTracks by their NormalizedFractionValue</li>
- <li>spaceNeededFromFractionTracks = SpaceToFill - allocatedSpace</li>
- <li>currentBandFractionValue = accumulatedFractions = 0</li>
- <li>For each <a href="#grid-track">Grid Track</a> t in fractionTracks
+ <li>For each <a href="#grid-item">Grid Item</a> i in GridItems
<ol>
- <li>If t.NormalizedFractionValue > currentBandFractionBreadth
+ <li>Call DistributeSpaceToTracks, with arguments:
+ <ul>
+ <li>SpaceToDistribute: AdditionalSpaceRequiredByItem( i )</li>
+ <li>TrackGrowthConstraint: TrackGrowthConstraint</li>
+ <li>TracksForGrowth: TracksForGrowth( i )</li>
+ <li>SubsetOfTracksForGrowthBeyondTrackGrowthConstraint: SubsetOfTracksForGrowthBeyondTrackGrowthConstraint( TracksForGrowth( i ) )</li>
+ <li>CurrentBreadth: A function which given a <a href="#grid-track">Grid Track</a> returns the UsedBreadth of the <a href="#grid-track">Grid Track</a> if Accumulator returns infinity; otherwise the value of the Accumulator is returned.</li>
+ </ul>
+ </li>
+ </ol>
+ </li>
+ <li>For each <a href="#grid-track">Grid Track</a> t
+ <ol>
+ <li>If Accumulator( t ) == infinity and t.UpdatedTrackBreadth != infinity
<ol>
- <li>If t.NormalizedFractionValue * accumulatedFractions > spaceNeededFromFractionTracks then break from for loop</li>
- <li>currentBandFractionBreadth = t.NormalizedFractionValue</li>
+ <li>t.SpanGroupInWhichMaxBreadthWasMadeFinite = RecipientTracks</li>
</ol>
</li>
- <li>accumulatedFractions += t.MaxTrackSizingFunction.FractionValue</li>
- <li>spaceNeededFromFractionTracks += t.UsedBreadth</li>
+ <li>Accumulator( t ) = t.UpdatedTrackBreadth</li>
</ol>
</li>
- <li>return spaceNeededFromFractionTracks / accumulatedFractions</li>
</ol>
</code>
</dd>
</dl>
</dd>
- <!--End Function Definition: CalculateNormalizedFractionBreadth-->
+ <!--End Function Definition: ResolveContentBasedTrackSizingFunctionsForItems-->
</dl>
-
+
<dl>
<dt>
- <dfn id="function-ComputeUsedBreadthOfGridTracks">ComputeUsedBreadthOfGridTracks</dfn>
+ <dfn id="function-DistributeSpaceToTracks">DistributeSpaceToTracks</dfn>
</dt>
<dd>
<p>
- This is the core <a href="#grid-track">Grid Track</a> sizing algorithm. It is run for Grid columns and Grid rows. The goal of the function is to ensure:
- </p>
- <ol>
- <li>That each <a href="#grid-track">Grid Track</a> satisfies its MinTrackSizingFunction</li>
- <li>That each <a href="#grid-track">Grid Track</a> grows from the breadth which satisfied its MinTrackSizingFunction to a breadth which satifies its MaxTrackSizingFunction, subject to RemainingSpace.</li>
- </ol>
- <p>
- For the purposes of resolving the breadth that satisfies the MinTrackSizingFunction and MaxTrackSizingFunction, each <a href="#grid-track">Grid Track</a> falls into one of three categories:
- </p>
- <ol>
- <li>A percentage or length value which can be trivially resolved.</li>
- <li>A min-content or max-content value which will be resolved based on the measurements of the <a href="#grid-item">Grid Item</a>s which cover the <a href="#grid-track">Grid Track</a>.</li>
- <li>A fraction value which can only be resolved after determining the RemainingSpace in the <a href="#grid-item">Grid Item</a>'s content box after having considered all contributions from the prior two categories of <a href="#grid-track">Grid Track</a>s.</li>
- </ol>
- <p>
- The breadths which satisfy MinTrackSizingFunctions and MaxTrackSizingFunctions for the first category of <a href="#grid-track">Grid Track</a>s are resolved in step 1 during <a href="#grid-track">Grid Track</a> variable initialization.
- The breadths which satisfy MinTrackSizingFunctions for the second category of content-sized <a href="#grid-track">Grid Track</a>s are resolved in step 2. At the end of step 2, the first goal of this function has been satisfied:
- the UsedBreadth variable of each GridTrack now satisfies its MinTrackSizingFunction.
+ Ensures that for each <a href="#grid-track">Grid Track</a> in RecipientTracks, a value will be computed, UpdatedTrackBreadth, that represents the <a href="#grid-track">Grid Track</a>'s share of SpaceToDistribute.
</p>
<p>
- In step 4, the breadths satisfying the MaxTrackSizingFunctions for content-sized <a href="#grid-track">Grid Track</a>s will be resolved. This happens in a fashion very similar to step 2, but, since the growth between
- the MinTrackSizingFunction and the MaxTrackSizingFunction is subject to RemainingSpace, instead of storing the results of step 4 in the <a href="#grid-track">Grid Track</a> variable UsedBreadth, it will instead be
- stored in MaxBreadth. Step 3 simply ensures that MaxBreadth starts at least as large as UsedBreadth since the max breadth cannot be less than the min.
+ There are two parts to this function. The first for loop in step 2 is giving each <a href="#grid-track">Grid Track</a> an equal share of the space, but without exceeding their TrackGrowthConstraint values.
+ Because there are different MaxBreadths assigned to the different <a href="#grid-track">Grid Track</a>s, the first loop can result in their uneven growth.
</p>
<p>
- In step 5, RemainingSpace is then distributed to each content-sized <a href="#grid-track">Grid Track</a>, but not if doing so would exceed the MaxBreadth computed in step 4.
+ If the first loop completes having grown every <a href="#grid-track">Grid Track</a> to its TrackGrowthConstraint, and there is still SpaceToDistribute, then SubsetOfTracksForGrowthBeyondTrackGrowthConstraint are further grown equally until SpaceToDistribute is exhausted.
</p>
<p>
- Finally in step 6, the third category of fraction-sized <a href="#grid-track">Grid Track</a>s can be resolved using what is now the RemainingSpace having updated the UsedBreadth of each <a href="#grid-track">Grid Track</a> at the end of step 5.
+ Note that <a href="#grid-track">Grid Track</a>s considered by this function may have a TrackGrowthConstraint equal to Infinity, which signals that these tracks have not yet been grown by a <a href="#grid-item">Grid Item</a>. These tracks can therefore be grown without exceeding the TrackGrowthConstraint of the track. By only growing tracks up to their TrackGrowthConstraint value, we can ensure that the grid remains "tight" - that is, that track breadth is as close to the content size of the <a href="#grid-item">Grid Item</a>s inside as possible. Only once all <a href="#grid-track">Grid Track</a>s have a CurrentBreadth equal to a TrackGrowthConstraint do we move to the second for loop and grow tracks further, thereby making the <a href="#grid-element">Grid Element</a> less tight.
</p>
<dl>
<dt>
- <dfn id="function-ComputeUsedBreadthOfGridTracks-inputs">Inputs</dfn>
+ <dfn id="function-DistributeSpaceToTracks-inputs">Inputs</dfn>
</dt>
<dd>
<ul>
- <li>GridTracks: The set of <a href="#grid-track">Grid Track</a>s for which the <a href="#grid-track">Grid Track</a> variable UsedBreadth will be computed.</li>
+ <li>SpaceToDistribute: A length to be distributed among the supplied set of <a href="#grid-track">Grid Track</a>s.</li>
+ <li>TrackGrowthConstraint: A function which given a <a href="#grid-track">Grid Track</a> returns the maximum breadth of the track, unless the track is in the SubsetOfTracksForGrowthBeyoundTrackGrowthConstraint.</li>
+ <li>TracksForGrowth: A set of <a href="#grid-track">Grid Track</a>s to be grown up to their TrackGrowthConstraint while SpaceToDistribute remains.</li>
+ <li>SubsetOfTracksForGrowthBeyondTrackGrowthConstraint: A subset of <a href="#grid-track">Grid Track</a>s from TracksForGrowth that may be grown beyond their TrackGrowthConstraint after all <a href="#grid-track">Grid Track</a>s in the TracksForGrowth set have already grown to their TrackGrowthConstraint if there is remaining SpaceToDistribute.</li>
+ <li>CurrentBreadth: A function which given a <a href="#grid-track">Grid Track</a> returns a value to use as a starting point from which to grow this track.</li>
</ul>
</dd>
</dl>
<dl>
<dt>
- <dfn id="function-ComputeUsedBreadthOfGridTracks-algorithm">Algorithm</dfn>
+ <dfn id="function-DistributeSpaceToTracks-algorithm">Algorithm</dfn>
</dt>
<dd>
<code>
<ol>
- <li>Initialize per <a href="#grid-track">Grid Track</a> variables
+ <li>Sort TracksForGrowth by TrackGrowthConstraint( t ) - CurrentBreadth( t ) ascending (where t is an element in the RecipientTrack set).</li>
+ <li>For i = 0 to TracksForGrowth.length - 1
<ol>
- <li>For each <a href="#grid-track">Grid Track</a> t in GridTracks
- <ol>
- <li>If t.MinTrackSizingFunction is a percentage or length, then t.UsedBreadth = resolved length</li>
- <li>If t.MinTrackSizingFunction is min-content, max-content, or a fraction, then t.UsedBreadth = 0</li>
- <li>If t.MaxTrackSizingFunction is percentage or length, then t.MaxBreadth = resolved length</li>
- </ol>
- </li>
+ <li>t = TracksForGrowth[i]</li>
+ <li>share = Min ((SpaceToDistribute / ( TracksForGrowth.length - i )), (TrackGrowthConstraint( t ) - CurrentBreadth( t )))</li>
+ <li>t.TempBreadth = CurrentBreadth( t ) + share</li>
+ <li>SpaceToDistribute -= share</li>
</ol>
</li>
- <li>Resolve content-based MinTrackSizingFunctions
+ <li>If SpaceToDistribute > 0
<ol>
- <li>Call DistributeSpaceToTracksBySpanCount, with arguments:
- <ul>
- <li>GridItems: All <a href="#grid-item">Grid Item</a>s which cover a <a href="#grid-track">Grid Track</a> having a min-content or max-content MinTrackSizingFunction, and not covering a <a href="#grid-track">Grid Track</a> having any fraction sizing function if the SpanCount of the <a href="#grid-item">Grid Item</a> is greater than one.</li>
- <li>ItemTargetSize: A function which returns the min-content size of a <a href="#grid-item">Grid Item</a></li>
- <li>Accumulator: A function which returns the UsedBreadth variable of a <a href="#grid-track">Grid Track</a></li>
- </ul>
- </li>
- <li>Call DistributeSpaceToTracksBySpanCount, with arguments:
- <ul>
- <li>GridItems: All <a href="#grid-item">Grid Item</a>s which cover a <a href="#grid-track">Grid Track</a> having a max-content MinTrackSizingFunction, and not covering a <a href="#grid-track">Grid Track</a> having any fraction sizing function if the SpanCount of the <a href="#grid-item">Grid Item</a> is greater than one.</li>
- <li>ItemTargetSize: A function which returns the max-content size of a <a href="#grid-item">Grid Item</a></li>
- <li>Accumulator: A function which returns the UsedBreadth variable of a <a href="#grid-track">Grid Track</a></li>
- </ul>
+ <li>Let tracks = SubsetOfTracksForGrowthBeyondTrackGrowthConstraint( TracksForGrowth )</li>
+ <li>For i = 0 to tracks.length - 1
+ <ol>
+ <li>t = tracks[i]</li>
+ <li>share = SpaceToDistribute / ( tracks.length - i )</li>
+ <li>t.TempBreadth += share</li>
+ <li>SpaceToDistribute -= share</li>
+ </ol>
</li>
</ol>
</li>
<li>For each <a href="#grid-track">Grid Track</a> t in GridTracks
<ol>
- <li>If t.MaxBreadth == undefined
+ <li>If t.UpdatedTrackBreadth == infinity
<ol>
- <li>t.MaxBreadth = t.UsedBreadth</li>
+ <li>t.UpdatedTrackBreadth = t.TempBreadth</li>
</ol>
</li>
<li>Else
<ol>
- <li>t.MaxBreadth = Max( t.UsedBreadth, t.MaxBreadth)</li>
+ <li>t.UpdatedTrackBreadth = Max( t.UpdatedTrackBreadth, t.TempBreadth )</li>
</ol>
</li>
</ol>
</li>
- <li>Resolve content-based MaxTrackSizingFunctions
- <ol>
- <li>Call DistributeSpaceToTracksBySpanCount, with arguments:
- <ul>
- <li>GridItems: All <a href="#grid-item">Grid Item</a>s which cover a <a href="#grid-track">Grid Track</a> having a min-content or max-content MaxTrackSizingFunction, and not covering a <a href="#grid-track">Grid Track</a> having any fraction sizing function if the SpanCount of the <a href="#grid-item">Grid Item</a> is greater than one.</li>
- <li>ItemTargetSize: A function which returns the min-content size of a <a href="#grid-item">Grid Item</a></li>
- <li>Accumulator: A function which returns the MaxBreadth variable of a <a href="#grid-track">Grid Track</a></li>
- </ul>
- </li>
- <li>Call DistributeSpaceToTracksBySpanCount, with arguments:
- <ul>
- <li>GridItems: All <a href="#grid-item">Grid Item</a>s which cover a <a href="#grid-track">Grid Track</a> having a max-content MaxTrackSizingFunction, and not covering a <a href="#grid-track">Grid Track</a> having any fraction sizing function if the SpanCount of the <a href="#grid-item">Grid Item</a> is greater than one.</li>
- <li>ItemTargetSize: A function which returns the max-content size of a <a href="#grid-item">Grid Item</a></li>
- <li>Accumulator: A function which returns the MaxBreadth variable of a <a href="#grid-track">Grid Track</a></li>
- </ul>
- </li>
- </ol>
- </li>
- <li>Grow all <a href="#grid-track">Grid Track</a>s in GridTracks from their UsedBreadth up to their MaxBreadth value until RemainingSpace is exhausted.
+ </ol>
+ </code>
+ </dd>
+ </dl>
+ </dd>
+ <!--End Function Definition: DistributeSpaceToTracks-->
+ </dl>
+
+
+
+
+
+ <dl>
+ <dt>
+ <dfn id="function-CalculateNormalizedFractionBreadth">CalculateNormalizedFractionBreadth</dfn>
+ </dt>
+ <dd>
+ This method computes a '1fr' value, referred to as the NormalizedFractionBreadth, for a set of <a href="#grid-track">Grid Track</a>s. The value computed will ensure that when the NormalizedFractionBreadth is multiplied by the fractions associated with GridTracks, that the UsedBreadths of GridTracks will increase by an amount equal to the maximum of zero and the specified SpaceToFill less the sum of the current UsedBreadths.
+ <dl>
+ <dt>
+ <dfn id="function-CalculateNormalizedFractionBreadth-inputs">Inputs</dfn>
+ </dt>
+ <dd>
+ <ul>
+ <li>GridTracks: The set of <a href="#grid-track">Grid Track</a>s whose fraction sizing functions are considered for the purposes of a computing a NormalizedFractionBreadth that will cause GridTracks to fill SpaceToFill.</li>
+ <li>SpaceToFill: The space to be filled by GridTracks.</li>
+ </ul>
+ </dd>
+ </dl>
+ <dl>
+ <dt>
+ <dfn id="function-CalculateNormalizedFractionBreadth-inputs">Returns</dfn>
+ </dt>
+ <dd>
+ <ul>
+ <li>The 1fr value required by GridTracks to fill SpaceToFill.</li>
+ </ul>
+ </dd>
+ </dl>
+ <dl>
+ <dt>
+ <dfn id="function-CalculateNormalizedFractionBreadth-algorithm">Algorithm</dfn>
+ </dt>
+ <dd>
+ <code>
+ <ol>
+ <li>allocatedSpace = the sum of the UsedBreadth for each <a href="#grid-track">Grid Track</a> in GridTracks</li>
+ <li>fractionTracks = the subset of GridTracks whose MaxTrackSizingFunction is a fraction</li>
+ <li>For each <a href="#grid-track">Grid Track</a> t in fractionTracks
<ol>
- <li>If RemainingSpace == defined
- <ol>
- <li>Call DistributeSpaceToTracks, with arguments:
- <ul>
- <li>RecipientTracks: GridTracks</li>
- <li>SpaceToDistribute: RemainingSpace</li>
- <li>IgnoreMaxBreadth: false</li>
- </ul>
- </li>
- <li>Iterate over all GridTracks and assign UpdatedTrackBreadth to UsedBreadth</li>
- </ol>
- </li>
- <li>Else
- <ol>
- <li>For each <a href="#grid-track">Grid Track</a> t in GridTracks
- <ol>
- <li>t.UsedBreadth = t.MaxBreadth</li>
- </ol>
- </li>
- </ol>
- </li>
+ <li>t.NormalizedFractionValue = t.UsedBreadth / t.MaxTrackSizingFunction.FractionValue</li>
</ol>
</li>
- <li>Grow all <a href="#grid-track">Grid Track</a>s having a fraction as the MaxTrackSizingFunction
+ <li>Sort fractionTracks by their NormalizedFractionValue</li>
+ <li>spaceNeededFromFractionTracks = SpaceToFill - allocatedSpace</li>
+ <li>currentBandFractionValue = accumulatedFractions = 0</li>
+ <li>For each <a href="#grid-track">Grid Track</a> t in fractionTracks
<ol>
- <li>normalizedFractionBreadth = 0
- <li>If RemainingSpace == defined
- <ol>
- <li>normalizedFractionBreadth = Call ComputeNormalizedFractionBreadth, with arguments:
- <ul>
- <li>GridTracks: GridTracks</li>
- <li>SpaceToFill: RemainingSpace</li>
- </ul>
- </li>
- </ol>
- </li>
- <li>Else
- <ol>
- <li>For each <a href="#grid-track">Grid Track</a> t in GridTracks having a fraction as the MaxTrackSizingFunction
- <ol>
- <li>normalizedFractionBreadth = Max( normalizedFractionBreadth, t.UsedBreadth / t.MaxTrackSizingFunction.FractionValue )
- </li>
- </ol>
- </li>
- <li>For each <a href="#grid-item">Grid Item</a> i, which crosses a set of GridTracks s
- <ol>
- <li>itemNormalizedFractionBreadth = Call ComputeNormalizedFractionBreadth, with arguments:
- <ul>
- <li>GridTracks: s</li>
- <li>SpaceToFill: max-content size of i less the sum of the UsedBreadths of s</li>
- </ul>
- </li>
- <li>normalizedFractionBreadth = Max( normalizedFractionBreadth, itemNormalizedFractionBreadth )
- </li>
- </ol>
- </li>
- </ol>
- </li>
- <li>For each <a href="#grid-track">Grid Track</a> t in GridTracks
+ <li>If t.NormalizedFractionValue > currentBandFractionBreadth
<ol>
- <li>t.UsedBreadth = Max( t.UsedBreadth, normalizedFractionBreadth * t.MaxTrackSizingFunction.FractionValue )</li>
+ <li>If t.NormalizedFractionValue * accumulatedFractions > spaceNeededFromFractionTracks then break from for loop</li>
+ <li>currentBandFractionBreadth = t.NormalizedFractionValue</li>
</ol>
</li>
-
+ <li>accumulatedFractions += t.MaxTrackSizingFunction.FractionValue</li>
+ <li>spaceNeededFromFractionTracks += t.UsedBreadth</li>
</ol>
</li>
+ <li>return spaceNeededFromFractionTracks / accumulatedFractions</li>
</ol>
</code>
</dd>
</dl>
</dd>
- <!--End Function Definition: ComputeUsedBreadthOfGridTracks-->
+ <!--End Function Definition: CalculateNormalizedFractionBreadth-->
</dl>
- <!--End Section: Definition of Functions for use in Calculating Grid Track Sizes-->
- </div>
-
- <div id="grid-track-sizing-algorithm" class="section">
- <h3><span class="secno">10.3. </span>Grid Track Sizing Algorithm</h3>
- <ol>
- <li>Call ComputedUsedBreadthOfGridTracks for Grid Columns to resolve their logical width.</li>
- <li>Call ComputedUsedBreadthOfGridTracks for Grid Rows to resolve their logical height. The logical width of Grid Columns from the prior step is used in the formatting of <a href="#grid-item">Grid Item</a>s in content-sized Grid Rows to determine their required height.</li>
- <li>If the minimum content size of any <a href="#grid-item">Grid Item</a> has changed based on available height for the <a href="#grid-item">Grid Item</a> as computed in step 2, adjust the min content size of the <a href="#grid-item">Grid Item</a> and restart the <a href="#grid-track">Grid Track</a> Sizing algorithm (once only).</li>
- </ol>
-
+
<!--End Section: Grid Track Sizing Algorithm-->
</div>
+
<!--End Section: Calculating the Size of Grid Tracks-->
</div>
@@ -2171,12 +2245,17 @@
<li>Section 10.2: Updated step 6 in ComputeUsedBreadthOfGridTracks to cover shrink-to-fit Grid Elements</li>
</ul>
<br>
- <ul>Changes made in 2 Februrary 2012 Editor's Draft:
+ <ul>Changes made in 2 February 2012 Editor's Draft:
<li>Section 2.2: Made a minor correction to the markup in Example 1.</li>
<li>Section 7: Specified item placement behavior for undefined grid lines.</li>
<li>Section 7.1: Specified that for the grid-column and grid-row properties, 'start' is only applicable to the starting line position and 'end' is only applicable to the ending line position.</li>
<li>Section 8.1: Updated the spec to better describe the behavior of box model calculations for stretch alignment.</li>
</ul>
+ <br>
+ <ul>Changes made in 6 February 2012 Editor's Draft:
+ <li>Section 10: Combined Sections 10.2 and 10.3, so that the overall algorithm is described in a top-down fashion.</li>
+ <li>Section 10.2: Removed the function DistributeSpaceToTracksBySpanCount, and added new functions ResolveContentBasedTrackSizingFunctions and ResolveContentBasedTrackSizingFunctionsForItems. The updates to the algorithm change the way in which Grid Items that span multiple tracks resolve their min-content and max-content contributions to those tracks such that "tighter" grids are produced.</li>
+ </ul>
</ul>
</ul>
<!--End Section: Changes from previous version-->
@@ -2185,9 +2264,7 @@
<div id="acknowledgements" class="appendix section">
<h2><span class="secno">B. </span>Acknowledgements</h2>
<p>
- This specification is made possible by input from Kathy Kam,
- Chris Jones, Erik Anderson, Peter Salas, Veljko Miljanic, Sylvain Galineau, Rossen Atanassov, Eugene Veselov, and the CSS Working Group members. Thanks to Eliot Graff
- for editorial input.
+ This specification is made possible by input from Erik Anderson, Rossen Atanassov, Arron Eicholz, Sylvain Galineau, John Jansen, Chris Jones, Kathy Kam, Veljko Miljanic, Peter Salas, Christian Stockwell, Eugene Veselov, and the CSS Working Group members. Thanks to Eliot Graff for editorial input.
</p>
<!--End Section: Acknowledgements-->
</div>
Received on Saturday, 11 February 2012 00:38:39 UTC