Image not showing on device

General
1

Hi,

Image is displayed locally. But can not be displayed on the device. I get following error. I use mac os x and fuse v0.33.1.

<OptionClickPicture ux:Name="picture1" OptionPictureUrl="{picture1}" />

OptionClickPicture

<StackPanel ux:Class="OptionClickPicture">
	<FileSource ux:Property="OptionPictureUrl" />

    <Image File="{Property OptionPictureUrl}" Height="50" Width="50" ContentAlignment="Center" StretchMode="UniformToFill" />

    <ux:Include File="WhilePressed.ux" />
    <Clicked>
        <Callback Handler="{clickedSaveAnswer}" />      
    </Clicked>
</StackPanel>

LOG: InternalError: ImageSource error: 'BundleFileImageSource-failed-conversion': Couldn't open file: assets/images/512x512_l6.png in Fuse.Resources.FileImageSourceImpl</Users/macmini/Library/Application Support/Fusetools/Packages/Fuse.Elements/0.44.2/resources/$.uno:613>
2

You need to add the image-file to your unoproj-file as a Bundle, something like this:

Includes : [
# your existing includes here
"assets/images/512x512_l6.png:Bundle"
]
3

You are very fast! :slight_smile:

Thank you.

4

Did Exactly that and im having an issue that just won’t go away. I set a jpg file for an image, it’s in the bundle for iOS, works on the preview “player” but image won’t show up in iOS there is nothing i can do about it, it juste won’t show. Any Ideas? Also if i set the image source in Javascript and then use it for the source i get the same ‘BundleFileImageSource-failed-conversion’ error no matter what.

Also i guess it’s normal that Fuse renames each image once it’s in Xcode?

Thanks

5

Tried it on Android, Same issue.

6

Do you have a small, isolated test case with your code that replicates your issue so we can take a look at it and help you figure out what’s happening? If you don’t want to post here in the forum you can send us your project via Dropbox as well (ZIP file (and skip the .build folders please)): https://www.dropbox.com/request/ZgndLtJQm5eGzG9cicGK

7

Sent a Zip of the project.

Thanks

8

Looks like some files are missing (the whole components folder is missing, so the file located at components/views/Landing.ux cannot be loaded and therefore the project won’t build). You can use the same Dropbox link again to send an updated ZIP-file for us to take a look at.

9

Hey Marc,

the root cause of your issue turns out to be the excessively large images. You should resize them to be somewhat closer to the actual screen size (do mind density) of the devices you’re targeting.

Since this is a device-dependent limit, there is no one-size-fits-all solution or a hard limit. You will need to figure out what it is for your devices, but a general rule is to try and stay below 3000 px in any direction.

Hope this helps!

10

Hey, Thanks for the update. The problem is, i know for a fact that these images work on iOS and Android Native, my app already exists in these formats and work perfectly. So i would say it’s a hard limit for Fuse or Metal/GL ? Because i don’t think there is a way to know in UX what type of device is running the app, so there is not way to get an image that fits the device that’s running. I can try to make it a big lower than 3000 but it’s still a problem. The app uses a search engine to look up images from the web. I can’t control the size of these images, so that’s a big limitation.

Thanks anyway

11

@Marc Giroux: Sorry for this problem. We have had a plan for dealing with this for a while, but we were waiting for some pending rewrite in this area to land first, which it hasn’t. However, I decided to give it a go, and it seems this was easier than I feared:

https://github.com/kusma/fuselibs-public/commit/879d383c094508b034eae355753231f79a32cfbe

Would it be possible for you to test with this version and see if that works for you?

Instructions on how to use fuse with a checked out fuselibs is here:
https://github.com/fusetools/fuselibs-public/pull/65/files