जब हम कोई Web Application Develop करते हैं, तो सामान्यत: हम हमारी Website के प्रत्येक Page का Look and Feel समान ही रखना चाहते हैं, ताकि जब हमारा Visitor एक Page से दूसरे Page पर Navigate करे, तो उसे ऐसा न लगे कि वह किसी दूसरी Website पर पहुंच गया है।
इस जरूरत को ध्यान में रखते हुए Microsoft ने ASP.NET 2.0 में Themes and Skins नाम का एक नया Feature Add किया था, जो हमारे पूरे Web Application हेतु एक समान Look-n-Feel के लिए Themes बनाने की सुविधा देता है।
Applying ASP.NET 2.0 Themes
Themes को हम CSS (Cascading Style Sheets) की तरह ही मान सकते हैं, जो हमारे Webpage के Visual Styles को Define करने की सुविधा देता है। लेकिन Theme, CSS से कुछ ज्यादा सुविधा देता है, जहां हम ASP.NET Themes को अपने Application, Page या किसी Server Control Level पर Apply कर सकते हैं।
Theme for Single ASP.NET Page
इस बात को समझने के लिए कि हम किसी Theme को किस प्रकार से Use कर सकते हैं, सबसे पहले हम निम्नानुसार एक Simple ASP.NET Page बनाते हैं, जिसमें कुछ Text, Textbox, Button व Calendar Controls हैं:
File Name: Default.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<h1>BccFalna.com</h1><br />
<asp:Textbox ID="TextBox1" Runat="server" /><br /><br />
<asp:Calendar ID="Calendar1" Runat="server" /><br />
<asp:Button ID="Button1" Runat="server" Text="Button" />
</form>
</body>
</html>
इस Sample Page को Run करने पर ये हमें कुछ निम्नानुसार दिखाई देता है:
हम देख सकते हैं कि हमारा Page कितना Simple दिखाई दे रहा है, लेकिन यदि हम चाहें तो बडी ही आसानी से इस Page पर किसी भी ASP.NET Theme को Apply कर सकते हैं और ऐसा करने के लिए हमें फिर से Page Directive को ही Use करना होता है, जिसमें Theme Attribute को निम्नानुसार Specify करते हुए हम किसी Particular Theme को अपने Page पर Apply कर सकते हैं:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" Theme="BccFalnaTheme" %>
इस प्रकार से हम किसी Website के किसी Particular Page पर कोई Specific Theme Apply करने के लिए उस Webpage के @Page Directive को Specify करने के लिए Theme Attribute को उपरोक्तानुसार Use कर सकते हैं, जहां Value के रूप में Specify किया जाने वाला नाम, Current Webpage पर Apply की जाने वाली Theme का नाम होता है। जबकि यदि हम हमारे Current ASP.NET Web Application के सभी Pages पर किसी Theme को Apply करना चाहें, तो इस जरूरत को पूरा करने के लिए हम @Page Directive को Use नहीं कर सकते बल्कि इस जरूरत को पूरा करने के लिए हमें हमारे ASP.NET Web Application के Web.config File को Use करना होता है।
Theme for Entire Application
जब हम किसी Single Webpage पर किसी Theme को Apply करना चाहते हैं, तब हम पिछले Section में Specify किए तरीके के अनुसार @Page Directive में Theme Attribute का प्रयोग करते हुए वांछित Theme को Specify करते हैं।
लेकिन जब हमें हमारे Entire Web Application पर किसी Theme को Apply करना होता है, तब हम इस जरूरत को पूरा करने के लिए निम्नानुसार तरीके से Web.config File को उपयोग में लेते हैं:
<configuration>
<system.web>
<pages theme="BccFalna" />
</system.web>
</configuration>
जब एक बार हम Web.config File में किसी Theme को Entire Application Level पर Apply कर देते हैं, उसके बाद हमें Individual @Page Level पर किसी Theme को Specify करने की जरूरत नहीं होती। हालांकि यदि हम चाहें तो Application Level पर किसी Theme को Apply के बावजूद @Page Directive के माध्यम से Page Level पर किसी Different Theme को Apply कर सकते हैं।
Removing ASP.NET 2.0 Themes
जिस तरह से हम किसी Single Page या Entire Website पर किसी Theme को Apply करते हैं, उसी तरह से हम किसी Theme को किसी Specific Web Control, Page या Entire Application से Remove भी कर सकते हैं, जिसके बारे में इस Section में विस्तार से बताया गया है:
Removing Themes from Server Controls
हम चाहे किसी Theme को Application Level पर Apply करें, या Page Level पर, कई बार हमें Theme द्वारा किसी Page Control के लिए Specify किए गए Look and Feel को Override करने की जरूरत पडती है।
उदाहरण के लिए जब हम किसी Page/Application पर किसी Theme को Apply कर देते हैं, उसके बाद यदि हम उस Page पर स्थित किसी Server Control पर निम्नानुसार अन्य Properties Set करें, तो उन Properties का कोई प्रभाव हमें Output में दिखाई नहीं देता, क्योंकि इन Properties को Theme में Specify किया गया Look-n-Feel Rule Override कर देता है:
<asp:Textbox ID="TextBox1" Runat="server" BackColor="#000000" ForeColor="#ffffff" />
हम देख सकते हैं कि इस TextBox Server Control के BackColor को Black व ForeColor को White Set किया है, लेकिन यदि हमारे Theme में TextBox Server Control हेतु BackColor को Gray Set किया गया हो, तो हमारे द्वारा Specify किए गए ये Changes] Theme में Specify किए गए Gray Color से Override हो जाते हैं, जिसकी वजह से हमें हमारे TextBox का BackColor Black नहीं बल्कि Gray ही दिखाई देता है।
इस स्थिति में अपने Server Control से Theme द्वारा Apply होने वाले Styling Rules को Override करने के लिए निम्नानुसार तरीके से EnableTheming=”false“ Attribute को Specify कर सकते हैं:
<asp:Textbox ID="TextBox1" Runat="server" BackColor="#000000" ForeColor="#ffffff" EnableTheming="false" />
जब एक बार हम किसी Server Control के EnableTheming Attribute को false Value Set कर देते हैं, उसके बाद उस Server Control पर Applied Theme के CSS Rules Apply नहीं होते।
हालांकि किसी Single Web Control पर Theme के CSS Rules को Apply होने से रोकना हो, तो हम उपरोक्तानुसार तरीके से EnableTheming Attribute को false Set कर सकते हैं। लेकिन जब हमें किसी Multiple Web Controls के लिए EnableTheming को false Set करना हो, तो बेहतर तरीका ये होता है कि हम उन सभी Web Controls को एक Panel Control के बीच Enclose कर दें और उस Panel Control के लिए EnableTheming को false Set कर दें।
Removing Themes from Server Web Pages
जिस तरह से हमने पिछले Section में किसी Specific Server Control से किसी Applied Theme को Remove किया है, उसी तरह से हम किसी Particular Page से भी ऐसी किसी Applied Theme को Remove कर सकते हैं, जिसे Application Level पर Apply किया गया हो और किसी Page से किसी Theme को Remove करने के लिए भी हमें EnableTheming Attribute को ही Use करना होता है, लेकिन इस बार इस Attribute को Web Control में नहीं बल्कि @Page Directive में Use करना होता है। जैसे:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" EnableTheming="false" %>
इस प्रकार से जब हम EnableTheming Attribute को “false” Set कर देते हैं, तब उस Page के लिए Web.config File में Specified Theme Unset हो जाता है। हालांकि हम किसी इस Page के किसी Web Control में EnableTheming=”true“ Specify करके उस Particular Web Control पर Theme को Apply कर सकते हैं। जैसे:
<asp:Textbox ID="TextBox1" Runat="server" Theme="BccFalna" EnableTheming="true" />
StylesheetTheme Attribute
@Page Directive में StylesheetTheme Attribute भी होता है, जिसे किसी Theme को Page पर Apply करने के लिए Use किया जा सकता है। लेकिन सवाल ये है कि यदि हम Theme Attribute का प्रयोग करते हुए किसी Theme को Page पर Apply कर सकते हैं, तो फिर StylesheetTheme Attribute की क्या जरूरत है\ चलिए समझने की कोशिश करते हैं।
मानलो कि हम StylesheetTheme Attribute को निम्नानुसार Specify करते हैं:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" StylesheetTheme="MyTheme" %>
वास्तव में StylesheetTheme Attribute ठीक उसी तरह से काम करता है जिस तरह से Theme Attribute काम करता है, क्योंकि दोनों ही Attributes किसी Theme को Page पर Apply करने का काम करते हैं।
लेकिन दोनों के बीच अन्तर ये है कि जब हम Theme Attribute को किसी Particular Page के अन्दर Locally Set करते हैं, तब यदि हम किसी Control में Local Styling Attributes को Set करते हैं, तो उन Local Styling Attributes को Page पर Applied Theme द्वारा Override कर दिया जाता है।
उदाहरण के लिए मानलो कि हमने हमारे @Page Directive में Theme=”BccFalna” Specify किया है और उसी Page पर निम्नानुसार एक TextBox Control में Local Styling को Apply किया है:
<asp:Textbox ID="TextBox1" Runat="server" BackColor="#000000" ForeColor="#ffffff" />
तो इस TextBox Control का BackColor Black नहीं होगा, क्योंकि इस पर Theme का Style Override हो जाएगा। लेकिन यदि हमने हमारे @Page Directive में Theme=”BccFalna” के स्थान पर StylesheetTheme=”BccFalna” Specify किया हो, तो उपरोक्त TextBox Control पर Local Styling को Apply करने पर ये Styling Rules, Theme के Styling Rules को Override कर देते हैं। परिणामस्वरूप हमारे TextBox Web Control का BackColor Black हो जाता है। Theme व StylesheetTheme दोनों Attributes के बीच यही मुख्य अन्तर है।
ये Article इस वेबसाईट पर Selling हेतु उपलब्ध EBook Advance ASP.NET WebForms with C# in Hindi से लिया गया है। इसलिए यदि ये Article आपके लिए उपयोगी रहा, तो निश्चित रूप से ये पुस्तक भी आपके लिए काफी उपयोगी साबित होगी।
Advance ASP.NET WebForms in Hindi | Page:707 | Format: PDF
