Untitled
unknown
javascript
2 years ago
10 kB
2
Indexable
<Tabs
onChangeTab={({i, ref}) => {
// alert(i);
// alert(ref.key);
this.setState({currentTab: ref.key});
}}
tabBarUnderlineStyle={styles.tabBarUnderline}
tabContainerStyle={{height: 35}}>
<Tab
initial
// heading="THÔNG TIN"
// activeTabStyle={{backgroundColor: 'white'}}
// tabStyle={styles.tabStylesItem}
// textStyle={{color: '#fff', fontSize: 13}}
// activeTextStyle={{color: 'black', fontSize: 13}}>
heading={
<TabHeading
style={
this.state.currentTab == '.0'
? {backgroundColor: 'white'}
: {
backgroundColor: '#B7B7B7',
borderColor: 'white',
borderWidth: 0.5,
}
}>
<AppText
i18nKey={'info'}
style={
this.state.currentTab == '.0'
? {
color: 'black',
fontSize: this.state.language === 'vi' ? 11 : 10,
}
: {
color: 'white',
fontSize: this.state.language === 'vi' ? 11 : 10,
}
}
/>
</TabHeading>
}>
<View
style={[
styles.tabView,
styles.webViewHolder,
{height: this.state.webViewHeight},
]}>
<WebView
// javaScriptEnabled
// scalesPageToFit={false}
scrollEnabled={false}
// scalesPageToFit={Platform.OS !== 'android'}
style={[
styles.webView,
// Platform.OS !== 'android' ? {width: '170%'} : {},
]}
// style={{ width: windowWidth, height: this.state.height }}
originWhitelist={['*']}
source={{
baseUrl: '',
//html,
// html:
// Platform.OS === 'ios'
// ? `<head>
// <meta name="viewport" content="width=device-width, initial-scale=1">
// </head>
// <body>${html}</body>
// </html>`
// : html,
html: `<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style type="text/css">
body {
font-family: ${fontFamily};
}
</style>
</head>
<body>${html}</body>
</html>`,
}}
ref={ref => {
this.webview = ref;
}}
onNavigationStateChange={this.onNavigationChange.bind(this)}
onShouldStartLoadWithRequest={event => {
if (Platform.OS === 'android') {
this.onShouldStartLoadWithRequest(event);
} else {
return true;
}
}}
onMessage={this.onWebViewMessage}
injectedJavaScript="window.ReactNativeWebView.postMessage(document.body.scrollHeight)"
/>
</View>
</Tab>
{this.state.linkList && this.state.linkList.length > 0 && (
<Tab
// heading="TÀI LIỆU"
// activeTabStyle={{backgroundColor: 'white'}}
// tabStyle={styles.tabStylesItem}
// textStyle={{color: '#fff', fontSize: 13}}
// activeTextStyle={{color: 'black', fontSize: 13}}>
heading={
<TabHeading
style={
this.state.currentTab == '.1'
? {backgroundColor: 'white'}
: {
backgroundColor: '#B7B7B7',
borderColor: 'white',
borderWidth: 0.5,
}
}>
<AppText
i18nKey={'doc'}
style={
this.state.currentTab == '.1'
? {
color: 'black',
fontSize: this.state.language === 'vi' ? 11 : 10,
}
: {
color: 'white',
fontSize: this.state.language === 'vi' ? 11 : 10,
}
}
/>
</TabHeading>
}>
{this._renderLinkList()}
</Tab>
)}
{this.state.colorList && this.state.colorList.length > 0 && (
<Tab
// heading="BỘ PHỐI"
// activeTabStyle={{backgroundColor: 'white'}}
// tabStyle={styles.tabStylesItem}
// textStyle={{color: '#fff', fontSize: 13}}
// activeTextStyle={{color: 'black', fontSize: 13}}>
heading={
<TabHeading
style={
this.state.currentTab == '.2'
? {backgroundColor: 'white'}
: {
backgroundColor: '#B7B7B7',
borderColor: 'white',
borderWidth: 0.5,
}
}>
<AppText
i18nKey={'perspective'}
style={
this.state.currentTab == '.2'
? {
color: 'black',
fontSize: this.state.language === 'vi' ? 11 : 10,
}
: {
color: 'white',
fontSize: this.state.language === 'vi' ? 11 : 10,
}
}
/>
</TabHeading>
}>
{this._renderColorList()}
</Tab>
)}
{this.state.mySliderList && this.state.mySliderList.length > 0 && (
<Tab
// heading="ỨNG DỤNG"
// activeTabStyle={{backgroundColor: 'white'}}
// tabStyle={styles.tabStylesItem}
// textStyle={{color: '#fff', fontSize: 13}}
// activeTextStyle={{color: 'black', fontSize: 13}}>
heading={
<TabHeading
style={
this.state.currentTab == '.3'
? {backgroundColor: 'white'}
: {
backgroundColor: '#B7B7B7',
borderColor: 'white',
borderWidth: 0.5,
}
}>
<AppText
i18nKey={'application'}
style={
this.state.currentTab == '.3'
? {
color: 'black',
fontSize: this.state.language === 'vi' ? 11 : 10,
}
: {
color: 'white',
fontSize: this.state.language === 'vi' ? 11 : 10,
}
}
/>
</TabHeading>
}>
{this._renderApplicationList()}
</Tab>
)}
{this.state.youtubeList && this.state.youtubeList.length > 0 && (
<Tab
// heading="VIDEO"
// activeTabStyle={{backgroundColor: 'white'}}
// tabStyle={styles.tabStylesItem}
// textStyle={{color: '#fff', fontSize: 13}}
// activeTextStyle={{color: 'black', fontSize: 13}}>
heading={
<TabHeading
style={
this.state.currentTab == '.4'
? {backgroundColor: 'white'}
: {
backgroundColor: '#B7B7B7',
borderColor: 'white',
borderWidth: 0.5,
}
}>
<AppText
i18nKey={'video'}
style={
this.state.currentTab == '.4'
? {
color: 'black',
fontSize: this.state.language === 'vi' ? 11 : 10,
}
: {
color: 'white',
fontSize: this.state.language === 'vi' ? 11 : 10,
}
}
/>
</TabHeading>
}>
{this._renderYoutubeList()}
</Tab>
)}
</Tabs>