Asp.net-custom-controls

提供：Dev Guides
移動先:案内、検索

ASP.NET-カスタムコントロール

ASP.NETでは、ユーザーがコントロールを作成できます。 これらのユーザー定義のコントロールは、以下に分類されます。

  • ユーザーコントロール
  • カスタムコントロール

ユーザーコントロール

ユーザーコントロールは、他の多くのページで使用できるミニチュアASP.NETページまたはWebフォームのように動作します。 これらは、System.Web.UI.UserControlクラスから派生しています。 これらのコントロールには、次の特性があります。

  • これらには.ascx拡張子が付いています。
  • <html>、<body>、または<form>タグを含めることはできません。
  • これらには、Pageディレクティブの代わりにControlディレクティブがあります。

この概念を理解するために、Webページのフッターとして機能する単純なユーザーコントロールを作成しましょう。 ユーザーコントロールを作成して使用するには、次の手順を実行します。

  • 新しいWebアプリケーションを作成します。
  • ソリューションエクスプローラーでプロジェクトフォルダーを右クリックし、[新しい項目の追加]を選択します。 新しいアイテムを追加
  • [新しいアイテムの追加]ダイアログボックスから[Webユーザーコントロール]を選択し、footer.ascxという名前を付けます。 最初、footer.ascxにはControlディレクティブのみが含まれています。
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="footer.ascx.cs"
   Inherits="customcontroldemo.footer" %>
  • ファイルに次のコードを追加します。
<table>
   <tr>
      <td align="center"> Copyright ©2010 TutorialPoints Ltd.</td>
   </tr>

   <tr>
      <td align="center"> Location: Hyderabad, A.P </td>
   </tr>
</table>

ユーザーコントロールをWebページに追加するには、Registerディレクティブとユーザーコントロールのインスタンスをページに追加する必要があります。 次のコードはコンテンツファイルを示しています。 

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="customcontroldemo._Default" %>

<%@ Register Src="~/footer.ascx" TagName="footer" TagPrefix="Tfooter" %>

<!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>
         Untitled Page
      </title>
   </head>

   <body>

      <form id="form1" runat="server">
         <div>

            <asp:Label ID="Label1" runat="server" Text="Welcome to ASP.Net Tutorials "></asp:Label>
            <br/>  <br/>
            <asp:Button ID="Button1" runat="server" onclick="Button1_Click"  Text="Copyright Info"/>

         </div>
         <Tfooter:footer ID="footer1" runat="server"/>
      </form>

   </body>
</html>

実行すると、ページにフッターが表示され、このコントロールはWebサイトのすべてのページで使用できます。

カスタム結果

次の点に注意してください。

（1） Registerディレクティブは、コントロールのタグ名とタグプレフィックスを指定します。 

<%@ Register Src="~/footer.ascx" TagName="footer" TagPrefix="Tfooter" %>
  • （2）*ページにユーザーコントロールを追加する際には、次のタグ名とプレフィックスを使用する必要があります。
<Tfooter:footer ID="footer1" runat="server"/>

カスタムコントロール

カスタムコントロールは、個別のアセンブリとして展開されます。 これらはダイナミックリンクライブラリ（DLL）にコンパイルされ、他のASP.NETサーバーコントロールとして使用されます。 次のいずれかの方法で作成できます。

  • 既存のコントロールからカスタムコントロールを派生させることにより
  • 2つ以上の既存のコントロールを組み合わせた新しいカスタムコントロールを作成する。
  • 基本コントロールクラスから派生します。

概念を理解するために、カスタムコントロールを作成して、ブラウザにテキストメッセージを表示するだけにします。 このコントロールを作成するには、次の手順を実行します。

新しいWebサイトを作成します。 ソリューションエクスプローラーのツリーの上部にあるソリューション（プロジェクトではなく）を右クリックします。

ソリューションエクスプローラー

[新しいプロジェクト]ダイアログボックスで、プロジェクトテンプレートから[ASP.NETサーバーコントロール]を選択します。

プロジェクトテンプレート

上記の手順では、新しいプロジェクトを追加し、ServerControl1という完全なカスタムコントロールをソリューションに作成します。 この例では、プロジェクトにCustomControlsという名前を付けます。 このコントロールを使用するには、ページに登録する前に、これをWebサイトへの参照として追加する必要があります。 既存のプロジェクトへの参照を追加するには、プロジェクト（ソリューションではなく）を右クリックし、[参照の追加]をクリックします。

[参照の追加]ダイアログボックスの[プロジェクト]タブからCustomControlsプロジェクトを選択します。 ソリューションエクスプローラーに参照が表示されます。

カスタムコントロール

ページでコントロールを使用するには、@ Pageディレクティブのすぐ下にRegisterディレクティブを追加します。 

<%@ Register Assembly="CustomControls"  Namespace="CustomControls"  TagPrefix="ccs" %>

さらに、他のコントロールと同様に、コントロールを使用できます。 

<form id="form1" runat="server">
   <div>
      <ccs:ServerControl1 runat="server" Text = "I am a Custom Server Control"/>
   </div>
