@@ -97,16 +97,30 @@ export class TileStyler {
97
97
tile . setStyle ( 'width' , calc ( this . getTileSize ( baseTileWidth , tile . colspan ) ) ) ;
98
98
}
99
99
100
- /** Sets the vertical placement of the tile in the list.
101
- * This method will be implemented by each type of TileStyler.
100
+ /** Calculates the total size taken up by gutters across one axis of a list.
102
101
* @internal
103
102
*/
104
- setRowStyles ( tile : MdGridTile , rowIndex : number , percentWidth : number , gutterWidth : number ) { }
103
+ getGutterSpan ( ) : string {
104
+ return `${ this . _gutterSize } * (${ this . _rowspan } - 1)` ;
105
+ }
105
106
106
- /** Calculates the computed height and returns the correct style property to set.
107
- * This method will be implemented by each type of TileStyler.
107
+ /** Calculates the total size taken up by tiles across one axis of a list.
108
108
* @internal
109
109
*/
110
+ getTileSpan ( tileHeight : string ) : string {
111
+ return `${ this . _rowspan } * ${ this . getTileSize ( tileHeight , 1 ) } ` ;
112
+ }
113
+
114
+ /** Sets the vertical placement of the tile in the list.
115
+ * This method will be implemented by each type of TileStyler.
116
+ * @internal
117
+ */
118
+ setRowStyles ( tile : MdGridTile , rowIndex : number , percentWidth : number , gutterWidth : number ) { }
119
+
120
+ /** Calculates the computed height and returns the correct style property to set.
121
+ * This method will be implemented by each type of TileStyler.
122
+ * @internal
123
+ */
110
124
getComputedHeight ( ) : [ string , string ] { return null ; }
111
125
}
112
126
@@ -132,7 +146,9 @@ export class FixedTileStyler extends TileStyler {
132
146
133
147
/** @internal */
134
148
getComputedHeight ( ) : [ string , string ] {
135
- return [ 'height' , calc ( `${ this . _rowspan } * ${ this . getTileSize ( this . fixedRowHeight , 1 ) } ` ) ] ;
149
+ return [
150
+ 'height' , calc ( `${ this . getTileSpan ( this . fixedRowHeight ) } + ${ this . getGutterSpan ( ) } ` )
151
+ ] ;
136
152
}
137
153
}
138
154
@@ -165,7 +181,7 @@ export class RatioTileStyler extends TileStyler {
165
181
/** @internal */
166
182
getComputedHeight ( ) : [ string , string ] {
167
183
return [
168
- 'paddingBottom' , calc ( `${ this . _rowspan } * ${ this . getTileSize ( this . baseTileHeight , 1 ) } ` )
184
+ 'paddingBottom' , calc ( `${ this . getTileSpan ( this . baseTileHeight ) } + ${ this . getGutterSpan ( ) } ` )
169
185
] ;
170
186
}
171
187
0 commit comments