Merge pull request #15 from fegos/master

同步

.eslintrc

@@ -7,6 +7,9 @@
     "es6": true,
     "jest": true
   },
+  "globals": {
+    "__DEV__": true
+  },
   "rules": {
     "global-require": [1],
     "max-len": [1, { "code": 150 }],

components/common/UIComponent.js

@@ -152,7 +152,6 @@ export default class UIComponent extends Component {
    * 更新this.style，若有必要子类可调用该方法刷新style
    */
   updateStyle(nextProps) {
-    // console.log(this.constructor.name + ': updateStyle')
     this.style = this._getStyle(nextProps);
     return this.style;
   }

components/ui/AnimateModal/index.js

@@ -27,7 +27,11 @@ export default class AnimateModal extends UIComponent {
     animateWhenMount: false,
     springEffect: false,
     onClose: () => { },
-    onAnimationEnd: (visible) => { console.log(visible); },
+    onAnimationEnd: (visible) => {
+      if (__DEV__) {
+        console.log(visible);
+      }
+    },
   }
   static propTypes = {
     // 是否可见

components/ui/Calendar/Header.js

@@ -139,7 +139,6 @@ export default class Header extends Component {
       const yearLabel = `${year}年`;
       const monthValue = month < 10 ? `0${month}` : month;
       const monthLabel = `${month + 1}月`;
-      // console.log('月：  ' + monthLabel);
       data.push({ value: `${year}${monthValue}`, label: `${yearLabel}${monthLabel}` });
       start = new Date(year, month + 1);
     }
@@ -160,10 +159,10 @@ export default class Header extends Component {
         Popup.hide();
       }}
     />, {
-      title: false,
-      location: 'bottom',
-      aniFrom: 'bottom',
-    });
+        title: false,
+        location: 'bottom',
+        aniFrom: 'bottom',
+      });
   }
 
   // 年选择的形式
@@ -193,10 +192,10 @@ export default class Header extends Component {
         Popup.hide();
       }}
     />, {
-      title: false,
-      location: 'bottom',
-      aniFrom: 'bottom',
-    });
+        title: false,
+        location: 'bottom',
+        aniFrom: 'bottom',
+      });
   }
 
 
@@ -244,11 +243,11 @@ export default class Header extends Component {
                 {year}年{months[month]}
               </Text>
             ) : (
-              <TouchableOpacity onPress={this.scanCallback}>
-                <Text style={[styles.title]}>
-                  {year}年{months[month]}
-                </Text>
-              </TouchableOpacity>
+                <TouchableOpacity onPress={this.scanCallback}>
+                  <Text style={[styles.title]}>
+                    {year}年{months[month]}
+                  </Text>
+                </TouchableOpacity>
               )
           }
 

components/ui/Carousel/index.js

@@ -38,8 +38,17 @@ export default class Carousel extends UIComponent {
     showArrows: false,
     leftArrow: '<',
     rightArrow: '>',
-    onShouldChange: (prePage, nextPage) => { console.log(prePage, nextPage); return true; },
-    onChange: (curPage) => { console.log(curPage); },
+    onShouldChange: (prePage, nextPage) => {
+      if (__DEV__) {
+        console.log(prePage, nextPage);
+      }
+      return true;
+    },
+    onChange: (curPage) => {
+      if (__DEV__) {
+        console.log(curPage);
+      }
+    },
     onScrollBeginDrag: () => { },
   }
 
@@ -130,7 +139,7 @@ export default class Carousel extends UIComponent {
   componentWillReceiveProps(nextProps) {
     super.componentWillReceiveProps(nextProps);
     this._updateChildrenCount(nextProps);
-    this._updateActualLoadPageCount(this.props);
+    this._updateActualLoadPageCount(nextProps);
     this._updateLoadPageRegion(nextProps, this.state.curPage);
     this._setTimerIfNeed(nextProps, this.state.curPage);
   }
@@ -203,7 +212,13 @@ export default class Carousel extends UIComponent {
     if (childrenType === 'image') {
       childrenCount = source.length;
     } else {
-      childrenCount = children.length;
+      if (Array.isArray(children)) {
+        childrenCount = children.length;
+      } else if (React.isValidElement(children)) {
+        childrenCount = 1
+      } else {
+        childrenCount = 0;
+      }
     }
     return childrenCount;
   }
@@ -304,13 +319,15 @@ export default class Carousel extends UIComponent {
           endPage = startPage + actualLoadPageCount - 1;
         }
       } else {
-        console.log(`不支持的mode:${mode}`);
+        console.warn(`不支持的mode:${mode}`);
       }
