madsleejensen / react-native-image-capinsets Goto Github PK

I'm using this package for adding bubble image on chat-style app, embedding it in ListView
It works fine on iOS version, and in Android before scrolling up.
But when I scrolled it up, the images' sizes are changed.
Can you please help me to fix this issue?

Regards.

Looks like this package don't work in the react-native 0.65.

09-14 03:15:21.240 29727 29937 E AndroidRuntime: java.lang.RuntimeException: An error occurred while executing doInBackground()
09-14 03:15:21.240 29727 29937 E AndroidRuntime: at android.os.AsyncTask$3.done(AsyncTask.java:309)
09-14 03:15:21.240 29727 29937 E AndroidRuntime: at java.util.concurrent.FutureTask.finishCompletion(FutureTask.java:354)
09-14 03:15:21.240 29727 29937 E AndroidRuntime: at java.util.concurrent.FutureTask.setException(FutureTask.java:223)
09-14 03:15:21.240 29727 29937 E AndroidRuntime: at java.util.concurrent.FutureTask.run(FutureTask.java:242)
09-14 03:15:21.240 29727 29937 E AndroidRuntime: at android.os.AsyncTask$SerialExecutor$1.run(AsyncTask.java:234)
09-14 03:15:21.240 29727 29937 E AndroidRuntime: at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1113)
09-14 03:15:21.240 29727 29937 E AndroidRuntime: at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:588)
09-14 03:15:21.240 29727 29937 E AndroidRuntime: at java.lang.Thread.run(Thread.java:818)
09-14 03:15:21.240 29727 29937 E AndroidRuntime: Caused by: java.lang.NullPointerException: Attempt to invoke virtual method 'boolean java.lang.String.startsWith(java.lang.String)' on a null object reference
09-14 03:15:21.240 29727 29937 E AndroidRuntime: at dk.madslee.imageCapInsets.utils.RCTImageLoaderTask.doInBackground(RCTImageLoaderTask.java:27)
09-14 03:15:21.240 29727 29937 E AndroidRuntime: at dk.madslee.imageCapInsets.utils.RCTImageLoaderTask.doInBackground(RCTImageLoaderTask.java:12)
09-14 03:15:21.240 29727 29937 E AndroidRuntime: at android.os.AsyncTask$2.call(AsyncTask.java:295)
09-14 03:15:21.240 29727 29937 E AndroidRuntime: at java.util.concurrent.FutureTask.run(FutureTask.java:237)

Hi, I have to manually change the 'compile' to 'implementation' in the build.gradle file every time when I run the npm install command. Is there any solution to fix it? Thanks.

Hi and thank you for your amazing library!

it was unable to use this lib with files like 'file:///data/user/0/com.eofinance/cache/ReactNative-snapshot-image2146683742921663754.png'

So I made a small fix: #18

Please, merge it ASAP, because now it's impossible to use this lib with this one https://github.com/gre/react-native-view-shot

Hello,

Someone know why, when i test with release mode on emulator it will works properly, while, when i upload to google play store, and download the app, in a specific screen with this functionality capinsets, the app will crash...

I have installed the package using the command npm i react-native-image-capsinsets --save however I'm getting an error at import statement saying 'Could not find a declaration file for module 'react-native-image-capinsets'.'. When executing 'npm i --save @types/react-native-image-capinsets' I'm receiving Error 404. I'm using Typescript.

npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/@types%2freact-native-image-capinsets - Not found
npm ERR! 404
npm ERR! 404 '@types/react-native-image-capinsets@*' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

Hello,

When using React Native 0.56 I get this error:

Undefined is not an object (evaluating '_reactNative.Image.resizeMode.stretch')

It looks like usage of Image.resizeMode.stretch enum has been removed in React Native 0.56, replaced by string usage only ("stretch").
Source: facebook/react-native@870775e

Would it be possible to replace the enum with the string for both iOS and Android please?

albemala

Hi - I have an effect to which I am unclear the issue. When building in debug the module works as expected:

however in release build, it looks like this:

the relative code :

render(){
const bubble = StaticIcons.imageForIcon("chat-bubble-light");
const sz = 8;
....
<ImageCapInset
          style={{
            padding: 20
          }}
          source={bubble}
          capInsets={{
            top: sz,
            right: sz,
            bottom: sz,
            left: sz
          }}
        >
          <View>
            <Text>This is a test</Text>
            <Text>This is a test</Text>
            <Text>This is a test</Text>
          </View>
        </ImageCapInset>
....
}

I am unclear how to resolve this issue. Any help is appreciated!

Since cap insets are natively supported on android the implementation on that platform should be more or less straightforward. How about iOS support, what are the options?

Hi, I'm getting the following error in the logs of my react native app when attempting to use this component on Android:

Warning: Native component for "RCTImageCapInset" does not exist

What am I doing wrong?

Thanks,
Nathan

Please, use the manual linking guide:

https://github.com/mayconmesquita/react-native-image-capinsets-next

android

why 9patch lines displayed?

Hello. Did this lib was intend to work like on the iOS? It gives two different results. For iOS it works like RN but for Android it scales images incorrectly.

I'm using:
"react-native": "0.44.0"
"react-native-image-capinsets: "https://github.com/igorczapski/react-native-image-capinsets" - which is modified version for loading already cached files

Original image:

Android image with cap insets:

iOS image with cap insets:

As you can see, on Android - corners and bubble tail not match original image. Any advices? Thanks in advance
MP.

Points at a different project for the same github user, possibly case of copy-paste.

https://github.com/madsleejensen/react-native-image-capinsets/blob/master/package.json#L5

The Android implementation allows adding children which is a great thing I believe.
However the iOS implementation uses Image which simply doesn't allow children.
RN has an ImageBackground implementation by default which also uses Image (so capInsets still available) but also provides using children.

Because of the above I propose to use ImageBackground in ImageCapInsets.ios.js