closed
Public

Opacity for image elements is a bit confusing.

For the built in images, you can change the opacity and it will change the image “background”. For imported images, the opacity slider has no effect.

If the image has no alpha channel, the slider could:

A) change the opacity to the whole image

B) change the opacity of a selectable color in the image

4 answers

Actually the opacity slider is shared by all elements, the original purpose is to change the background transparency. For image element, we plan to provide more options in the “Image Dock”.

Have you noticed the “Image Dock”? You can click the “Image Dock” button on the top right corner to show it. It manage all used images, when you double click an image, you can tweak it, and you can see a “gray scale” option to make a grayscale image. I think we can put more options for image processing here.

#1

Yes, I have used the Image Dock (you have to use it to import your own image).

If the opacity function is meant for the element background, would it make sense to be able to select a background color in the imported image, that the opacity slider could then affect?

(To clarify: I mean the imported images that are placed on the page like all the other elements, not the ones that just stay in the Image Dock).

For example, this image clearly has a white background. But if you try to place it on a non-white page and change the image opacity, nothing happens.

#2

You can use image dock to import image, but you don’t have to;-), since you can import image from the flat tool pane, in the “image” line, you can find a button with a magnifier icon, you can click it to show the image import menu, the last item is “From Image File…”.

BTW, I’d like to share a secret with you :-), you can drag the image in the image dock to the page! Here is an example: http://www.foreui.com/blog/wp-content…

I think you want to specify the background color for the non-transparent image, then you can tune its transparency. It is a good idea, but also a little complex to implement. I am considering if we can dig out the background of image (of course user need to specify the background color), then user can tweak it like other elements.

#3

Thanks for sharing. 🙂

That’s interesting, I haven’t noticed the “image” element in the list until now. So you can just place an image directly into the page and then import the contents.

Back to the topic, yes, specifying the background for non-transparent images and then tweaking it is probably the most useful thing to do with the opacity slider. You are right, it takes some processing to add an alpha-channel. Then again, many images out there are non-transparent, so this would add good functionality. But whether you decide to add it or not, that only depends on when you are willing/able to allocate the manpower needed for that.

#4

This question is now closed