background - wpf gradient brush that spans multiple elements -

background - wpf gradient brush that spans multiple elements -

suppose there element irregular shape composed of other elements arbitrary nesting:

<window.resources> <radialgradientbrush x:key="brush"> <gradientstop color="black" offset="0" /> <gradientstop color="white" offset="1" /> </radialgradientbrush> </window.resources> <stackpanel name="element"> <stackpanel.effect> <dropshadoweffect shadowdepth="0" blurradius="10" /> </stackpanel.effect> <rectangle name="child1" height="100" margin="10" stroke="black" fill="{staticresource brush}" /> <grid> <rectangle name="child2" height="100" margin="10" stroke="black" fill="{staticresource brush}" /> </grid> </stackpanel>

all parts interactive (i.e kid can real control).

how can fill backgrounds of children single radial gradient spans of them (should if sized element).

update: stackpanel has shadow should drawn around children.

one possible solution generate gradients radius , origin/center bound element's , child's properties appropriate conversions, such approach rather complex , expensive.

finally, went transformed gradients route except instead of bindings , converters able elegantly solve creating background transformation in arrangeoverride of kid elements , exposing via dependency property. actual radialgradientbrush binds transform backgroundtransform searching ancestor matching type.

this assumes 1 can modify/wrap kid classes true in case. can made more flexible attached properties , bit more work.

actual code in this gist.

wpf background gradient radial-gradients