Add scrollViewBackgroundColor props

bamlab · Feb 4, 2018 · c9b5e6d · c9b5e6d
1 parent 72e2806
commit c9b5e6d
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/README.md b/README.md
@@ -76,6 +76,7 @@ The `HeaderImageScrollView` handle also the following props. None is required :
 | Property | Type | Default | Description |
 | -------- | ---- | ------- | ----------- |
 | `ScrollViewComponent` | `Component` | `ScrollView` | The component to be used for scrolling. Can be any component with an `onScroll` props (ie. `ListView`, `FlatList`, `SectionList` or `ScrollView`) |
+| `scrollViewBackgroundColor` | `string` | `white` | Background color of the scrollView content |
 
 
 ### TriggeringView

diff --git a/src/ImageHeaderScrollView.js b/src/ImageHeaderScrollView.js
@@ -27,6 +27,7 @@ export type Props = ScrollViewProps & {
   renderHeader: () => React$Element<any>,
   renderTouchableFixedForeground?: ?() => React$Element<any>,
   ScrollViewComponent: React$ComponentType<ScrollViewProps>,
+  scrollViewBackgroundColor: string,
 };
 
 export type DefaultProps = {
@@ -40,6 +41,7 @@ export type DefaultProps = {
   renderFixedForeground: () => React$Element<any>,
   renderHeader: () => React$Element<any>,
   ScrollViewComponent: React$ComponentType<ScrollViewProps>,
+  scrollViewBackgroundColor: string,
 };
 
 export type State = {
@@ -65,6 +67,7 @@ class ImageHeaderScrollView extends Component<Props, State> {
     renderFixedForeground: () => <View />,
     renderHeader: () => <View />,
     ScrollViewComponent: ScrollView,
+    scrollViewBackgroundColor: 'white',
   };
 
   constructor(props: Props) {
@@ -206,6 +209,7 @@ class ImageHeaderScrollView extends Component<Props, State> {
       contentContainerStyle,
       onScroll,
       ScrollViewComponent,
+      scrollViewBackgroundColor,
       ...scrollViewProps
     } = this.props;
     /* eslint-enable no-unused-vars */
@@ -214,7 +218,13 @@ class ImageHeaderScrollView extends Component<Props, State> {
 
     return (
       <View
-        style={[styles.container, { paddingTop: minHeight }]}
+        style={[
+          styles.container,
+          {
+            paddingTop: minHeight,
+            backgroundColor: scrollViewBackgroundColor,
+          },
+        ]}
         ref={ref => (this.container = ref)}
         onLayout={this.onContainerLayout}
       >
@@ -226,7 +236,7 @@ class ImageHeaderScrollView extends Component<Props, State> {
           {...scrollViewProps}
           contentContainerStyle={[
             {
-              backgroundColor: 'white',
+              backgroundColor: scrollViewBackgroundColor,
               marginTop: inset,
               paddingBottom: inset,
             },