I want to add a background image to widgets (CSS background?)

[DanielBraun1]

I'd like to add a background image to 1 or more of the FlexView widgets. Kind of like a water mark. I suspected this would be done with a CSS rule for a background img attribute, but I don't know where to do this.

Can someone please point me in the right direction?

[RobertScheitlin__GISP]

Daniel,

   You actually add it to the widget template skin

Like this:

<!--My Add-->
 <s:Rect id="widgetBack" 
   bottom="0"
   left="0"
   visible.closed="false"
   includeInLayout.closed="false"
   visible.minimized="false"
   includeInLayout.minimized="false"
   width="155"
   height="128"
   alpha="0.6"
   radiusX="5"
   radiusY="5">
  <s:fill>
   <s:BitmapFill source="@Embed('assets/images/widgetBack.png')" smooth="true" />
  </s:fill>
 </s:Rect>
<!--End My Add-->

[DanielBraun1]

Thank you. That makes sense. However, does that mean it will be in all of the widgets based on that template? Is there a way to add a background to just one of the widgets?

[RobertScheitlin__GISP]

Daniel,

   All you would have to do is make a copy of the widgetTemplateSkin and call it something else add the code I provided and then in the widget you want to use that skin just add the skinclass attribute to the WidgetTemplate element.

[HugoDurana]

Daniel,

   All you would have to do is make a copy of the widgetTemplateSkin and call it something else add the code I provided and then in the widget you want to use that skin just add the skinclass attribute to the WidgetTemplate element.

Hi there Robert and Daniel,

Do you guys know where in the Viewer code can i find the WidgetTemplateSkin actually being referenced?

In other words, what i am looking for is something of the sort:
getStyle("skinClass", com.esri.viewer.skins.LetCallThisCustomSkinSkin);

I am still somewhat puzzled with the fact that the WidgetTemplateSkin is somehow magically linked to the host component (but i'm not talking about the HostComponent metadata).

Could you please help me out here?

[HugoDurana]

Hi there again.

Please ignore last post since i should have looked in the default.css file first. That is what you get when you play your moron cards

🙂

Anyway, thank you both for your time.