오늘 react native로 화면을 구성하는데
1가지 계속 애를 먹었다..
그것은...react-native-paper에서 제공하는 FAB.Group 버튼이다.
예를들면,
<View style={styles.buttonContainer}>
<View style={styles.buttonType}>
<Text>홈</Text>
</View>
<View style={styles.buttonType}>
<Text>생활</Text>
</View>
<View style={styles.buttonType}>
<Text>제테크</Text>
</View>
<Portal>
<FAB.Group
open={this.state.open}
icon={'menu'}
actions={[
{icon: require('../assets/images/menu.png'), label:'Menu', onPress: () => console.log('Pressed add')}
]}
onStateChange={({ open }) => this.setState({ open })}
onPress={() => {this.setState({open: !this.state.open})}}
style={{position: 'absolute', top: 50, left: 0}}
/>
</Portal>
</View>
이렇게 되면 스롤뷰에의해 버튼이 밖으로 밀려나가게 된다.
나는 이 버튼을 아예 화면에 고정하고 싶은데...독학을 하다보니..방법을 잘 모르겠어서 거진 30분을 뒤져본 것 같다...
열심히 구글링 하던 찰나 내 속을 시원하게 긁어주는 글을 찾았다..
바로 position을 absolute로 바꿔주면 된다...왜 이걸 해매고 있었을까....
그래도 오늘 이렇게 또 한가지를 해결 했다!