</form>

実行すると、次のようにコントロールのTextプロパティがブラウザーにレンダリングされます。

カスタムサーバーコントロール

カスタムコントロールの使用

前の例では、カスタムコントロールのTextプロパティの値が設定されていました。 コントロールが作成されたときに、ASP.NETはデフォルトでこのプロパティを追加しました。 コントロールのファイルの背後にある次のコードはこれを明らかにしています。 

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;

using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace CustomControls
{
   [DefaultProperty("Text")]
   [ToolboxData("<{0}:ServerControl1 runat=server></{0}:ServerControl1 >")]

   public class ServerControl1 : WebControl
   {
      [Bindable(true)]
      [Category("Appearance")]
      [DefaultValue("")]
      [Localizable(true)]

      public string Text
      {
         get
         {
            String s = (String)ViewState["Text"];
            return ((s == null) ? "[" + this.ID + "]" : s);
         }

         set
         {
            ViewState["Text"] = value;
         }
      }

      protected override void RenderContents(HtmlTextWriter output)
      {
         output.Write(Text);
      }
   }
}

上記のコードは、カスタムコントロールに対して自動的に生成されます。 イベントとメソッドをカスタムコントロールクラスに追加できます。

例

SeverControl1という名前の以前のカスタムコントロールを展開します。 それに回文をチェックする権限を与えるcheckpalindromeという名前のメソッドを与えましょう。

回文とは、逆にすると同じスペルになる単語/リテラル​​です。 たとえば、マラヤーラム語、マダム、サラスなど。

カスタムコントロールのコードを拡張します。次のようになります。 

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Linq;
using System.Text;

using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace CustomControls
{
   [DefaultProperty("Text")]
   [ToolboxData("<{0}:ServerControl1 runat=server></{0}:ServerControl1  >")]

   public class ServerControl1 : WebControl
   {
      [Bindable(true)]
      [Category("Appearance")]
      [DefaultValue("")]
      [Localizable(true)]

      public string Text
      {
         get
         {
            String s = (String)ViewState["Text"];
            return ((s == null) ? "[" + this.ID + "]" : s);
         }

         set
         {
            ViewState["Text"] = value;
         }
      }

      protected override void RenderContents(HtmlTextWriter output)
      {
         if (this.checkpanlindrome())
         {
            output.Write("This is a palindrome: <br/>");
            output.Write("<FONT size=5 color=Blue>");
            output.Write("<B>");
            output.Write(Text);
            output.Write("</B>");
            output.Write("</FONT>");
         }
         else
         {
            output.Write("This is not a palindrome: <br/>");
            output.Write("<FONT size=5 color=red>");
            output.Write("<B>");
            output.Write(Text);
            output.Write("</B>");
            output.Write("</FONT>");
         }
      }

      protected bool checkpanlindrome()
      {
         if (this.Text != null)
         {
            String str = this.Text;
            String strtoupper = Text.ToUpper();
            char[] rev = strtoupper.ToCharArray();
            Array.Reverse(rev);
            String strrev = new String(rev);

            if (strtoupper == strrev)
            {
               return true;
            }
            else
            {
               return false;
            }
         }
         else
         {
            return false;
         }
      }
   }
}

コントロールのコードを変更する場合は、[ビルド]→ [ソリューションのビルド]をクリックしてソリューションをビルドし、変更がプロジェクトに反映されるようにする必要があります。 テキストボックスとボタンコントロールをページに追加して、ユーザーがテキストを提供できるようにします。ボタンをクリックすると、回文がチェックされます。 

<form id="form1" runat="server">
   <div>
      Enter a word:
      <br/>
      <asp:TextBox ID="TextBox1" runat="server" style="width:198px"> </asp:TextBox>

      <br/> <br/>

      <asp:Button ID="Button1" runat="server onclick="Button1_Click" Text="Check Palindrome" style="width:132px"/>

      <br/> <br/>

      <ccs:ServerControl1 ID="ServerControl11" runat="server" Text = ""/>
   </div>
</form>

ボタンのClickイベントハンドラーは、テキストをテキストボックスからカスタムコントロールのテキストプロパティに単にコピーします。 

protected void Button1_Click(object sender, EventArgs e)
{
   this.ServerControl11.Text = this.TextBox1.Text;
}

実行すると、コントロールは回文を正常にチェックします。

palindromesをチェック

次の点に注意してください。

  • （1）*カスタムコントロールに参照を追加すると、それがツールボックスに追加され、他のコントロールと同様にツールボックスから直接使用できます。

カスタムコントロールリファレンス

  • （2）*カスタムコントロールクラスのRenderContentsメソッドは、独自のメソッドとイベントを追加できるため、ここでオーバーライドされます。

（3） RenderContentsメソッドは、ブラウザーでのレンダリングを担当するHtmlTextWriter型のパラメーターを受け取ります。

「https://www.finddevguides.com/index.php?title=Asp.net-custom-controls&oldid=22484」から取得
Powered by MediaWiki