iced icon indicating copy to clipboard operation
iced copied to clipboard

Is there are any way to programmatically change the opacity of a widget?

Open AzimMuradov opened this issue 3 years ago • 10 comments

I need a way to programmatically change the opacity of an image.

AzimMuradov avatar Jun 14 '21 12:06 AzimMuradov

Depends on what exactly you are asking for. If you want to just take a whole widget and make it have an opacity then no. But if you are just looking for a button with a transparent background they yes absolutely, see the styling example.

13r0ck avatar Jun 14 '21 16:06 13r0ck

Sadly, the first one.

AzimMuradov avatar Jun 14 '21 17:06 AzimMuradov

Is there are any chance to this be implemented in the future releases?

AzimMuradov avatar Jun 14 '21 17:06 AzimMuradov

Oh I'm sure that it will be implemented eventually, but I don't believe that it is even on the roadmap, so I wouldn't expect it anytime soon.

Why do you want this? I am sure there is some way to get a similar effect with what is already a part of iced?

13r0ck avatar Jun 14 '21 17:06 13r0ck

I want to have a welcome screen in my application with my logo on it. I want the logo to appear gradually (gradually increasing the opacity). But I also need that when I click on the screen, the logo appears immediately, without waiting.

Later, I will need the ability to drag images around the screen and ideally they would be semi-transparent while dragging.

AzimMuradov avatar Jun 14 '21 17:06 AzimMuradov

Oh that is going to be tough. Iced doesn't support animations yet, so you would have to manually track and update the opacity too.

Iced has very basic support to stacking widgets, so you would have to place a Container ontop of the image widget (See the Toolltip or Picklist widgets to stack a containers). Then you would have to subscribe to time::every to update the Container style. Performance wouldn't be that great either. Then on click you would set the opacity to the last setting and remove the subscription.

Image dragging would require using the canvas widget. If it is possible at all. I haven't seen anyone build something with an image inside of a canvas though...

13r0ck avatar Jun 14 '21 17:06 13r0ck

Yeah, I already did all code related to subscription, the only thing left is opacity attribute, that I can't find(

AzimMuradov avatar Jun 14 '21 17:06 AzimMuradov

Ya there is no opacity attribute. You will have to overlay a Container above the image that has the same background color as the background behind the logo. Container background colors support alpha values so you can set the background of that to have an opacity, thus giving you the desired effect.

13r0ck avatar Jun 14 '21 18:06 13r0ck

I see, that would probably work for me. Thanks for help!

Although, I still hope that this issue will be added to the milestones.

AzimMuradov avatar Jun 14 '21 18:06 AzimMuradov

Yep. I'm sure it will be once Hecrj sees this issue. He is good at that. He is probably just busy now :smiley:

13r0ck avatar Jun 14 '21 18:06 13r0ck