Live demo

RoundedBox uses three main rendering methods which will be demonstrated below. Don't be scared by "..." in code samples - no important attributes are hidden from you. The dots only stand for ID="blabla" and runat="server". Also note that there are no screenshots on this page - all rounded boxes are generated live.

NoImages method

NoImages is the default method which employs one JavaScript trick so no preparation work needs to be done. On the other hand, you have relatively limited customization options.

<bb:RoundedBox

					 BackColor="LightSteelBlue"

					... />

Meet the simplest possible RoundedBox usage. Only BackColor attribute is specified (note that this property is inherited from WebControl so you don't need to learn any new attributes at all). Really easy, isn't it?

<bb:RoundedBox

					 BackColor="Lightgreen"

					 UnderlayColor="White"

					... />

Almost the same example as the last one. Almost... :) The main difference is that when you specify UnderlayColor attribute, you get the anti-aliasing for free. This fine feature is not limited to NoImages method (which is default and so we don't need to specify it in the markup) and works consistently in other methods.

<bb:RoundedBox

					 BorderColor="SlateGray"

					... />

Here is another dead-simple example. When you use standard WebControl's BorderColor property and nothing else, you get totally transparent box which can be placed on an arbitrarily wild surface.

PreparedImages method

This is the most advanced method. You are in the full control about what's happening. You can create borders with shadows, some visually interesting graphic borders etc. For the quick example, look at this page as a whole - you will see a slim shaded border around the whole content which is done using this method.

<bb:RoundedBox

					 Method="PreparedImages"

					 Image-Mode=

						   "CornersAndEdges"

					 Image-Directory=

						   "~/img/rc"

					 Image-FilePrefix=

						   "firstpage-"

					... />

Here we specify the PreparedImages method and then three Image-* properties which describe where can RoundedBox find the prepared images. This is not the right place to write the full reference but you can be sure that you can do many things with PreparedImages method. You can prepare images for all edges and corners or only for corners (borders will be rendered using standard CSS properties) or maybe you want to have some totally custom look&feel. Everything is possible. RoundedBox also makes things easier by letting you specify only path to images and file pattern so you don't need to specify 8 long and ugly file names. I think you will be pleased with what can RoundedBox do for you :)

Using this method, you will want to look in the usage guide.

GenerateImages method

So you like the NoImages ease of use and the PreparedImages flexibility but NoImages is too simple for your needs and you are also too lazy to prepare rounded corners images in Photoshop or another graphical tool? Good news for you - the last method can generate images server-side for your convenience!

<bb:RoundedBox

					 Method="GenerateImages"

					 BackColor="PeachPuff"

					 BorderColor="IndianRed"

					 BorderWidth="3px"

					 UnderlayColor="white"

					 RadiusX="20"

					 RadiusY="10"

					... />

Best comment to this example is no comment. Just look at the properties and you will find them very familiar. You already know BackColor, BorderWith and BorderColor from generic ASP.NET development, you've already seen UnderlayColor which turns anti-aliasing on, and RadiusX and RadiusY properties are pretty straightforward. You also have no reason to be afraid about your server's performance - images are generated only once and then cached. So the first request will be served somewhat slower but any future requests will be served with exactly the same performance as PreparedImages method.

Going on

OK, you've seen a little teaser. If you're anxious to play with RoundedBox yourself, download and enjoy it! If you want to know more, go to feature page or to the usage guide.