Tuesday, June 16, 2015

changing theme dynamicaly in master page

To implement this first create new website in visual studio after that right click on your website and select Add New Item after that select Master page and click OK. Now master page added to your application. Now again right click on your website and select Add ASP.NET Folder under that selectTheme now App_Themes folder will add to your application. Now right click on App_Themes folder and create two new Asp.net folders and give names as “Blue” and “Red”. Now select Blue folder under that add one skin file and one css file same way add skin file and css file in Red folder also. Here we need to use Page_PreInit event in all the pages wherever we need to change themes dynamically for that reason instead of writing this same event in all the pages we need to create new class file and give name as ThemeClass and write following code.

Over all our structure of the application will be like this


---------------master page-----------------------------------

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

<!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>

    <style type="text/css">
        .style1
        {
            width: 100%;
        }
        .style2
        {
            height: 237px;
        }
        .style3
        {
            height: 237px;
            width: 46px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
     
        <table class="style1">
            <tr>
                <td align="center" colspan="2">
                    article</td>
            </tr>
            <tr>
                <td class="style3">
                </td>
                <td class="style2">
                    <asp:ContentPlaceHolder ID="head" runat="server">
                    </asp:ContentPlaceHolder>
                    <b>Click Button to change Theme</b><br />
<asp:Button ID="btnBlue" runat="server" Text="Blue" BackColor="#44BCED" Font-Bold="true"
                        onclick="btnBlue_Click" />
<asp:Button ID="btnRed" runat="server" Text="Red" BackColor="Red" Font-Bold="true"
                        onclick="btnRed_Click" />
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    &nbsp;</td>
            </tr>
        </table>
     
    </div>
    </form>
</body>
</html>

-------------------------------------------------master page.cs----------------------------------------
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class MasterPage : System.Web.UI.MasterPage
{
    public class ThemeClass: System.Web.UI.Page
    {
       
    }
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    protected void btnBlue_Click(object sender, EventArgs e)
    {

        Session["Theme"] = btnBlue.Text;
        Server.Transfer(Request.FilePath);
      
    }
    protected void btnRed_Click(object sender, EventArgs e)
    {
       Session["Theme"]=btnRed.Text;
       Server.Transfer(Request.FilePath);
    }
}
--------------------------------default.aspx-----------------------------------------
<%@ Page Title="" Theme="blue" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
 <asp:Panel ID="pnllogin" runat="server" Height="148px" 
        style="margin-left: 529px" BackColor="#33CCFF" BorderColor="#CC00CC" 
        BorderStyle="Solid" BorderWidth="5px" ForeColor="#0099CC" 
    Width="323px" >
        <br />
        <br />
        &nbsp;<asp:Label ID="lblname" runat="server" ForeColor="Blue" Text="NAME"></asp:Label>
        &nbsp;
        <asp:TextBox ID="name" runat="server"></asp:TextBox>
        <br />
        <br />
        <asp:Label ID="lblpassword" runat="server" ForeColor="Blue" Text="Password"></asp:Label>
        <asp:TextBox ID="txtpassword" runat="server"></asp:TextBox>
        <br />
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <asp:Button ID="btnlogin" runat="server" Height="26px" Text="LOG IN" 
            Width="63px" />
        &nbsp;<asp:Button ID="btnregister" runat="server" Text="REGISTER" />
    </asp:Panel>
    <asp:GridView ID="GridView1" runat="server" BorderColor="#CC0099" 
        BorderStyle="Solid" BorderWidth="5px" AutoGenerateColumns="False">
        <Columns>
           
            <asp:TemplateField HeaderText="Title">
                <EditItemTemplate>
                    <asp:TextBox ID="TextBox1" runat="server" Text='<%# Bind("c_Articles_Name") %>'></asp:TextBox>
                </EditItemTemplate>
                <ItemTemplate>
                    <asp:Label ID="Label1" runat="server" Text='<%# Bind("c_Articles_Name") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Category">
                <EditItemTemplate>
                    <asp:TextBox ID="TextBox2" runat="server" 
                        Text='<%# Bind("c_Articles_Details") %>'></asp:TextBox>
                </EditItemTemplate>
                <ItemTemplate>
                    <asp:Label ID="Label2" runat="server" Text='<%# Bind("c_Articles_Details") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="Author">
                <EditItemTemplate>
                    <asp:TextBox ID="TextBox3" runat="server" 
                        Text='<%# Bind("c_CAND_AUTHENTICATION_UserId") %>'></asp:TextBox>
                </EditItemTemplate>
                <ItemTemplate>
                    <asp:Label ID="Label3" runat="server" 
                        Text='<%# Bind("c_CAND_AUTHENTICATION_UserId") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
            <asp:TemplateField HeaderText="PostedDate">
                <EditItemTemplate>
                    <asp:TextBox ID="TextBox4" runat="server" Text='<%# Bind("c_Articles_Date") %>'></asp:TextBox>
                </EditItemTemplate>
                <ItemTemplate>
                    <asp:Label ID="Label4" runat="server" Text='<%# Bind("c_Articles_Date") %>'></asp:Label>
                </ItemTemplate>
            </asp:TemplateField>
           
        </Columns>
    </asp:GridView>
</asp:Content>
-------------------------------------------------------default.aspx.cs----------------------------
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page
{
    
        protected void page_preInit(object sender, EventArgs e)
        {
            if (Session["Theme"] != null)
            {
                Page.Theme = Session["Theme"].ToString();
            }
        }
    
    protected void Page_Load(object sender, EventArgs e)
    {

    }
}
-------------------------------stylesheet-----------------------------
body
{
font-size: 15pt;
color: #000000;
background-color: Red;
}
--------------------------------skinfile-------------------------------
<asp:Label runat="server"  Font-Bold="true" Font-Italic="true" />
<asp:Textbox runat="server"  BackColor="Orange" BorderColor="DarkCyan" BorderStyle="Dotted" BorderWidth="2" />