RoundedCornersExtender in asp.net ajax
RoundedCornersExtender is an asp.net ajax control toolkit's extender control. RoundedCornersExtender allow
us to apply rounded corners to an element such as Panel, BulletedList, CheckBoxList, RadioButtonList server controls.
to apply rounder corners, RoundedCornersExtender control insert elements before and after the target element, so the overall
height of the target element will change slightly.
RoundedCornersExtender control's have the following properties those are TargetControlID, Radius, Corners, Color and BorderColor.
RoundedCornersExtender control's TargetControlID property specify the control which corners we want to make rounded. Corners property
specify the corners of the target control that should be rounded. Corners enumeration have the following values those are None, TopLeft, TopRight,
BottomRight, BottomLeft, Top, Right, Bottom, Left and All. so we can round any corner of target control or all corners.
Radius property set the radius of target control's corners and height of the added area. Radius property default value is 5.
Color property get or set a background color of rounded corner areas in target control. BorderColor property get or set a border color and therefore
of the rounded corners.
RoundedCornersExtender control's have the following methods those are initialize(), dipose(), update(), disposeParentDiv(), getBackgroundColor(),
moveChildren(), isCornerSet(corner) and setCorner(corner, value).
RoundedCornersExtender isCornerSet(corner) method allow us to check whether the specified corner has been set. setCorner(corner, value) method
allow us to set a corner that should be rounded. getBackgroundColor() method provide a way to get the target element's background color.
UsingRoundedCornersExtender.aspx
<%@ Page Language="C#" AutoEventWireup="true" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!DOCTYPE html>
<script runat="server">
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head id="Head1" runat="server">
<title>How to use RoundedCornersExtender in asp.net ajax</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<h2 style="color:DarkSeaGreen; font-style:italic;">Ajax Control Toolkit Example: Using RoundedCornersExtender</h2>
<hr width="600" align="left" color="DarkSeaGreen" />
<asp:ScriptManager
ID="ScriptManager1"
runat="server"
>
</asp:ScriptManager>
<cc1:RoundedCornersExtender
ID="RoundedCornersExtender1"
runat="server"
TargetControlID="CheckBoxList1"
Radius="20"
>
</cc1:RoundedCornersExtender>
<br /><br />
<asp:CheckBoxList
ID="CheckBoxList1"
runat="server"
BackColor="OrangeRed"
ForeColor="Snow"
RepeatColumns="3"
Width="450"
Font-Names="Comic Sans MS"
Font-Size="Large"
>
<asp:ListItem>OrangeRed</asp:ListItem>
<asp:ListItem>BurlyWood</asp:ListItem>
<asp:ListItem>SaddleBrown</asp:ListItem>
<asp:ListItem>RosyBrown</asp:ListItem>
<asp:ListItem>Maroon</asp:ListItem>
<asp:ListItem>SeaGreen</asp:ListItem>
<asp:ListItem>DarkBlue</asp:ListItem>
</asp:CheckBoxList>
</div>
</form>
</body>
</html>
