I want to the change user profile pic, when user log into the system. User avator in left side corner in the Material Tab navigator. When user log in to the system I store the image url in AsyncStorage as profilePic.
I want to access AsyncStorage and get the profile pic here.
<Image
source={{
uri:
'https://cdn.apparelconnects.com/users_2_a34456c8-6d69-4b80-98f2-d184ff9f504d_img.png',
}}
I try to many ways. but I can not do this. Here I attached my code. Anyone know the access AsyncStorage here, please help me..
const TabNavigator = createMaterialTopTabNavigator(
{
Profile: {
screen: Logout,
navigationOptions: {
title: 'Home',
tabBarIcon: ({tintColor}) => (
<Image
source={{
uri:
'https://cdn.apparelconnects.com/users_2_a34456c8-6d69-4b80-98f2-d184ff9f504d_img.png',
}}
style={{
width: tabBarConfiguration.icon_size,
height: tabBarConfiguration.icon_size,
borderRadius: 40 / 2,
overflow: 'hidden',
borderWidth: tintColor == colors.orange ? 2 : 0,
borderColor: tintColor,
}}
/>
),
},
},
Home: {
screen: Home,
navigationOptions: {
title: 'Home',
tabBarIcon: ({tintColor}) => (
<Image
source={require('../asserts/images/home_icon.png')}
style={{
width: tabBarConfiguration.icon_size,
height: tabBarConfiguration.icon_size,
tintColor: tintColor,
}}
/>
),
},
},
{
initialRouteName: 'Home',
activeColor: '#f0edf6',
inactiveColor: '#3e2465',
barStyle: {backgroundColor: '#694fad'},
tabBarPosition: 'top',
swipeEnabled: true,
lazy: true,
tabBarOptions: {
showIcon: true,
showLabel: false,
activeTintColor: colors.orange,
inactiveTintColor: '#a1a1a1',
style: {
backgroundColor: '#ffffff',
height: hp('10%'),
},
labelStyle: {
textAlign: 'center',
fontWeight: 'bold',
},
indicatorStyle: {
backgroundColor: 'transparent',
},
},
defaultNavigationOptions: ({navigation}) => ({
tabBarOnPress: ({navigation, defaultHandler}) => {
if (
navigation.state.routeName === 'Profile' ||
navigation.state.routeName === 'More'
) {
return null;
}
defaultHandler();
},
}),
},
);
export default createAppContainer(TabNavigator);