もしかしたら、テーマやスキンについてよくわかっていない友達もいるかもしれません。まずはテーマとスキンを紹介します。
1. はじめに:
テーマとスキンの名前を見れば、それらが何に使われているかがわかります。次に、それらが何に使われるかについて話しましょう (~_~) それらをすべて知っているのに、それらは簡単に変更できます。テーマ: コードとページ ファイルを変更せずにスタイルとページを制御します。
テーマ ファイルは App_Themes フォルダーの下に個別に配置され、プログラムとは完全に分離されています。
2. テーマとスキンの使用方法:
まず非常に簡単な例を見てみましょう:
App_Themesdefault1.skin ファイル コード:
<asp:Label Font-Bold="true" ForeColor="Red" runat="server" />
default.aspx: ファイル コード:
<%@ ページ言語="C#" テーマ="デフォルト" %>
<!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 id="Head1" runat="server">
<title>サンプルテーマが適用されたページ</title>
</head>
<本文>
<form id="form1" runat="server">
<asp:Label ID="Label1" runat="server" Text="Hello 1" /><br />
<asp:Label ID="Label2" runat="server" Text="Hello 2" /><br />
</form>
</body>
</html>
default.aspx にはスタイルを制御するコードがまったく記述されていないことがわかりますが、実行すると、ラベル上の単語が赤色の太字になっていることがわかります。これは最も基本的なテーマの例です。
App_Themes フォルダー:
App_Themes フォルダーは、プログラムのルート ディレクトリにあります。App_Themes は、テーマ名のサブフォルダーである必要があります。このサブフォルダーには、複数の .skin ファイルと .css ファイルを含めることができます。以下の図では、default とdefault2 という名前の 2 つのテーマが作成されています。
テーマを使用する
1. テーマをページに適用します。
特定のページにテーマを適用する場合は、aspx ファイル内の <%@ Page Theme="..." %> を直接変更します。たとえば、default2 テーマをこのページに適用する場合は、<% を設定します。 @ Page Theme="default2" %> OK
2. すべてのページに同じテーマを適用します。
すべてのページで同じテーマを使用する場合は、web.config の <system.web> ノードの下に <pages theme="..."/> という文を追加します。
3. コントロールがテーマを適用しないようにします。
最初の例では、2 つのラベルのスタイルが変更されたことがわかりました。これは、.skin ファイル内のスタイルがページ上のすべてのラベルに適用されたことを意味します。ただし、特定のラベルに .skin のスタイルを適用しないようにしたい場合があります。この場合は、ラベルの EnableTheming プロパティを false に設定するだけで済みます。
場合によっては、ラベルごとに異なるスタイルを表示することもできます。以下の例を参照してください。
App_Themesdefault1.skin
<asp:label runat="server" font-bold="true" forecolor="Red" />
<asp:label runat="server" SkinID="Blue" font-bold="true" forecolor="blue" />
deafult.aspx
<%@ ページ言語="C#" テーマ="デフォルト" %>
<!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 id="Head1" runat="server">
<title>サンプルテーマが適用されたページ</title>
</head>
<本文>
<form id="form1" runat="server">
<asp:Label ID="Label2" runat="server" Text="Hello 2" SkinID="Blue" /><br />
<asp:Label ID="Label3" runat="server" Text="Hello 3" /><br />
</form>
</body>
</html>
実行すると、2 つのラベルの表示スタイルが異なることがわかります。
4. その他の方法:
前述したように、aspx ファイル ヘッダーで <%@ Page Theme="..." %> を使用してテーマを使用し、このメソッドを使用してテーマにスタイルを適用すると、aspx で記述したコントロール属性のスタイルが上書きされます。例えば：
App_Themesdefault1.skin
<asp:Label Font-Bold="true" ForeColor="Red" runat="server" />
default.aspx
<%@ ページ言語="C#" テーマ="デフォルト" %>
<!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 id="Head1" runat="server">
</head>
<本文>
<form id="form1" runat="server">
<asp:Label ID="Label1" runat="server" Text="Hello 1" /><br />
<asp:Label ID="Label2" runat="server" Text="Hello 2" ForeColor="blue" />
</form>
</body>
</html>
操作の結果、すべてのラベルの前色は赤になります。
<%@ Page StyleSheetTheme="..." %> を使用してテーマを適用しても、aspx ファイルに記述したスタイル属性は上書きされません。
コントロールがスタイル属性を適用する順序は次のとおりです。
a. StyleSheetTheme によって参照されるスタイル
b. コードによって設定されたプロパティを制御します (StyleSheetTheme をオーバーライドします)。
c. テーマ (最初の 2 つをカバー) テーマによって参照されるスタイルには
CSS が含まれています。
.css ファイルはテーマでも使用できます。.css ファイルをテーマ ディレクトリに置くと、そのテーマを使用するページに .css が自動的に適用されます。
3. 背景コードは Web サイトのスキンを簡単に変更できます
。。
上で述べたのは、aspx ファイルまたは web.config でテーマを適用することですが、ユーザーごとにスキンが異なるブログのような Web サイトでスキンを変更する場合、上記の方法を使用するのは明らかに不便です。
以下では、上記の状況を解決するために、バックグラウンド コードでテーマを動的に参照する方法を紹介します。テーマは、ページがリクエストされたときに最も早く適用される必要があるため、Page_PreInit イベントにコードを記述する必要があります。コードは非常に簡単です。 、一文だけ:
Page.Theme = "...";
ここでは、各ユーザーが設定した異なるテーマ名をデータベースから読み取るだけで、各ユーザーが異なるスキンを持っていることが簡単にわかります。
------------------------------------------
上記はすべて個人的な意見と経験ですので、何か間違っていることがあれば、アドバイスをお願いします。