github-starred/proton-native

Fork 0

mirror of https://github.com/kusti8/proton-native.git synced 2026-05-15 14:15:50 -06:00

[GH-ISSUE #262] Image component doesn't display images #175

New issue

Open

opened 2026-05-05 11:52:47 -06:00 by gitea-mirror · 6 comments

gitea-mirror commented

2026-05-05 11:52:47 -06:00

Owner

Originally created by @roman01la on GitHub (Jan 31, 2020).
Original GitHub issue: https://github.com/kusti8/proton-native/issues/262

Describe the bug
Specifying any type of a resource (either URL or local file system path) for Image component doesn't display pixel data on a screen.

Node process prints the following

QPixmap::scaled: Pixmap is a null pixmap

To Reproduce

<Image source={{ uri: "https://images.pexels.com/photos/414612/pexels-photo-414612.jpeg" }}
       style={{ width: 100, height: 100 }}/>

Expected behavior
Image component should display loaded pixel data

Versions:

OS: macOS
Version 2.0.0
Node version 10.16.3

Originally created by @roman01la on GitHub (Jan 31, 2020). Original GitHub issue: https://github.com/kusti8/proton-native/issues/262 **Describe the bug** Specifying any type of a resource (either URL or local file system path) for `Image` component doesn't display pixel data on a screen. Node process prints the following ``` QPixmap::scaled: Pixmap is a null pixmap ``` **To Reproduce** ```javascript <Image source={{ uri: "https://images.pexels.com/photos/414612/pexels-photo-414612.jpeg" }} style={{ width: 100, height: 100 }}/> ``` **Expected behavior** `Image` component should display loaded pixel data **Versions:** - OS: macOS - Version 2.0.0 - Node version 10.16.3

gitea-mirror added the

bug

label 2026-05-05 11:52:47 -06:00

gitea-mirror commented

2026-05-05 11:52:50 -06:00

Author

Owner

@roman01la commented on GitHub (Jan 31, 2020):

Looks like the only supported image format out of the box is PNG. JPEG and GIFs are not recognized.

@roman01la commented on GitHub (Jan 31, 2020): Looks like the only supported image format out of the box is PNG. JPEG and GIFs are not recognized.

gitea-mirror commented

2026-05-05 11:52:51 -06:00

Author

Owner

@kusti8 commented on GitHub (Mar 16, 2020):

Your example seems to work for me. I other tried JPGs and GIFs as well. GIF animation doesn't seem to work, but everything else works. Could you post the full code and make sure you don't have any network troubles? Try downloading it and loading it locally.

@kusti8 commented on GitHub (Mar 16, 2020): Your example seems to work for me. I other tried JPGs and GIFs as well. GIF animation doesn't seem to work, but everything else works. Could you post the full code and make sure you don't have any network troubles? Try downloading it and loading it locally.

gitea-mirror commented

2026-05-05 11:52:53 -06:00

Author

Owner

@roman01la commented on GitHub (Mar 16, 2020):

Are you on macOS?

@roman01la commented on GitHub (Mar 16, 2020): Are you on macOS?

gitea-mirror commented

2026-05-05 11:52:58 -06:00

Author

Owner

@kusti8 commented on GitHub (Mar 16, 2020):

I tested on Linux, but I can confirm its an issue on Mac. Seems like I need to include qjpeg with Qt: https://forum.qt.io/topic/1003/jpeg-support/4

@kusti8 commented on GitHub (Mar 16, 2020): I tested on Linux, but I can confirm its an issue on Mac. Seems like I need to include qjpeg with Qt: https://forum.qt.io/topic/1003/jpeg-support/4

gitea-mirror commented

2026-05-05 11:53:00 -06:00

Author

Owner

@roman01la commented on GitHub (Mar 17, 2020):

Yeah, that was exactly my impression, that on macOS only PNGs are supported out of the box.

@roman01la commented on GitHub (Mar 17, 2020): Yeah, that was exactly my impression, that on macOS only PNGs are supported out of the box.

gitea-mirror commented

2026-05-05 11:53:01 -06:00

Author

Owner

@lucphamvan commented on GitHub (Aug 8, 2020):

Hello, this problem occurs with me in Window. Here my code
<App> <Window style={{ height: '720', width: '1024' }} > <Image resizeMode="center" source={{ uri: "https://image.freepik.com/free-vector/abstract-social-media-icons-set_1055-5053.jpg" }} style={{ width: 100, height: 100 }} /> </Window> </App>

I go to node_modules\proton-native\bin\components\image.js => updateProps => source => console.log download data
console.log(out); element.setFromData(out); element.scaleImage(pixSize.width, pixSize.height, pixSize.resizeMode);
And see that data was downloaded
<Buffer ff d8 ff e0 00 10 4a 46 49 46 00 01 01 01 00 60 00 60 00 00 ff fe 00 3b 43 52 45 41 54 4f 52 3a 20 67 64 2d 6a 70 65 67 20 76 31 2e 30 20 28 75 73 69 ... 88699 more bytes> QPixmap::scaled: Pixmap is a null pixmap
But function element.scaleImage(pixSize.width, pixSize.height, pixSize.resizeMode); give exception and not show data

@lucphamvan commented on GitHub (Aug 8, 2020): Hello, this problem occurs with me in Window. Here my code ` <App> <Window style={{ height: '720', width: '1024' }} > <Image resizeMode="center" source={{ uri: "https://image.freepik.com/free-vector/abstract-social-media-icons-set_1055-5053.jpg" }} style={{ width: 100, height: 100 }} /> </Window> </App>` I go to node_modules\proton-native\bin\components\image.js => updateProps => source => console.log download data ` console.log(out); element.setFromData(out); element.scaleImage(pixSize.width, pixSize.height, pixSize.resizeMode);` And see that data was downloaded `<Buffer ff d8 ff e0 00 10 4a 46 49 46 00 01 01 01 00 60 00 60 00 00 ff fe 00 3b 43 52 45 41 54 4f 52 3a 20 67 64 2d 6a 70 65 67 20 76 31 2e 30 20 28 75 73 69 ... 88699 more bytes> QPixmap::scaled: Pixmap is a null pixmap` But function element.scaleImage(pixSize.width, pixSize.height, pixSize.resizeMode); give exception and not show data

gitea-mirror referenced this issue

2026-05-05 11:57:56 -06:00

[PR #175] [MERGED] Fix "save" when hitting cancel #282