Skip to content

[RNMobile] Gallery - Tiles component #18130

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
mkevins merged 15 commits into from
Dec 4, 2019
Merged

[RNMobile] Gallery - Tiles component #18130

Changes from 1 commit
Commits
Show all changes
15 commits
Select commit Hold shift + click to select a range
d011a64
Add simple tiles component for gallery
mkevins Oct 28, 2019
ae37276
Refactor tiles to accept props more directly
mkevins Oct 16, 2019
1e7e207
Add groutSpacing prop to tiles
mkevins Oct 23, 2019
19c4e66
Tiles - WIP - debugging layout issue on orientation change
mkevins Oct 28, 2019
2a00b17
Tiles - fix spacing (fence-post issue)
mkevins Oct 28, 2019
778aaf2
Tiles - use width instead of flexBasis to fix rotation glitch
mkevins Oct 28, 2019
4b912ce
Fix lint errors
mkevins Oct 28, 2019
32072bd
Rename groutSpacing prop to spacing in gallery tiles
mkevins Nov 5, 2019
d3e42ed
Extract gallery tiles styles to scss
mkevins Nov 5, 2019
128a9b1
Add explanatory comment to gallery tiles for layout logic
mkevins Nov 5, 2019
900cf6b
Use string interpolation for tile width in tiles
mkevins Nov 12, 2019
448c0a9
Accept style prop in Tiles component
mkevins Nov 12, 2019
2356c4b
Use paddings instead of borders for inter-tile spacing
mkevins Nov 26, 2019
6f2bbb9
Fix scss imports for jest
mkevins Nov 28, 2019
6bcc188
Trigger travis
mkevins Dec 4, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Next Next commit
Add simple tiles component for gallery
  • Loading branch information
@mkevins
mkevins committed Dec 4, 2019
commit d011a6400205454204e0a62504dc358d9e56458e
43 changes: 43 additions & 0 deletions packages/block-library/src/gallery/tiles.native.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
/**
* External dependencies
*/
import { View } from 'react-native';

/**
* WordPress dependencies
*/
import { Children } from '@wordpress/element';

function Tiles( props ) {
const {
tilesProps: {
// align,
columns,
// imageCrop,
},
children,
} = props;

return (
<View
style={ {
flexDirection: 'row',
flexWrap: 'wrap',
} }
>
{ Children.map( children, ( child ) => {
return (
<View
style={ {
flex: 1,
flexBasis: ( ( 1 / columns ) * 100 ) + '%',
} }>
{ child }
</View>
);
} ) }
</View>
);
}

export default Tiles;