How can I open a modal/ Actionsheet by clicking on a bottom tab of tab-based application using wix react native navigation v2?
Currently, I am using the following package and version :
- react-native : "0.59.8"
- react : "16.8.3"
- react-native-navigation : "^2.13.2"
- react-native-image-crop-picker: "^0.24.1"
Here is my route/ navigation file
Promise.all([
Foundation.getImageSource("home", 40),
FontAwesome5.getImageSource("user",30),
Feather.getImageSource("camera",25),
]).then(sources => {
Navigation.setRoot({
root: {
sideMenu: {
center: {
bottomTabs: {
options: {
bottomTabs: {
backgroundColor: 'white',
titleDisplayMode: 'alwaysHide'
},
},
children: [
{
stack: {
children: [{
component: {
name: 'HomeScreen',
passProps: {
text: 'This is tab 1'
}
}
}],
options: {
bottomTab: {
testID: 'HOME_TAB',
icon: sources[0],
},
topBar: {
title: {
text: 'MyReactApp',
}
}
}
}
},
{
component: {
name: 'Camera',
passProps: {
text: 'This is tab 2'
},
options: {
bottomTab: {
testID: 'CAMERA_TAB',
icon: sources[2]
}
}
}
},
{
stack: {
children: [{
component: {
name: 'ProfileScreen',
passProps: {
text: 'Profile Screen'
}
}
}],
options: {
bottomTab: {
testID: 'PROFILE_TAB',
icon: sources[1],
},
topBar: {
title: {
text: 'John Doe',
}
}
}
}
}
]
},
},
},
}
});
});
All I want is that when a user clicks on camera
tab it should open a modal/actionsheet which will show options whether he should select an image from camera roll or should open the camera. For that, I want to use react-native-image-crop-picker
. But how can I achieve that or how can I customize button tab press actions?
I have looked on google but didn't find anything other then these links which didn't help me much
https://github.com/wix/react-native-navigation/issues/3238