ASP.NETの中のThemeとSkin

2955 ワード

Themeは、ページとコントロールの外観を定義できる多くの属性の集合であり、これらの属性を適用することで、ウェブアプリケーション内のページ内、またはウェブアプリケーション全体、または1つのサーバ上で複数のウェブアプリケーションの範囲内で一致して外観を提供することができる.
 
Theme and Control Skins
===================
Themeは、skin、cascading style sheets(CSS)、images、その他のリソースを含む一連の要素から構成されている.一つのThemeには少なくともskinが必要だ.Themeはあなたのサイトまたはあなたのwebサーバの特定のフォルダで定義されています.
 
Skin
---------------------
skinファイルの接尾辞名は.Button、Label、TextBox、Calendarなどのコントロールの属性構成を含むskin.コントロールのskin構成はcontrol markup自身に似ていますが、属性の一部として使用したい属性のみが含まれています.たとえば、buttonコントロールのskinは次のようになります.
<asp:button runat="server" BackColor="lightblue" ForeColor="black" />

 
作成できます.skinファイルはThemeフォルダにあります.ひとつskinファイルには、1つ以上のコントロールのskinを含むことができる.skinを個別のファイルに定義したり、themeのすべてのskinを個別のファイルに定義したりすることができます.
 
コントロールのskinには、default skinsとnamed skinsの2種類があります.
  • 一つのthemeが一つのページに適用されると、Default skinは自動的に同じ種類のすべてのコントロールに適用する.コントロールskinにSkinID属性がない場合はdefault skinです.
  • named skinはSkinID属性セットを持つcontrol skinである.named skinは自動的にタイプ別にコントロールに適用する.代わりに、コントロールのSkinID属性を設定することで、コントロールにnamed skinを適用する必要があります.named skinを作成すると、アプリケーション内の同じコントロールの異なるインスタンスに異なるskinを設定できます.

  • Cascading Style Sheets
    ---------------------
    トピックには、積層スタイルシート(css)ファイルも含む.cssファイルをthemeフォルダに置くと、スタイルシートが自動的にthemeの一部として適用されます. 
     
    Theme Graphics and Other Resources
    ----------------------
    トピックには、スクリプトファイルや音声ファイルなどのグラフィックやその他のリソースも含むことができる.例えば、あなたのページthemeはTreeViewコントロールにskinを含むかもしれません.このthemeの一部として、展開ボタンと折り畳みボタンを表す画像を含めることができます.
     
    典型的には、themeのリソースファイルはskinファイルと同じフォルダにあるが、ウェブアプリケーションの他の場所、例えばthemeフォルダのサブフォルダにも存在する.サブフォルダのリソースを参照する場合は、次の例のようにパスを使用します.
    <asp:Image runat="server" ImageUrl="ThemeSubfolder/filename.ext" />

     
    themeフォルダ以外のリソースファイルも参照できます.波線(~)構文を使ってリソースファイルを参照すると、Webアプリケーションが自動的に画像を見つけます.たとえば、themeのリソースをapplicationのサブフォルダに配置すると、このような形式のパスを使用してリソースファイルを参照できます.
    <asp:Image runat="server" ImageUrl="~/AppSubfolder/filename.ext" />

     
    ThemeとCascading Style Sheetsの違い
    =====================
    ThemeとCascading Style Sheetsは、任意のページに適用できる一連の一般的な属性を定義することができる.しかし、彼らは次の点で違います.
  • Themeは、style属性だけでなく、1つのコントロールまたはページに対して多くの属性を定義することができる.例えばthemeを使用すると、TreeViewコントロールのピクチャを定義したり、GridViewコントロールのテンプレートレイアウトを定義したりすることができます.
  • Themeは画像ファイルを含むことができる.
  • Themeはスタイルシートのように積層しない.デフォルトでは、StyleSheetThemeプロパティを明示的に使用してthemeを適用しない限り、ページのThemeプロパティで定義されたプロパティ値は、コントロールで宣言されたプロパティ値を上書きします.
  • 各ページには1つのthemeしか適用できない.スタイルシートのように複数のstyle sheetを適用するのではなく、もう1つのページに複数のthemeを適用することはできません.

  •  
    翻訳:
    ASP.NET Themes and Skins
    http://msdn.microsoft.com/en-us/library/ykzx33wh.aspx