idibidiart / react-native-responsive-grid

Bringing the Web's Responsive Design to React Native
Other
379 stars 42 forks source link

Errors on Column 'fullWidth' and on vAlign['stretch'] #18

Closed smooJitter closed 6 years ago

smooJitter commented 6 years ago

There appears to be an issue in the source code

   // Column.js
   vAlign: PropTypes.oneOf(['space', 'distribute', 'middle', 'center', 'bottom', 'top']),
   fullWidtht: PropTypes.bool,

perhaps the following is correct,

   // Column.js
   vAlign: PropTypes.oneOf(['space', 'distribute', 'middle', 'center', 'bottom', 'top', 'stretch']),
   fullWidth: PropTypes.bool,
idibidiart commented 6 years ago

No,

vAlign for Column is justifyContent which matches the PropTypes

vAlign on Row is alignItems so that can stretch children vertically!

What you're looking for is hAlign on Column which stretches children horizontally and vAlign on Row which stretches children vertically. If you put Row in Column with those settings you get stretching in both directions. I think I have to add that to the docs.

smooJitter commented 6 years ago

Thank very much.

There's also this typo in Column.js,

fullWidtht: PropTypes.bool,

I have questions about the use of intermediate views.

<Grid>
  <Row> 
     <View>
        <Row>
           <Column>
              ...
           </Column>
        </Row>
         ...
     </View>
  </Row>
</Grid>

Does the intermediate View interupt with the interaction between Rows and Columns?