slint icon indicating copy to clipboard operation
slint copied to clipboard

Support for data uri (base64) in @image-url

Open learncodingforweb opened this issue 1 year ago • 7 comments

data URI should be supported in @image-url

Image {
  source: @image-url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==");
}
Image {
  source: @image-url("data:image/svg+xml;utf8,<svg width='10' height='10' xmlns='http://www.w3.org/2000/svg'> <circle style='fill:red' cx='5' cy='5' r='5'/> </svg>");
}

Original description

How to show base64 image in slint Image? currently it accepts only image-url as location of image only.

learncodingforweb avatar Mar 21 '24 06:03 learncodingforweb

Thanks for your suggestion. I edited the title and description to make it more actionable as an issue in our issue tracker. To answer the original question: this is not implemented right now.

ogoffart avatar Mar 21 '24 06:03 ogoffart

This should be fairly easy to implement.

In the resolving pass, we can detect such URL and store a ImageReference::EmbeddedData instead of ImageReference::AbsolutePath, around here https://github.com/slint-ui/slint/blob/26c7e085e759e2d7eeac0c55ba78cbcb9c15be5a/internal/compiler/passes/resolving.rs#L401

ogoffart avatar Mar 21 '24 07:03 ogoffart

Image {
  source: @image-url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==");
}

Compiling slint_redis_camera_view v0.1.0 error: failed to run custom build command for slint_redis_camera_view v0.1.0

Caused by: process didn't exit successfully: target/debug/build/slint_redis_camera_view-ffd86284a8902f59/build-script-build (exit status: 101) --- stderr error: Cannot find image file data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg== --> ui/app.slint:24:21 | 24 | source: @image-url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="); | ^

thread 'main' panicked at build.rs:2:42: called Result::unwrap() on an Err value: CompileError(["ui/app.slint:24: Cannot find image file data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="]) note: run with RUST_BACKTRACE=1 environment variable to display a backtrace [Finished running. Exit status: 101]

Cargo.toml

[build-dependencies]
slint-build="1.5"


[dependencies]
slint = "1.5"

learncodingforweb avatar Mar 21 '24 07:03 learncodingforweb

yes of course, this is not yet implemented yet. This is why the issue is tagged as "enhancement" (this is a feature request)

ogoffart avatar Mar 21 '24 07:03 ogoffart

yes of course, this is not yet implemented yet. This is why the issue is tagged as "enhancement" (this is a feature request)

Can i work on this?

akshatvishu avatar Mar 21 '24 14:03 akshatvishu

@akshatvishu , sure, thank you.

ogoffart avatar Mar 21 '24 16:03 ogoffart

@akshatvishu Of course you can work on this :-) Feel free to drop by in chat.slint.dev if you have questions! That usually works faster than raising an issue for everything:-)

hunger avatar Mar 25 '24 14:03 hunger

Any update?

learncodingforweb avatar Feb 20 '25 06:02 learncodingforweb