Stretch row so child items fill container list (#67)

Author: jlo1

src/Row.js

@@ -153,12 +153,16 @@ export default class Row extends Component {
   }
 
   render() {
-    const {children, style} = this.props;
+    const {children, style, horizontal} = this.props;
+    const rowStyle = [
+      style, styles.container, this._animatedLocation.getLayout(),
+      horizontal ? styles.horizontalContainer : styles.verticalContainer,
+    ];
 
     return (
       <Animated.View
         {...this._panResponder.panHandlers}
-        style={[style, styles.container, this._animatedLocation.getLayout()]}
+        style={rowStyle}
         onLayout={this._onLayout}>
         {children}
       </Animated.View>
@@ -231,4 +235,12 @@ const styles = StyleSheet.create({
   container: {
     position: 'absolute',
   },
+  horizontalContainer: {
+    top: 0,
+    bottom: 0,
+  },
+  verticalContainer: {
+    left: 0,
+    right: 0,
+  },
 });

src/SortableList.js

@@ -209,15 +209,6 @@ export default class SortableList extends Component {
     const {horizontal, rowActivationTime, sortingEnabled, renderRow} = this.props;
     const {animated, order, data, activeRowKey, releasedRowKey, rowsLayouts} = this.state;
 
-    let rowHeight = 0;
-    let rowWidth = 0;
-
-    if (rowsLayouts) {
-      Object.keys(rowsLayouts).forEach((key) => {
-        rowHeight = Math.max(rowHeight, rowsLayouts[key].height);
-        rowWidth = Math.max(rowWidth, rowsLayouts[key].width);
-      });
-    }
 
     let nextX = 0;
     let nextY = 0;
@@ -228,11 +219,9 @@ export default class SortableList extends Component {
 
       if (rowsLayouts) {
         if (horizontal) {
-          style.height = rowHeight;
           location.x = nextX;
           nextX += rowsLayouts[key].width;
         } else {
-          style.width = rowWidth;
           location.y = nextY;
           nextY += rowsLayouts[key].height;
         }