Adding a Shadow to the Backbase Window Widget

26 April, 2008 - 00:22 — Rus

This is a simple example that shows how to extend a standard "out of box" window widget and implement nice looking shadow. This article contains step-by-step instructions for how to use this 'shadow window' in your own Backbase projects, for both the Chameleon and the System skin. This is a screen capture of the widgets:

windows with shadow

1. Verify Compatibility

These widgets are compatible with Backbase Enterprise Ajax, Client Edition 4.2.0

2. Download and Unpack

First download and unzip the attached file "shadow_window.zip". The download link is at the bottom of this page.

3. Copy the Files

Copy the folder "shadow_window" to the "Backbase_4_2_x/bindings/www.backbase.com.2006.btl" folder

4. Configure the Bindings for both Skins

The zip-file contains changes for both the Chameleon and System skins. If you use only one of these skins, you only have to install the changes to one configuration file.

Changes for the System Skin

Make the following changes to "Backbase_4_2_x/bindings/config.xhtml_btl.system.xml":

...
<namespace name="http://www.backbase.com/2006/btl" xml:base="www.backbase.com.2006.btl/">
...

<uses element="shadow_window" src="shadow_window/system/shadow_window.xml" />

...
</namespace>
...

Changes for the Chameleon Skin

Make the following changes to "Backbase_4_2_x/bindings/config.xhtml_btl.chameleon.xml":

...
<namespace name="http://www.backbase.com/2006/btl" xml:base="www.backbase.com.2006.btl/">
...

<uses element="shadow_window" src="shadow_window/chameleon/shadow_window.xml" />

...
</namespace>
...

5. Test the New Widget

Well now you can try this code as a test case:

...

<b:shadow_window label="shadow_window" style="left: 300px; top: 200px;">

  Window content...

</b:shadow_window>

...

Let me know if it worked for you by leaving a comment below. If it didn't work also leave a comment and we'll try to help you.

Attachment	Size
shadow_window.zip	23.29 KB

Rus's blog
Login or register to post comments

Comments

Window with shadow

29 April, 2008 - 17:25 — rribeiro

I am using this implementation, works very well and gives another appearance to the window.

Congratulations.

graphics issues

6 May, 2008 - 23:56 — fisherman

These shadow forms look great, but unfortunately I encounter a problem, when there is some content inside.
With a listGrid inside the form, filled with data, in IE 7 the cells in the grid turn black when I drag the window. The window title also turns black.

re: graphics issues

12 May, 2008 - 05:01 — jepc

Hi fisherman, have you tried this with the normal Backbase window? Does the same problem occur, or is the problem unique to the shadow window? If unique to shadow window, please open a thread on the discussion forum (http://bdn.backbase.com/forum) and paste your source code in there between <code> tags.

problem with shadow_window

12 May, 2008 - 15:00 — rribeiro

I found another problem when there is a listGrid in form with the data, another cell without content appears near the cell edited. (moved a few pixels to right)

invalid attachment

30 May, 2008 - 14:37 — omar.tello

Hi!

I'm trying to download the attachment shadow_window.zip, but the file is damaged. Can anybody tell me, where I can get the attached file?

Thanks!

Client Framework