Shadow Box

How would you do a shadow on just 1 side?

Hi @gaurav_gupta1,

Sorry for the delay... Were you able to add the component to your app?

Thank you very much for your prompt response. I will check.

I'm not sure you can use components in a form (known limitation).

The work around would be to download the app I created, which includes a code generate to create an image for the drop box, rather than use a component.

See original post - and download the app - see below for link screenshot. Let me know if that works. Its not too complicated. Just use the app and follow the instructions in the app.

Hi @R3dKap . Thank you very much for this great tool.

I have just a small question?

I have been trying to add the component inside a form and for some reason I can't copy/paste or insert\component.

Any idea what could be the issue?

Again, thank you very much!

🙂

html base component
1. Shadow box
2. Background Color Change
3.Graident Color, Gradient Direction, Gradient Color Input
4.Border , Border Type, Border Color, Border Width
5.Border Radius with all Separate Corner Value
6.Margin property with all 4 separate view
7.Shadow property with Shadow color , X and Y Value, blur & spread
8.Button - Shadow Box Turn to html Base Button with all Shadow Box Properties
Download Link:-
https://aman-kumar.com/powerapps-shadow-effect/

I am not even close to it. Can you please explain how to add this component in my powerapp?

@R3dKap1 definitely go ahead. The idea of the text input control vs label sounds great, and noticed some other users struggle with that when I was having them try it out. 🙂

That's great @eddiel... Nice job! 😀

If you're ok with it, I can edit my post for the component and add your app to the post, giving you credit for it of course. FYI, I took the liberty of editing your app and just replaced your label that provides the code with a text input that resizes to the same size as the label's: I find it much easier to just click inside the text box, press CTRL-A and then copy/paste the code to the image rather than aiming at the label's starting and ending characters... 😉

Is that ok with you? What do you think?

@R3dKap Thanks for the inspiration. 🙂

I ended up creating the graphical interface you suggested above, but with the choice whether or not to use components. The two approaches implemented were:

Approach 1 -  A Shadow Box Code Generator (for an image control) - A simple Canvas App which provides a user interface to play around with the input values for your approach - with no component required... it then generates the code to be copied and pasted into any image control. The size of the shadow box dynamically resizes based on the image control size.

Approach 2. An updated version of original component, with 2 additional properties:

   i/ "Image" - which directly creates the value for an Image control's image. This still depends on an instance of the component being in the app.

   ii/ "ImageFormulaCode" which generates code that can be copied and pasted into a image without relying on an instance of the component being in the app.

For most scenarios I can think of, I think Approach 1 above works best, because there's no reliance on the developer to understand the inputs in detail or how to use the component or its inputs. They just play around shadow settings using the interface, then copy the code. 

For Approach 2, this would be better perhaps if the values needed to be more dynamically updated (other than height and width, which are already dynamic in Approach 1). However, I had difficulty using a graphical interface to update the component and was not able to get the values to reliably update - which I think is due to a MS bug with components I've seen elsewhere.

Let me know what you think... 🙂