动态加载主题

蓝色梦幻 · 发表于 2007-11-23 22:45

通过编程方式,在运行时动态修改页面所应用的主题,其核心是修改page对象的Theme属性值.
注意事项:只能在
Page_Perlinit事件处理程序中修改Theme属性值
三个页面:
1主页面代码

efault2.aspx
<%@ Page Language=\"C#\" AutoEventWireup=\"true\" CodeFile=\"Default2.aspx.cs\" Inherits=\"Default2\" %>
<script runat=\"server\" >
void Page_PreInit(object sender, EventArgs e)
  {
//设置页面所设置的主题
string theme;
if (Request.QueryString[\"theme\"] == null)
{
   theme = \"Red\";
}
else
{
   theme =Request.QueryString[\"theme\"];
}
Page.Theme = theme;
//设置DropDownList控件的选中项
ListItem item = DropDownList1.Items.FindByValue(theme);
if (item != null)
{
   item.Selected = true;
}
  }
  void SelectedIndexChanged(object sender,EventArgs E)
  {
//获取DropDownList选中项值,并进行页面重定向
string url = Request.Path + \"?theme=\" + DropDownList1.SelectedItem.Value;
Response.Redirect(url);
  }
</script>
<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">

<html xmlns=\"http://www.w3.org/1999/xhtml\" >
<head runat=\"server\">
  <title>无标题页</title>
</head>
<body>
  <form id=\"form1\" runat=\"server\">
  <div>
  <fieldset style =\"width:240px\">
  <legend>动态加载主题</legend>
   <asp

ropDownList ID=\"DropDownList1\" runat=\"server\" OnSelectedIndexChanged =\"SelectedIndexChanged\" AutoPostBack =\"true\" >
<asp

istItem Value =\"Red\">启用Red主题</asp

istItem>
<asp

istItem Value =\"Blue\">启用Blue主题</asp

istItem>
</asp

ropDownList><br />
<asp:Calendar ID=\"Calendar1\" runat=\"server\" >
</asp:Calendar>
   </fieldset>
</div>
  </form>
</body>
</html>
2.蓝色主题:Calendar.skin
<asp:Calendar runat=\"server\" BackColor =\"white\" BorderColor =\"#EEE6F7\" CellPadding =\"4\" DayNameFormat =\"Shortest\" Font-Size =\"0.8em\"
   ForeColor =\"black\" Height =\"180px\" Width =\"200px\">
   <SelectedDayStyle BackColor =\"#41519A\" Font-Bold =\"true\" Font-Size =\"0.8em\" ForeColor =\"white\" />
   <SelectorStyle BackColor =\"#41519A\" Font-Size =\"0.8em\" />
   <WeekendDayStyle BackColor =\"#99ACDD\" Font-Size =\"0.8em\" />
   <OtherMonthDayStyle ForeColor =\"#41519A\" Font-Size =\"0.9em\" />
   <TodayDayStyle BackColor =\"#B2C3E1\" ForeColor =\"Black\" Font-Size =\"0.8em\" />
   <NextPrevStyle VerticalAlign =\"bottom\" Font-Bold =\"true\" ForeColor=\"white\" Font-Size =\"0.8em \" />
   <DayHeaderStyle Font-Bold =\"true\" Font-Size =\"0.8em\" BackColor =\"#B2C3E1\" />
   <TitleStyle BackColor =\"#41519A\" BorderColor =\"BLACK\" Font-Bold =\"true\" ForeColor =\"white\" Font-Size =\"0.9em\" />
   <DayStyle Font-Size =\"0.8em\" />
   </asp:Calendar>
3.红色主题:Calendar.skin
<asp:Calendar runat=\"server\" BackColor =\"white\" BorderColor =\"#EEE6F7\" CellPadding =\"4\" DayNameFormat =\"Shortest\" Font-Size =\"0.8em\"
   ForeColor =\"black\" Height =\"180px\" Width =\"200px\">
   <SelectedDayStyle BackColor =\"white\" Font-Bold =\"true\" Font-Size =\"0.8em\" ForeColor =\"white\" />
   <SelectorStyle BackColor =\"#8A170F\" Font-Size =\"0.8em\" />
   <WeekendDayStyle BackColor =\"#E7E7E7\" Font-Size =\"0.8em\" />
   <OtherMonthDayStyle ForeColor =\"#8A170F\" Font-Size =\"0.9em\" />
   <TodayDayStyle BackColor =\"#F4000A\" ForeColor =\"WHITE\" Font-Size =\"0.8em\" Font-Bold =\"true\" />
   <NextPrevStyle VerticalAlign =\"bottom\" Font-Bold =\"true\" ForeColor=\"white\" Font-Size =\"0.8em\" />
   <DayHeaderStyle Font-Bold =\"true\" Font-Size =\"0.8em\" BackColor =\"#F4000A\" ForeColor =\"white\" />
   <TitleStyle BackColor =\"#8A170F\" BorderColor =\"BLACK\" Font-Bold =\"true\" ForeColor =\"white\" Font-Size =\"0.9em\" />
   <DayStyle Font-Size =\"0.8em\" />
   </asp:Calendar>
注意:就是蓝色主题和红色主题:
是在<App_Themes>文件夹下:建立<Blue>和<Red>两个文件夹下面相同的命名为:Calendar.skin皮肤文件.
效果图案:

一路顺风 · 发表于 2007-11-23 23:08

谢谢分享,如果想建立<yellow>主题是不是以此类推!?

蓝色梦幻 · 发表于 2007-11-25 21:15

是的

一路顺风 · 发表于 2007-11-26 21:49

谢谢,收到!!!!

帐号		自动登录	找回密码
密码			成为会员