didam

app/config/debugConfig.js

+export default {
+    useFixtures: false,
+    ezLogin: false,
+    yellowBox: __DEV__,
+    reduxLogging: __DEV__,
+    includeExamples: __DEV__,
+    useReactotron: __DEV__
+}  
\ No newline at end of file

app/config/reactotronConfig.js

+import Config from './debugConfig'
+// import Immutable from 'seamless-immutable'
+import Reactotron from 'reactotron-react-native'
+// import { reactotronRedux as reduxPlugin } from 'reactotron-redux'
+// import sagaPlugin from 'reactotron-redux-saga'
+
+if (Config.useReactotron) {
+  // https://github.com/infinitered/reactotron for more options!
+  Reactotron
+    .configure({ host: '10.3.4.91' })
+    //.configure({ name: 'MP', host: '192.168.100.18' })
+    //.configure({ name: "MP Auto", host: '10.10.2.94'})
+    .useReactNative()
+    // .use(reduxPlugin({ onRestore: Immutable }))
+    // .use(sagaPlugin())
+    .connect()
+
+  // Let's clear Reactotron on every time we load the app
+  Reactotron.clear()
+
+  // Totally hacky, but this allows you to not both importing reactotron-react-native
+  // on every file.  This is just DEV mode, so no big deal.
+  // T1gaD4ya321
+  console.tron = Reactotron
+}
\ No newline at end of file

app/container/home/homepageScreen.js

