Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Local images in Image tags only appear after a hotfix #280

Open
ZetDude opened this issue Apr 8, 2020 · 2 comments
Open

Local images in Image tags only appear after a hotfix #280

ZetDude opened this issue Apr 8, 2020 · 2 comments
Labels

Comments

@ZetDude
Copy link

ZetDude commented Apr 8, 2020

Describe the bug
When putting a relative path into the uri field of an Image tag's source property, the image will not display, however it will take the correct amount of "space" given in the width and height of its style property.

Such an issue doesn't occur when loading from an external URL, the image appears immediately

To Reproduce
Minimal example:

import React, {Component} from 'react';
import {
  App,
  Window,
  Image,
} from 'proton-native';

export default class Example extends Component {
  render() {
    return (
      <App>
        <Window>
          <Image
            style={{
              width: 64,
              height: 64,
            }}
            source={{uri: "./img/next.png"}}>
          </Image>
        </Window>
      </App>
    );
  }
}

Run with npm run dev and then modify the source uri to something like img/next.png in the case of this example. When saving that change, it should automatically apply a hotfix which makes the image actually appear

Expected behavior
The image loads from the relative path immediately

Screenshots
Capture1
Capture2

Versions:

  • OS: Windows 10
  • Version 2.0.4
  • Node version 6.13.4

Additional context
Possibly related to #262

@ZetDude ZetDude added the bug label Apr 8, 2020
@jabza
Copy link

jabza commented Jul 27, 2020

Seeing this also on 2.0.4

@spit4520
Copy link

spit4520 commented Nov 1, 2020

I have a similar issue, I am unable to use local image assets without receiving the following error:

Warning: Failed prop type: Invalid prop sourceof typestringsupplied toImage, expected object.

I have tried importing my assets at the top like so:

import Test from '../assets/images/testing.png'; const Test2 = require('../assets/images/secondTest.png');

I have used these implementations:
<Image source={Test} style={{height: 50, width: 50}}/>

<Image source={{uri: Test2}} style={{height: 50, width: 50}}/>

<Image source={{uri: "../assets/images/testing.png" style={{height:50, width:50}}/>

None of the above work. They all throw the exact same issue.

My current version of proton is: 2.0.4
I installed it through the proton-cli npx package.

I would really like to use this for my companies embedded solution in our factories, so I am hoping to get some basic issues resolved. Is there any better documentation on the native layer? I will need to use native libraries in SPI and other lower languages to build better high level components for our uses.

Thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants