Skip to content

Commit ab84ef1

Browse files
committed
Merge branch 'develop'
2 parents c5a8d14 + aebd236 commit ab84ef1

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

69 files changed

+12177
-0
lines changed

.babelrc

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"presets": ["react-native"]
3+
}

.editorconfig

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
# This file is for unifying the coding style for different editors and IDEs
2+
# editorconfig.org
3+
root = true
4+
5+
[*]
6+
end_of_line = lf
7+
charset = utf-8
8+
trim_trailing_whitespace = false
9+
insert_final_newline = true
10+
indent_style = space
11+
12+
[{*.yml,*.json,*.scss,*.js}]
13+
indent_style = space
14+
indent_size = 2

.eslintrc.js

Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
module.exports = {
2+
extends: [
3+
'airbnb',
4+
'plugin:flowtype/recommended',
5+
'plugin:react/recommended',
6+
'prettier',
7+
'prettier/flowtype',
8+
'prettier/react',
9+
],
10+
plugins: ['flowtype', 'react', 'prettier', 'react-native'],
11+
parserOptions: {
12+
ecmaVersion: 2016,
13+
sourceType: 'module',
14+
ecmaFeatures: {
15+
jsx: true,
16+
},
17+
},
18+
env: {
19+
es6: true,
20+
node: true,
21+
},
22+
rules: {
23+
'comma-dangle': 0,
24+
'consistent-return': 1,
25+
'global-require': 0,
26+
'import/extensions': [2, 'never'],
27+
'import/no-extraneous-dependencies': 'off',
28+
'import/no-unresolved': [2, { ignore: ['@'] }],
29+
'import/prefer-default-export': 'off',
30+
'import/no-named-as-default-member': 'off',
31+
'no-case-declarations': 1,
32+
'no-confusing-arrow': 0,
33+
'no-console': 0,
34+
'no-param-reassign': 0,
35+
'no-return-assign': 1,
36+
'no-shadow': 1,
37+
'no-underscore-dangle': 0,
38+
'no-use-before-define': 0,
39+
'padded-blocks': 0,
40+
'quote-props': 1,
41+
quotes: ['error', 'single'],
42+
'react-native/no-unused-styles': 1,
43+
'react-native/split-platform-components': 1,
44+
'react/jsx-filename-extension': 0,
45+
'react/no-array-index-key': 0,
46+
'react/forbid-prop-types': [0, { forbid: ['any', 'array'] }],
47+
'react/jsx-no-bind': 1,
48+
'react/no-multi-comp': 1,
49+
'react/prefer-stateless-function': 1,
50+
'react/display-name': 0,
51+
'react/prefer-stateless-function': 'off',
52+
},
53+
globals: {
54+
it: false,
55+
describe: false,
56+
expect: false,
57+
},
58+
};

.gitattributes

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
*.pbxproj -text

.gitignore

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
# OSX
2+
#
3+
.DS_Store
4+
5+
# Xcode
6+
#
7+
build/
8+
*.pbxuser
9+
!default.pbxuser
10+
*.mode1v3
11+
!default.mode1v3
12+
*.mode2v3
13+
!default.mode2v3
14+
*.perspectivev3
15+
!default.perspectivev3
16+
xcuserdata
17+
*.xccheckout
18+
*.moved-aside
19+
DerivedData
20+
*.hmap
21+
*.ipa
22+
*.xcuserstate
23+
project.xcworkspace
24+
25+
# Android/IntelliJ
26+
#
27+
build/
28+
.idea
29+
.gradle
30+
local.properties
31+
*.iml
32+
33+
# node.js
34+
#
35+
node_modules/
36+
npm-debug.log
37+
yarn-error.log
38+
39+
# BUCK
40+
buck-out/
41+
\.buckd/
42+
*.keystore

.npmignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
example/

.prettierrc

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"singleQuote": true
3+
}

.travis.yml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
language: node_js
2+
node_js:
3+
- "8"

README.md

Lines changed: 86 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,86 @@
1+
# :godmode: Grid list component
2+
3+
<p align="left">
4+
<a href="https://npmjs.org/package/react-native-grid-list"><img alt="npm version" src="http://img.shields.io/npm/v/react-native-grid-list.svg"></a>
5+
<a href="https://npmjs.org/package/react-native-grid-list"><img alt="npm version" src="http://img.shields.io/npm/dm/react-native-grid-list.svg"></a>
6+
<img alt="npm version" src="https://travis-ci.org/gusgard/react-native-grid-list.svg?branch=master">
7+
</p>
8+
9+
![Demo](./demo.gif)
10+
11+
## Installation
12+
13+
```
14+
yarn add react-native-grid-list
15+
```
16+
17+
or
18+
19+
```
20+
npm install react-native-grid-list --save
21+
```
22+
23+
## Example
24+
25+
```js
26+
import React, { Component } from 'react';
27+
import { StyleSheet, Image } from 'react-native';
28+
29+
import GridList from 'react-native-grid-list';
30+
31+
const items = [
32+
{ thumbnail: { uri: 'https://lorempixel.com/200/200/animals' } },
33+
{ thumbnail: { uri: 'https://lorempixel.com/200/200/city' } },
34+
{ thumbnail: { uri: 'https://lorempixel.com/200/200/nature' } },
35+
{ thumbnail: { uri: 'https://lorempixel.com/200/200/cats' } },
36+
];
37+
38+
export default class App extends PureComponent {
39+
renderItem = ({ item, index }) => (
40+
<Image style={styles.image} source={item.thumbnail} />
41+
);
42+
43+
render() {
44+
return (
45+
<View style={styles.container}>
46+
<ListGrid
47+
showSeparator
48+
data={items}
49+
numColumns={3}
50+
renderItem={this.renderItem}
51+
/>
52+
</View>
53+
);
54+
}
55+
}
56+
57+
const styles = StyleSheet.create({
58+
container: {
59+
flex: 1,
60+
backgroundColor: 'white',
61+
},
62+
image: {
63+
width: '100%',
64+
height: '100%',
65+
borderRadius: 10,
66+
},
67+
});
68+
```
69+
70+
### Expo
71+
72+
[Example QR](https://snack.expo.io/girdList)
73+
74+
## Props
75+
76+
| Prop | Default | Type | Description |
77+
| :------------ | :--------: | :-------------: | :----------------------------------------- |
78+
| numColumns | 3 | `number` | Number of elements in a row |
79+
| data | _required_ | `array` | Data used when render items |
80+
| renderItem | _required_ | `func` | Function that render each item of the grid |
81+
| itemStyle | {} | `ViewPropTypes` | Style for the wrapper of item |
82+
| showSeparator | false | `bool` | Show a separator between items |
83+
84+
## Author
85+
86+
Gustavo Gard

demo.gif

2.87 MB
Loading

0 commit comments

Comments
 (0)