diff --git a/CHANGELOG.md b/CHANGELOG.md index efb5d2d..57cc75f 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,13 @@ +## [0.0.6] (2023-10-16) + +#### Improvements + +- Added support for local images using `require` + +#### Changes + +- Updated documentation. + ## [0.0.5] (2023-10-16) #### Bug Fixes @@ -39,6 +49,7 @@ - Initial release. +[0.0.6]: https://github.com/xerdnu/react-native-blasted-image/compare/v0.0.5...v0.0.6 [0.0.5]: https://github.com/xerdnu/react-native-blasted-image/compare/v0.0.4...v0.0.5 [0.0.4]: https://github.com/xerdnu/react-native-blasted-image/compare/v0.0.3...v0.0.4 [0.0.3]: https://github.com/xerdnu/react-native-blasted-image/compare/v0.0.2...v0.0.3 diff --git a/README.md b/README.md index 37d7c69..50fe1b1 100644 --- a/README.md +++ b/README.md @@ -10,7 +10,7 @@ Caching has always been a challenge for me with the Image component in React Nat ## Features -- **Performance**: Bypasses the React Native Image component for immediate and lightning-fast image display. +- **Performance**: Bypasses the React Native Image component for remote images, ensuring immediate and lightning-fast display. - **Cross-Platform**: Works on both Android (with [Glide](https://github.com/bumptech/glide)) and iOS (with [SDWebImage](https://github.com/SDWebImage/SDWebImage)) - **Customizable**: Wrapped within a `View` for added layout and style customization. - **Robust Caching**: Benefits from both memory and disk caching for maximum performance. @@ -34,8 +34,18 @@ Here's a simple example to get you started: ```jsx import BlastedImage from 'react-native-blasted-image'; +// Remote image + +// Local image +` | Preloads images from an array of URIs. | +| `BlastedImage.preload()` | `Array<{ uri: string }>` | Preloads remote images from an array of URIs. | | `BlastedImage.clearDiskCache()` | - | Clears the disk cache for all images. | | `BlastedImage.clearMemoryCache()`| - | Clears the memory cache for all images. | | `BlastedImage.clearAllCaches()` | - | Clears both disk and memory caches for all images. | @@ -84,7 +94,7 @@ useEffect(() => { ``` | Event | Description | |---------------------------------|-------------------------------------------------------------------| -| `BlastedEventLoaded` | Triggered when images are successfully loaded. | +| `BlastedEventLoaded` | Triggered when remote images are successfully loaded. | | `BlastedEventClearedMemory` | Triggered when the memory cache for all images is cleared. | | `BlastedEventClearedDisk`| Triggered when the disk cache for all images is cleared. | | `BlastedEventClearedAll` | Triggered when both disk and memory caches for all images are cleared. | diff --git a/index.js b/index.js index 63bb616..0bff9fd 100644 --- a/index.js +++ b/index.js @@ -27,12 +27,20 @@ const BlastedImageView = requireNativeComponent('BlastedImageView'); const BlastedImage = ({ source, width, height, style, resizeMode }) => { const [error, setError] = useState(false); - if (!source || !source.uri) { - console.log("Source not specified correctly -> "); + if (!source || (!source.uri && typeof source !== 'number')) { + if (!source) { + console.error("Source not specified for BlastedImage."); + } else { + console.error("Source should be either a URI or a local image using "); + } return null; } useEffect(() => { + if (typeof source === 'number') { + return; + } + const fetchImage = async () => { try { await loadImage(source.uri, source.headers); @@ -83,6 +91,8 @@ const BlastedImage = ({ source, width, height, style, resizeMode }) => { {error ? ( + ) : (typeof source === 'number') ? ( + ) : (