I am getting the URI of the imagePicker (expo-image-picker @13.3.1), but I can not get the URI in the cached image (react-native-expo-image-cache @4.1.0).
Here is my code snipped for the imagePicker and the return statement:
class SignUpForm extends React.Component {
state = {
name: "",
surname: "",
email: "",
password: "",
image: Asset.fromModule(require("../../assets/avatar_default.png")).uri,
key: 1,
errorMessage: null
}
pickImage = async () => {
const { granted } = await ImagePicker.requestCameraPermissionsAsync()
if (!granted) {
return;
}
let result = await ImagePicker.launchImageLibraryAsync({
mediaTypes: ImagePicker.MediaTypeOptions.All,
allowsEditing: true,
aspect: [1, 1],
quality: 1,
});
if (!result.cancelled) {
console.log(result.uri);
this.setState({image: result.uri});
this.setState({key: this.state.key + 1});
}
};
render() {
const { navigation } = this.props;
return(... <ChachedAvatar
resizeMode="cover"
transitionDuration={900}
tint="dark"
preview={Asset.fromModule(require("../../assets/avatar_default.png")).uri}
uri={this.state.image}
key={this.state.key}
/>
...
)
}
};
The URI works perfectly with the default Image element (<Image source={{ uri: image }}>
).
The output of console.log(result.uri) (this URI does not work) is:
file:///Users/timokurtz/Library/Developer/CoreSimulator/Devices/F3B4F1EA-A039-4D48-BDA2-4158D628F9A1/data/Containers/Data/Application/0C4C55A2-F1B8-4991-AEEC-1FA7545C68FE/Library/Caches/ExponentExperienceData/%2540anonymous%252Fcoresoil-0e17f581-c238-4031-b1f8-cfb662e245e1/ImagePicker/8EAE216A-BA81-434A-A4FA-D1472CAA731E.jpg
The output of console.log(Asset.fromModule(require("../../assets/avatar_default.png")).uri) (this URI works) is:
http://192.168.178.20:19000/assets/assets/avatar_default.png?platform=ios&hash=ebb0aa5f6d1badea222fee12bb599a1e?platform=ios&dev=true&hot=false