Custom visual controls are generated by <div> labels as templates.
Attribute:
Text: The text displayed by the control.
Href: the hyperlink address of the text displayed by the control.
Target: displays the target frame of a hyperlink.
Stylebackground: Control background Style
Stylemouseout: style after the control mouse leaves
Stylemouseover: Controls move the mouse up and then the style
Styleline: Controls separator line style
Displaypipe: whether the control displays the separator "|"
Width: control width
Purpose:
Used as a link or button label to form a menu bar in the navigation bar.
Function:
Display prompt text. You can set links to respond to the mouse overwrite/exit event and change the widget appearance. The delimiter can be displayed or hidden.
Code:
App_code/selfcontrols. CS:
Using system;
Using system. Web. UI;
Using system. Web. UI. webcontrols;
Using system. componentmodel;
Namespace selfcontrols
{
Public class maincontrol: system. Web. UI. webcontrols. webcontrol
{
# Region defines variables and their default values
Private string text = "";
Private string href = "";
Private string target = "_ Self ";
Private string stylebackground = "";
Private string stylemouseout = "";
Private string stylemouseover = "";
Private string styleline = "";
Private bool displaypipe = true;
# Endregion
# Region Constructor
Public maincontrol (): Base (htmltextwritertag. Div)
{
}
# Endregion
# Region defined attributes
// Text displayed by the Control
Public String text
{
Get
{
Return text;
}
Set
{
TEXT = value;
}
}
// The hyperlink address of the text displayed by the Control
Public String href
{
Get
{
Return href;
}
Set
{
Href = value;
}
}
// The control displays the target frame of the hyperlink.
Public String target
{
Get
{
Return target;
}
Set
{
Target = value;
}
}
// Control background Style
Public String stylebackground
{
Get
{
Return stylebackground;
}
Set
{
Stylebackground = value;
}
}
// Controls the style after the mouse leaves
Public String stylemouseout
{
Get
{
Return stylemouseout;
}
Set
{
Stylemouseout = value;
}
}
// Widget move the mouse up and then style
Public String stylemouseover
{
Get
{
Return stylemouseover;
}
Set
{
Stylemouseover = value;
}
}
// Control separator Style
Public String styleline
{
Get
{
Return styleline;
}
Set
{
Styleline = value;
}
}
// Whether the control displays the separator "|"
Public bool displaypipe
{
Get
{
Return displaypipe;
}
Set
{
Displaypipe = value;
}
}
// Control width
Public override unit width
{
Get
{
Return base. width;
}
Set
{
Base. width = value;
}
}
# Endregion
/// Write the custom style to the HTTP output stream:
Protected override void addattributestorender (htmltextwriter output)
{
Output. Write ("<! -Custom control example --> ");
Output. addattriground (htmltextwriterattribute. Class, stylebackground );
Output. addstyleattribute ("width", width. tostring ());
Base. addattributestorender (output );
}
/// Render control method rendercontents
Protected override void rendercontents (htmltextwriter output)
{
// Define a style
Output. addstyleattribute (htmltextwriterstyle. Width, "10px ");
Output. addstyleattribute (htmltextwriterstyle. fontsize, "12px ");
Output. addstyleattribute (htmltextwriterstyle. fontfamily, "");
Output. renderbegintag (htmltextwritertag. span );
Output. addattriout (htmltextwriterattribute. Class, stylemouseout );
Output. addattriout ("onmouseout", "This. classname = '" + stylemouseout + "'");
Output. addattriover ("onmouseover", "This. classname = '" + stylemouseover + "'");
Output. addattribute (htmltextwriterattribute. href, href );
Output. addattriter( htmltextwriterattribute. target, target );
Output. renderbegintag (htmltextwritertag. );
Output. Write (text );
Output. renderendtag ();
Output. renderendtag ();
// Define the separator and Style
If (displaypipe)
{
Output. addattrieline (htmltextwriterattribute. Class, styleline );
Output. renderbegintag (htmltextwritertag. span );
Output. Write ("| ");
Output. renderendtag ();
}
Else
{
Output. renderbegintag (htmltextwritertag. span );
Output. Write ("& nbsp ;");
Output. renderendtag ();
}
// Use the default logic to present the child Control
Base. rendercontents (output );
}
}
}
Call example:
<% @ Page Language = "C #" autoeventwireup = "true" codefile = "Top. aspx. cs" inherits = "TOP" %>
<% @ Register tagprefix = "selfcontrol" namespace = "selfcontrols" %>
<% @ Outputcache duration = "1000" varybyparam = "NONE" %>
<HTML>
<Head>
<Title> </title>
<LINK rel = 'stylesheet 'Type = 'text/CSS 'href = 'styles/style.css'> </link>
<LINK rel = 'stylesheet 'Type = 'text/CSS 'href = 'styles/selfcontrol.css'> </link>
</Head>
<Body leftmargin = "0" topmargin = "0">
<Table cellspacing = "0" cellpadding = "0" width = "100%" border = "0">
<Tr>
& Lt; TD width = "100%" & gt;
<Table Height = "22" cellspacing = "0" cellpadding = "0" width = "100%" border = "0">
<Tr>
<TD bgcolor = "#4b92d9" width = "30%" Height = "22"> <span style = "font-size: 12px; color: # ffffff; "> custom control test page </span> </TD>
<TD style = "filter: progid: DXImageTransform. microsoft. gradient (startcolorstr = '#4b92d9', endcolorstr = '# cedff6', gradienttype = '1') "width =" 35% "> </TD>
<TD style = "filter: progid: DXImageTransform. microsoft. gradient (startcolorstr = '# cedff6', endcolorstr =' #1e77d3 ', gradienttype = '1') "width =" 35% "> </TD>
</Tr>
</Table>
</TD>
</Tr>
</Table>
<Table id = "table5" width0 = "100%" border = "0" cellpadding = "0" cellspacing = "0">
<Tr>
<TD>
<Selfcontrol: maincontrol id = "customcontrol1" runat = "server"
Stylebackground = "graybackground"
Stylemouseout = "graystyleout"
Stylemouseover = "graystyleover"
Styleline = "grayline"
Displaypipe = "true"
Target = "mainframe"
TEXT = "test Homepage"
Href = "Bott. aspx">
</Selfcontrol: maincontrol>
</TD>
<TD>
<Selfcontrol: maincontrol id = "customcontrol2" runat = "server"
Stylebackground = "graybackground"
Stylemouseout = "graystyleout"
Stylemouseover = "graystyleover"
Styleline = "grayline"
Displaypipe = "true"
Target = "mainframe"
TEXT = "Computer Learning Network"
Href = "http://www.why100000.com/"/>
</TD>
<TD>
<Selfcontrol: maincontrol id = "customcontrol3" runat = "server"
Stylebackground = "graybackground"
Stylemouseout = "graystyleout"
Stylemouseover = "graystyleover"
Styleline = "grayline"
Displaypipe = "true"
Target = "mainframe"
TEXT = "ask the computer"
Href = "http://bbs.why100000.com"/>
</TD>
<TD>
<Selfcontrol: maincontrol id = "customcontrol4" runat = "server"
Stylebackground = "bluebackground"
Stylemouseout = "bluestyleout"
Stylemouseover = "bluestyleover"
Styleline = "blueline"
Displaypipe = "false"
Target = "_ blank"
TEXT = "Network School"
Href = "http://edu.why100000.com/edu"/>
</TD>
<TD width = "100%" bgcolor = "# f1f1f1"> </TD>
</Tr>
</Table>
</Body>
</Html>