haskal
/
jiti-meet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

[RN] Wrap PagedList navigator with SafeAreaView

This commit is contained in:
Bettenbuk Zoltan 2019-03-04 15:49:57 +01:00 committed by Zoltan Bettenbuk
parent ecb44b6ab4
commit 20c1b1cfae
2 changed files with 13 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
react/features/base/react/components/native/PagedList.js
View File

@ -1,7 +1,7 @@
// @flow
import React, { Component } from 'react';
import { Text, TouchableOpacity, View } from 'react-native';
import { SafeAreaView, Text, TouchableOpacity, View } from 'react-native';
import { connect } from 'react-redux';
import { Icon } from '../../../font-icons';
@ -215,13 +215,13 @@ class PagedList extends Component<Props, State> {
{
this._renderPage(pages[pageIndex], disabled)
}
<View style = { styles.pageIndicatorContainer }>
<SafeAreaView style = { styles.pageIndicatorContainer }>
{
pages.map((page, index) => this._renderPageIndicator(
page, index, disabled
))
}
</View>
</SafeAreaView>
</View>
);
}
@ -247,7 +247,7 @@ class PagedList extends Component<Props, State> {
key = { index }
onPress = { this._onSelectPage(index) }
style = { styles.pageIndicator } >
<View style = { styles.pageIndicator }>
<View style = { styles.pageIndicatorContent }>
<Icon
name = { page.icon }
style = { [

13
react/features/base/react/components/native/styles.js
View File

@ -104,9 +104,9 @@ const PAGED_LIST_STYLES = {
*/
pageIndicator: {
alignItems: 'center',
flex: 1,
flexDirection: 'column',
justifyContent: 'center'
justifyContent: 'center',
padding: BoxModel.padding / 2
},
/**
@ -120,10 +120,15 @@ const PAGED_LIST_STYLES = {
* Container for the page indicators (Android).
*/
pageIndicatorContainer: {
alignItems: 'stretch',
alignItems: 'center',
backgroundColor: ColorPalette.blue,
flexDirection: 'row',
height: 56,
justifyContent: 'space-around'
},
pageIndicatorContent: {
alignItems: 'center',
flexDirection: 'column',
justifyContent: 'center'
},