Merge pull request #41 from febobo/develop

optimize listview

android/app/build.gradle

@@ -87,7 +87,7 @@ android {
     buildToolsVersion "23.0.1"
 
     defaultConfig {
-        applicationId "com.feinn"
+        applicationId "com.Feinn"
         minSdkVersion 16
         targetSdkVersion 22
         versionCode 1

ios/FeInn/AppDelegate.m

@@ -31,7 +31,7 @@ - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(
    * on the same Wi-Fi network.
    */
 
-  jsCodeLocation = [NSURL URLWithString:@"http://192.168.1.83:8081/index.ios.bundle?platform=ios&dev=true"];
+  jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
 
   /**
    * OPTION 2

ios/FeInn/Images.xcassets/48.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "filename" : "48.png",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}

ios/FeInn/Images.xcassets/96.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "filename" : "96.png",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}

ios/FeInn/Images.xcassets/AppIcon.appiconset/Contents.json

@@ -1,10 +1,17 @@
 {
   "images" : [
     {
-      "idiom" : "universal",
-      "filename" : "favicon.png",
+      "size" : "72x72",
+      "idiom" : "ipad",
+      "filename" : "[email protected]",
       "scale" : "1x"
     },
+    {
+      "size" : "72x72",
+      "idiom" : "ipad",
+      "filename" : "[email protected]",
+      "scale" : "2x"
+    },
     {
       "idiom" : "universal",
       "filename" : "[email protected]",

ios/FeInn/Images.xcassets/feinn.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "filename" : "feinn.png",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}

ios/FeInn/Images.xcassets/ic_launcher.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "idiom" : "universal",
+      "filename" : "ic_launcher.png",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "version" : 1,
+    "author" : "xcode"
+  }
+}

package.json

@@ -22,6 +22,7 @@
     "react-native-tab-navigator": "^0.3.2",
     "react-native-vector-icons": "^2.0.2",
     "react-native-video": "^0.8.0",
+    "react-native-wechat": "^1.4.6",
     "react-redux": "^4.4.5",
     "redux": "^3.5.2",
     "redux-actions": "^0.10.0",

src/container/tabview.js

@@ -20,7 +20,7 @@ import * as WelfarePage from '../page/Welfare';
 import * as Login from '../page/Login';
 import connectComponent from '../utils/connectComponent';
 import TabNavigator from 'react-native-tab-navigator';
-import iconHome from '../public/favicon.png';
+// import iconHome from '../public/favicon.png';
 const Essence = connectComponent(EssencePage);
 const Article = connectComponent(ArticlePage);
 const Welfare = connectComponent(WelfarePage);

src/page/Article.js

@@ -26,6 +26,13 @@ class Article extends Component {
     this.loadList()
   }
 
+  shouldComponentUpdate(nextProps){
+    if(nextProps.Acticle.photos == this.props.Acticle.photos){
+      return false
+    }
+    return true
+  }
+
   loadList (){
     const { actions , Acticle } = this.props;
     actions.getPhoto({
@@ -54,15 +61,17 @@ class Article extends Component {
 
   render (){
     const { Acticle } = this.props;
+    console.log(Acticle)
     return (
       <View style={[styles.container]}>
-      {
-        Acticle && Acticle.photos && Acticle.photos.length !=0 ?
+
         <ScrollView style={{flex:1}}
           onScroll={this._onScroll}
+          initialListSize={1}
+          pageSize={1}
           refreshControl={
             <RefreshControl
-              refreshing={Acticle.getPhotosIsPending || false}
+              refreshing={Acticle.getPhotosIsPending}
               onRefresh={this._onRefresh}
               tintColor="#ff0000"
               title="Loading..."
@@ -71,7 +80,8 @@ class Article extends Component {
             />
           }
         >
-
+        {
+          Acticle && Acticle.photos && Acticle.photos.length !=0 ?
           <View style={styles.imgsWrap}>
             <View style={styles.imgs}>
               {this._renderImg(Acticle.photos.slice(0,Acticle.photos.length/2))}
@@ -80,11 +90,16 @@ class Article extends Component {
               {this._renderImg(Acticle.photos.slice(Acticle.photos.length/2,Acticle.photos.length))}
             </View>
           </View>
-        </ScrollView> :
-        <View style={{flexDirection:'row',paddingTop:30,alignItems : 'center',justifyContent : 'center'}}>
-          <Text style={{fontSize:20}}>说好的妹子呢</Text>
-        </View>
-      }
+          : null
+
+        }
+        {
+            Acticle && Acticle.getPhotosIsPending == false && Acticle.photos.length == 0 ?
+            <View style={{flexDirection:'row',paddingTop:30,alignItems : 'center',justifyContent : 'center'}}>
+              <Text style={{fontSize:20}}>说好的妹子呢</Text>
+            </View> :null
+        }
+        </ScrollView>
       </View>
     )
   }
@@ -143,6 +158,7 @@ class Article extends Component {
               <Image
                 style={{width:width/2,height:parseInt(Math.random() * (width/4) + (width/2))}}
                 source={{uri : v.url}}
+                defaultSource={require('../public/defaultImg.png')}
               />
             </LightBox>
           </TouchableOpacity>
@@ -155,6 +171,7 @@ const { width , height } = Dimensions.get('window');
 const styles = StyleSheet.create({
   container : {
     flex : 1,
+    paddingBottom : 50
     // alignItems : 'center',
     // justifyContent : 'center',
     // backgroundColor : 'blue'

src/page/Detail.js

@@ -71,6 +71,7 @@ class Detail extends Component {
               <Image
                 style={styles.authorImg}
                 source={{uri : data.author.avatar_url}}
+                defaultSource={require('../public/defaultImg.png')}
               />
             </View>
             <View
@@ -126,6 +127,7 @@ const defaultMaxImageWidth = width - 30 - 20;
 const styles = StyleSheet.create({
   container : {
     flex : 1,
+    paddingBottom:Platform.OS == 'ios' ? 0 : 50,
   },
   wrapStyle : {
     flex : 1,

src/page/Essence.js

@@ -148,6 +148,7 @@ class Essence extends Component {
         <Image
           style={styles.article}
           source={{uri: rowData.author.avatar_url}}
+          defaultSource={require('../public/defaultImg.png')}
         />
         <View
           style={styles.content}

src/page/Login.js

@@ -81,10 +81,12 @@ class Login extends Component {
               <Image
                 style={[styles.userImg]}
                 source={{uri : User.data.avatar_url}}
+                defaultSource={require('../public/defaultImg.png')}
               /> :
               <Image
                 style={[styles.userImg]}
-                source={{uri : 'http://test.imgs.wn518.com/upimages/ys-sales/2016-03-29/87e08bb58a0a9b57bcd035fbf6bb4e02_1_0_0_420_420_1.jpg'}}
+                source={require('../public/defaultImg.png')}
+
               />
             }
           </View>

src/page/Welfare.js

@@ -27,6 +27,13 @@ class Welfare extends Component {
     this.loadList();
   }
 
+  shouldComponentUpdate(nextProps){
+    if(nextProps.Welfare.videos == this.props.Welfare.videos){
+      return false
+    }
+    return true
+  }
+
   loadList (){
     const { actions , Welfare } = this.props;
     actions.getVideo({
@@ -40,6 +47,7 @@ class Welfare extends Component {
   }
 
   _onEndReached (){
+    console.log(1)
     const { actions , Welfare } = this.props;
     actions.getVideo({
       page : Welfare.page+1,
@@ -81,8 +89,8 @@ class Welfare extends Component {
         <ListView
           dataSource={ds.cloneWithRows(Welfare.videos || [])}
           renderRow={this.renderVideoRow}
-          pageSize={3}
-          initialListSize={3}
+          pageSize={1}
+          initialListSize={1}
           onEndReached={this._onEndReached}
           onEndReachedThreshold={0}
           removeClippedSubviews={true}
@@ -114,7 +122,8 @@ const styles = StyleSheet.create({
   videoWrap : {
     padding : 10,
     borderBottomWidth : 1,
-    borderColor : '#eee'
+    borderColor : '#eee',
+    overflow:'hidden'
   },
   userImg : {
     width : userImg,

src/reducers/Acticle.js

@@ -1,7 +1,7 @@
 import * as types from '../actions/actionTypes';
 
 
-export default function Acticle (state={page:1,limit:10,photos:[]} , action={}){
+export default function Acticle (state={page:1,limit:10,photos:[],getPhotosIsPending:true} , action={}){
   const { payload ,error , meta={}} = action;
   const { sequence ={} } = meta;
   switch (action.type) {