@@ -17,7 +17,8 @@ class HomePageScreen extends Component {
   constructor(props) {
     super(props)
     this.state = {
-      data: ['Penerimaan', 'Appraisal', 'Approval']
+      data: ['Penerimaan', 'Appraisal', 'Approval'],
+      dataNews: [Images.news1, Images.news2, Images.news3]
     }
   }
 
@@ -91,6 +92,7 @@ class HomePageScreen extends Component {
                     ref={(scrollView) => { this.scrollView2 = scrollView; }}
                     pagingEnabled={true}
                     horizontal={true}
+                    style={{backgroundColor:'#f8f8f8'}}
                     decelerationRate={0}
                     snapToInterval={width - 60}
                     snapToAlignment={"center"}
@@ -100,11 +102,29 @@ class HomePageScreen extends Component {
                         bottom: 0,
                         right: 30,
                     }}>
-                    {this.state.data.map((item, index) => {
+                    {this.state.dataNews.map((item, index) => {
                         return (
-                            <View style={[styles.view2, { marginLeft: 20, marginRight: index == this.state.data.length - 1 ? 20 : 0 }]} >
-                                <Image source={Images.background2} style={{ resizeMode: 'stretch', height: '100%', width: '100%', borderRadius: 10 }} />
+                            <View style={styles.view2, {padding: 10, backgroundColor:'transparent', elevation: 5, marginLeft: index == 0? 15 : 0, marginRight: index == this.state.dataNews.length - 1? 15 : 0}}>
+                              <View style={{width:'100%', backgroundColor:'rgba(240, 240, 240, .8)', borderTopLeftRadius: 10, borderTopRightRadius: 10}}>
+                                <Text style={{marginVertical: 5, marginLeft: 20}}>News Feed</Text>
+                              </View>
+                              {/* <View style={{}}> */}
+                                <ImageBackground source={item} imageStyle={{borderBottomLeftRadius: 10, borderBottomRightRadius: 10}} style={{width: Dimensions.get('window').width - 100, height: 175}}>
+                                  <View style={{width: '100%', height: '100%', backgroundColor:'rgba(240, 240, 240, .3)', justifyContent: 'center', alignItems:'center'}}>
+                                    <Text numberOfLines={1} ellipsizeMode={'tail'}> Ini Judul </Text>
+                                    <Text numberOfLines={1} ellipsizeMode={'tail'}> Ini Judul </Text>
+                                    <Text numberOfLines={1} ellipsizeMode={'tail'}> Ini Judul </Text>
+                                  </View>
+                                </ImageBackground>
+                              {/* </View> */}
+                              
                             </View>
+                            // <ImageBackground source={item} resizeMode={'stretch'} resizeMethod={'auto'} imageStyle={{borderRadius: 10}} style={styles.view2} >
+                            //     {/* <Image  style={{ resizeMode: 'stretch', height: '100%', width: '100%', borderRadius: 10 }} /> */}
+                            //     <View style={{width:'100%', backgroundColor:'rgba(240, 240, 240, .8)', borderTopLeftRadius: 10, borderTopRightRadius: 10}}>
+                            //         <Text style={{marginVertical: 5, marginLeft: 20}}>News Feed</Text>
+                            //     </View>
+                            // </ImageBackground>
                         )
                     })}
                 </ScrollView>
@@ -131,14 +151,14 @@ class HomePageScreen extends Component {
 const styles = StyleSheet.create({
   view2: {
     marginVertical: 10,
-    backgroundColor: '#f1edf9',
+    // backgroundColor: 'red',
     width: Dimensions.get('window').width - 100,
     margin: 10,
     height: 175,
     borderRadius: 10,
-    justifyContent: 'center',
-    alignItems: 'center',
-    elevation: 3
+    // justifyContent: 'center',
+    // alignItems: 'center',
+    // elevation: 10,
   },
 })
 

app/library/images.js

@@ -13,12 +13,16 @@ const Images = {
     copper: require('../assets/dummyNotif/copper.jpeg'),
     joro: require('../assets/dummyNotif/joro.jpeg'),
     kagatau: require('../assets/dummyNotif/kagatau.jpg'),
+    news1: require('../assets/news1.jpg'),
+    news2: require('../assets/news2.jpg'),
+    news3: require('../assets/news3.jpg'),
 
     //ICONS
     IconAppraisal: require('../assets/Icon/IconAppraisal.png'),
     IconApproval: require('../assets/Icon/IconApproval.png'),
     IconPenerimaan: require('../assets/Icon/IconPenerimaan.png'),
     LogoApps: require('../assets/Icon/LogoApps.png'),
+    logoAdira: require('../assets/logoAdira.jpg'),
     MenuHistory1: require('../assets/Icon/MenuHistory–1.png'),
     MenuHistory: require('../assets/Icon/MenuHistory.png'),
     MenuHome1: require('../assets/Icon/MenuHome–1.png'),

app/loginNew.js

@@ -54,7 +54,7 @@ class LoginScreen extends Component {
     return (
         <ImageBackground source={Images.background1} style={{flex: 1, width: null, height: null, justifyContent:'center'}} resizeMode={'stretch'} resizeMethod={'auto'}>
             <View style={{height: '50%', alignItems:'center', justifyContent: 'flex-end',}}>
-                <Image source={Images.LogoApps} style={{marginBottom: 65, width: 125, height: 125}}/>
+                <Image source={Images.logoAdira} style={{marginBottom: 65, width: 240, height: 80}}/>
             </View>
             <TouchableOpacity onPress={Keyboard.dismiss} activeOpacity={.9} style={{paddingHorizontal: 50, paddingTop: 35, height: '50%'}}>
                 <View style={{borderRadius: 25, paddingHorizontal: 20, alignItems:'center', flexDirection:'row', width: '100%', backgroundColor:'rgba(237, 237, 237, .5)', }}>
@@ -69,7 +69,7 @@ class LoginScreen extends Component {
                         style={{marginLeft: 10, width: '80%', color: '#fff'}}
                     />
                 </View>
-                <View style={{marginTop: 20, marginBottom: 75, borderRadius: 25, paddingHorizontal: 20, alignItems:'center', flexDirection:'row', width: '100%', backgroundColor:'rgba(237, 237, 237, .5)', }}>
+                <View style={{marginTop: 20, marginBottom: 50, borderRadius: 25, paddingHorizontal: 20, alignItems:'center', flexDirection:'row', width: '100%', backgroundColor:'rgba(237, 237, 237, .5)', }}>
                     <Fontisto name={'locked'} color={'white'} size={18} />
                     <TextInput
                         ref={(ref) => { this.password = ref; }}
@@ -90,6 +90,7 @@ class LoginScreen extends Component {
                     progress
                     backgroundDarker={'#e3b91f'} 
                     backgroundShadow={'#e3c143'}
+                    height={50}
                     borderColor={Colors.blackBasic}
                     backgroundColor={'#e4b300'} 
                     backgroundProgress={'#ffef85'} 

app/splashScreen.js

@@ -39,7 +39,7 @@ class SplashScreen extends Component {
       }
       this.config5 = {
         duration: 2000,
-        toValue: width * .31,
+        toValue: width * .11,
         easing: Easing.inOut(Easing.ease),
       };
       
@@ -84,11 +84,11 @@ class SplashScreen extends Component {
             {/* </View> */}
           {/* </LinearGradient> */}
           <Animated.View style={{transform: [{ translateY: this._transX, translateX: this._transY}]}}>
-            <Image source={Images.LogoApps} style={{width: 150, height: 150}}/>
+            <Image source={Images.logoAdira} style={{width: 300, height: 100}}/>
           </Animated.View>
-          {this.state.text && <View style={{position:'absolute', zIndex: 1, padding: 0, backgroundColor: 'transparent', top: height * .525, left: width * .31}}>
+          {/* {this.state.text && <View style={{position:'absolute', zIndex: 1, padding: 0, backgroundColor: 'transparent', top: height * .525, left: width * .31}}>
             <Text style={{fontStyle: 'italic', color: '#fff', fontSize: 20, marginTop: 10, marginLeft: 2}}> Adira Appraisal</Text>
-          </View>}
+          </View>} */}
           {/* <Animated.View style={[styles.box, { transform: [{ translateY: this._transX, translateX: this._transY}] }]} /> */}
       </Container>
     );

index.js

 /**
  * @format
  */
+if(__DEV__) {
+    import('./app/config/reactotronConfig').then(() => console.log('Reactotron Configured'))
+}
 
 import {AppRegistry} from 'react-native';
 import App from './app/App';