-      this.setState({
-        startPage,
-        endPage,
-      });
     }
+    this.setState({
+      startPage,
+      endPage,
+    }, () => {
+      this._placeCritical(curPage, startPage);
+    });
     this._hasUpdatedDisplayRegion = true;
   }
 
@@ -352,7 +369,7 @@ export default class Carousel extends UIComponent {
     const childrenCount = this._childrenCount;
     const actualLoadPageCount = this._actualLoadPageCount;
     if (targetPage >= childrenCount) {
-      console.log(`目标页超出显示范围！！${targetPage}`);
+      console.warn(`目标页超出显示范围！！${targetPage}`);
       return;
     }
 
@@ -367,6 +384,11 @@ export default class Carousel extends UIComponent {
       this._clearTimer();
     }
 
+    if (childrenCount < 2) {
+      return;
+    }
+
+
     if (mode === 'all') {
       let actualTargetPage = targetPage;
       if (infinite) {
@@ -460,15 +482,14 @@ export default class Carousel extends UIComponent {
    * 通过偏移量计算当前页
    */
   _calculateCurrentPage = (offset) => {
-    const { direction, size } = this.props;
-    const { curPage, startPage } = this.state;
-    const { width, height } = size;
-    const denominator = direction === 'horizontal' ? width : height;
-    const result = offset / denominator;
-    const nextPage = (result % 1) >= 0.5 ? Math.ceil(result) : Math.floor(result);
-    const diff = nextPage + startPage - this._prePage;
-    const newCurPage = curPage + diff;
-    return this._getFixedPageIdx(newCurPage);
+    const { curPage } = this.state;
+    let newCurPage = curPage;
+    if (this._beginOffset > offset && this._beginOffset - offset > windowWidth / 3) {
+      newCurPage -= 1;
+    } else if (this._beginOffset < offset && offset - this._beginOffset > windowWidth / 3) {
+      newCurPage += 1;
+    }
+    return newCurPage;
   }
 
   /**
@@ -516,19 +537,42 @@ export default class Carousel extends UIComponent {
   /**
    * scrollview事件回调
    */
-  _onScrollBeginDrag = () => {
+  _onScrollBeginDrag = (event) => {
+    const { direction } = this.props;
+    const { contentOffset } = event.nativeEvent;
+    this._beginOffset = direction === 'horizontal' ? contentOffset.x : contentOffset.y;
     this._clearTimer();
     this.props.onScrollBeginDrag();
     this._prePage = this.state.curPage;
   }
 
   _onScrollEndDrag = (event) => {
-    const { direction } = this.props;
+    const { direction, infinite } = this.props;
+    const { curPage } = this.state;
     const { contentOffset } = event.nativeEvent;
-    const offset = direction === 'horizontal' ? contentOffset.x : contentOffset.y;
-    const page = this._calculateCurrentPage(offset);
-    this._setTimerIfNeed(this.props, this.state.curPage);
-    this._changeToPage(page, false);
+    let newCurPage = curPage;
+    if (event.nativeEvent) {
+      const { velocity } = event.nativeEvent;
+      const { x: vX } = velocity;
+      if (Math.abs(vX) > 0.1) {
+        if (vX > 0) {
+          newCurPage = curPage + 1;
+        } else {
+          newCurPage = curPage - 1;
+        }
+      } else {
+        const offset = direction === 'horizontal' ? contentOffset.x : contentOffset.y;
+        newCurPage = this._calculateCurrentPage(offset);
+      }
+    }
+    if (!infinite &&
+      ((curPage === this._childrenCount - 1 && newCurPage > curPage) ||
+        (curPage === 0 && newCurPage < 0))) {
+      return;
+    }
+    const fixedPage = this._getFixedPageIdx(newCurPage);
+    this._setTimerIfNeed(this.props, fixedPage);
+    this._changeToPage(fixedPage, false);
   }
 
   /**
@@ -606,21 +650,23 @@ export default class Carousel extends UIComponent {
           const sourceEl = source[fixedIdx];
           if (typeof sourceEl === 'number') {
             page = (
-              <Image key={key} source={sourceEl} style={size} />
+              <Image key={key} resizeMode="stretch" source={sourceEl} style={size} />
             );
           } else {
             page = (
-              <Image key={key} source={{ uri: sourceEl, ...size }} />
+              <Image key={key} resizeMode="stretch" source={{ uri: sourceEl, ...size }} />
             );
           }
         } else {
-          page = children[fixedIdx];
+          if (Array.isArray(children)) {
+            page = children[fixedIdx];
+          } else {
+            page = children;
+          }
         }
       } else {
         page = (
-          <View style={style.noChild}>
-            <Text style={{ color: '#333' }}>您未添加任何轮播内容</Text>
-          </View>
+          <View style={style.noChild} />
         );
       }
       let key = `page${fixedIdx + 100}`;
@@ -716,7 +762,7 @@ export default class Carousel extends UIComponent {
 
     const { style } = this;
     const { curPage } = this.state;
-    const { leftArrow } = this.props;
+    const { leftArrow, infinite } = this.props;
 
     const isText = typeof leftArrow === 'string';
     const leftArrowView = isText ? (
@@ -726,11 +772,16 @@ export default class Carousel extends UIComponent {
       <View style={style.leftArrowContainer}>
         <TouchableOpacity
           style={[style.arrowWrapper, style.leftArrowWrapper]}
-          onPress={() => this._changeToPage(this._getFixedPageIdx(curPage - 1), true, false)}
+          onPress={() => {
+            if (!infinite && curPage === 0) {
+              return;
+            }
+            this._changeToPage(this._getFixedPageIdx(curPage - 1), true, false);
+          }}
         >
           {leftArrowView}
         </TouchableOpacity>
-      </View>
+      </View >
     );
   }
 
@@ -739,9 +790,9 @@ export default class Carousel extends UIComponent {
 
     const { style } = this;
     const { curPage } = this.state;
-    const { rightArrow } = this.props;
+    const { rightArrow, infinite } = this.props;
 
-    const isText = typeof leftArrow === 'string';
+    const isText = typeof rightArrow === 'string';
     const rightArrowView = isText ? (
       <Text style={style.arrowText}>{rightArrow}</Text>
     ) : rightArrow;
@@ -750,11 +801,16 @@ export default class Carousel extends UIComponent {
       <View style={style.rightArrowContainer}>
         <TouchableOpacity
           style={[style.arrowWrapper, style.rightArrowWrapper]}
-          onPress={() => this._changeToPage(this._getFixedPageIdx(curPage + 1), true, true)}
+          onPress={() => {
+            if (!infinite && curPage === childrenCount - 1) {
+              return;
+            }
+            this._changeToPage(this._getFixedPageIdx(curPage + 1), true, true);
+          }}
         >
           {rightArrowView}
         </TouchableOpacity>
-      </View>
+      </View >
     );
   }
 
@@ -780,13 +836,6 @@ export default class Carousel extends UIComponent {
 }
 
 Carousel.baseStyle = {
-  noChild: {
-    width: windowWidth,
-    height: 100,
-    backgroundColor: '#fff',
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
   // 容器
   container: {},
   // 指示点

components/ui/Dialog/TipAgent.js

@@ -31,7 +31,9 @@ export default class TipAgent extends UIComponent {
   }
   render() {
     const { style } = this;
-    const { title, actions, onAnimationEnd } = this.props;
+    const {
+      title, actions, onAnimationEnd, type,
+    } = this.props;
     const setAniEndFn = (endFn) => {
       this.endFn = endFn;
     };
@@ -66,6 +68,7 @@ export default class TipAgent extends UIComponent {
     return (
       <Dialog
         title={title}
+        type={type}
         visible={this.state.visible}
         onClose={() => this.close}
         footer={footer}