react-native-scrollable-tab-view
2019-01-28 本文已影响0人
知命者夏洛特
解决在Android中子页面不展示的问题
import { Dimensions, Platform, PixelRatio, StatusBar } from 'react-native';
import ScrollableTabView from 'react-native-scrollable-tab-view';
let ScreenWidth = Dimensions.get('window').width
let ScreenHeight = Dimensions.get('window').height
<ScrollableTabView style={{paddingBottom:10,backgroundColor:'transparent',width:ScreenWidth,height:ScreenHeight}}
tabBarActiveTextColor='#3F81EA'
tabBarInactiveTextColor='#777777'
tabBarTextStyle={{fontSize:16}}
scrollWithoutAnimation={true}
locked={false} //可拖动
tabBarPosition='top'
// ScrollableTabBar={{color:'#F5F5F5'}}
// prerenderingSiblingsNumber={2}
tabBarUnderlineStyle={styles.TabView}
tabBarBackgroundColor='#F5F5F5'
>
<ScrollView tabLabel={this.mineremainingTab} style={styles.textStyle}>
{remainingList.map((item,index)=>{
return <View key={index} style={styles.remainingList}>
<View>
<Text style={styles.item_title}>{item.title}</Text>
<View style={styles.remaining_ctime}>
<Text style={styles.remaining_Item}>{Foundation.convertUTCTimeToLocalTime(item.ctime)}</Text>
</View>
</View>
{item.amount>0?<Text style={styles.item_amount}>{'+'+item.amount}元</Text>:
<Text style={{color:'#15A245',fontSize:16}}>{item.amount}元</Text>}
</View>
})}
</ScrollView>
<ScrollView tabLabel={this.mineincomeTab} style={styles.textStyle}>
{incomeList.map((item,index)=>{
return <View key={index} style={styles.incomeList}>
<View style={styles.incomeList_item}>
<Text style={styles.item_title}>{item.title}</Text>
<Text style={styles.item_amount}>{item.amountPrefix}{item.amount}元</Text>
</View>
<View style={styles.incomeList_utime}>
<View style={styles.incomeList_Ttemu}>
<Text style={styles.remaining_Item}>{Foundation.convertUTCTimeToLocalTime(item.utime)}</Text>
</View>
<Text style={styles.remaining_Item}>{item.statusDesc}</Text>
{/* <Text style={styles.remaining_Item}>{item.isState==0?this.mineisStateOne:item.isState==1?this.mineisStateTwo:item.isState==2?this.mineisStateThree:item.isState==3?this.mineisStateFour:item.isState==4?this.mineisStateFive:null}</Text> */}
</View>
</View>
})}
</ScrollView>
</ScrollableTabView>