モバイルページのカスタムフィールドレンダリングコントロールを作成する

[アーティクル]
06/15/2015

最終更新日: 2011年2月2日

適用対象: SharePoint Foundation 2010

このチュートリアルでは、RenderingTemplate オブジェクトと一緒にカスタムフィールドレンダリングコントロールを実装することにより、モバイルページでフィールドレンダリングをカスタマイズする方法について説明します。サンプルの手順では、モバイル表示アイテム、新規作成アイテム、編集アイテムの各ページに表示される Announcements リストのアイテムの Title フィールドをカスタマイズする方法について示します。カスタマイズは、次の 3 種類のページそれぞれにおいて異なります。

表示フォーム - 検索リンクを追加します。ユーザーはここから Bing を使用して、インターネットでお知らせタイトルを検索できます。
編集フォーム - Expires 列の値が現在の日付より前であるときは、既定のテキストを追加します。
新規作成フォーム - 値の特定の形式をユーザーに表示する既定のテキストを追加します。

モバイルページのフィールドをカスタマイズする際の手順の概要については、「[方法] モバイルページでフィールドレンダリングをカスタマイズする」を参照してください。

前提条件

少なくとも次のどちらかの操作を行います。

アセンブリの完全な名前を取得するツールを作成し、Microsoft Visual Studio の [ツール] メニューに追加する。詳細については、「[方法] アセンブリの完全な名前を取得するツールを作成する」を参照してください。
アセンブリの公開キーを取得するツールを作成し、Visual Studio の [ツール] メニューに追加する。詳細については、「[方法] アセンブリの公開キーを取得するツールを作成する」を参照してください。

推奨: 「[チュートリアル] モバイルフォームのアイテムのタイトルをカスタマイズする」に記載されているチュートリアルを完了します。

カスタムフィールドプロジェクトをセットアップするには

Visual Studio で、空の SharePoint プロジェクトを作成し、そのプロジェクトをサンドボックスソリューションではなくファームソリューションにして、MobileItemTitleField という名前を付けます。
ソリューションエクスプローラーでプロジェクト名を右クリックし、[プロパティ] を選択します。
[プロパティ] ダイアログボックスの [アプリケーション] タブで、[アセンブリ名] に「Contoso.SharePoint.MobileControls.ItemTitleField」、[既定の名前空間] に「Contoso.SharePoint.MobileControls」と入力します。[対象とする Framework] は .NET Framework 3.5 のままにしておきます。
Visual Studio の [標準メニュー] の [ソリューションプラットフォーム] ボックスに "Any CPU" または "x64" と表示されていない場合は、[ビルド] タブを開いて、[プラットフォームターゲット] を "Any CPU" または "x64" のどちらかに設定します。この選択については、「[方法] 適切なターゲットフレームワークおよび CPU を設定する」を参照してください。
ツールバーの [すべてを保存] ボタンをクリックします。
ソリューションエクスプローラーでプロジェクトを右クリックし、[追加] をポイントして、[新しいアイテム] を選択します。
[新しいアイテムの追加] ダイアログボックスの [インストールされているテンプレート] ツリーで、[Visual C#] を選択し、[コード] を選択します。
[テンプレート] ボックスで [クラス] を選択し、[名前] ボックスに「ItemTitleField.cs」と入力して、[追加] をクリックします。
ソリューションエクスプローラーで [参照設定] ノードを右クリックし、[参照の追加] をクリックします。[参照の追加] ダイアログボックスの [.NET] タブで、Ctrl キーを押しながら [System.Web] と [System.Web.Mobile] を選択します。[OK] をクリックします。
ソリューションエクスプローラーでプロジェクト名を右クリックし、[追加] をポイントして、[SharePoint のマップされたフォルダー] を選択します。
表示されたツリーコントロールを使用してフォルダーを TEMPLATE\ControlTemplates にマップし、[OK] をクリックします。
ソリューションエクスプローラーで、プロジェクト名ではなく [ControlTemplates] フォルダーを右クリックし、[追加] をポイントして、[新しいアイテム] を選択します。
[新しいアイテムの追加] ダイアログボックスの [インストールされているテンプレート] ツリーで、[SharePoint] を選択し、[2010] を選択します。

[テンプレート] ボックスで SharePoint の [ユーザーコントロール] を選択し, .ascx ファイルに「AnnouncementsItemTitleField.ascx」という名前を付けて、[追加] をクリックします。Visual Studio によって、ファイルが自動的に SharePoint ソリューションマニフェストに追加され、%ProgramFiles%\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\ControlTemplates に展開されるように設定されます。また、アセンブリがマニフェストに追加され、グローバルアセンブリキャッシュ (GAC) に展開されるように設定されます。

ヒント
ソリューションエクスプローラーでプロジェクト名を右クリックしてユーザーコントロールを追加しないでください。この方法でユーザーコントロールを追加すると、Visual Studio は、そのコントロールを TEMPLATE\ControlTemplates のサブフォルダーに追加します。その後、Visual Studio は、移動されなかったコントロールを、%ProgramFiles%\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\ControlTemplates の対応するサブフォルダーに展開します。サブフォルダー内のモバイル版のレンダリングテンプレートは読み込まれません。

ソリューションエクスプローラーでプロジェクト名を右クリックしてユーザーコントロールを追加しないでください。この方法でユーザーコントロールを追加すると、Visual Studio は、そのコントロールを TEMPLATE\ControlTemplates のサブフォルダーに追加します。その後、Visual Studio は、移動されなかったコントロールを、%ProgramFiles%\Common Files\Microsoft Shared\web server extensions\14\TEMPLATE\ControlTemplates の対応するサブフォルダーに展開します。サブフォルダー内のモバイル版のレンダリングテンプレートは読み込まれません。

AnnouncementsItemTitleField.ascx ファイルの下に自動的に作成された AnnouncementsItemTitleField.ascx.cs および AnnouncementsItemTitleField.ascx.designer.cs ファイルを削除します。これらのファイルはこのプロジェクトでは必要ありません。AnnouncementsItemTitleField.ascx の既定のコンテンツは、削除した AnnouncementsItemTitleField.ascx.cs ファイルを参照するので、ファイルが見つからないことを示す警告がコンパイラによって表示されます。既定のコンテンツはこのトピックの後の手順で変更するので、この警告は無視してください。

レンダリングコントロールを作成するには

プロジェクトの ItemTitleField.cs ファイルがまだ開いていない場合は開き、次の using ステートメントを追加します。
```
using System.Web.UI.MobileControls;
using Microsoft.SharePoint;
using Microsoft.SharePoint.MobileControls;
```
public アクセス修飾子を ItemTitleField 宣言に追加し (このアクセス修飾子がない場合)、宣言を変更して、SPMobileBaseTextField から継承することを指定します。
```
public class ItemTitleField : SPMobileBaseTextField
{

}
```

CreateControlForDisplay() メソッドの次のオーバーライドを追加します。

protected override MobileControl CreateControlForDisplay()
{
   string title = Convert.ToString(this.ItemFieldValue);
   if (!String.IsNullOrEmpty(title))
   {
      this.LabelControl.BreakAfter = false;
      this.LabelControl.Text = title + " ";

      this.LinkControl.BreakAfter = false;
      this.LinkControl.Text = "Search";
      this.LinkControl.href = "https://www.bing.com/search?q=" + title.Replace(' ', '+');

      Panel panel = new Panel();
      panel.BreakAfter = false;
      panel.Controls.Add(this.LabelControl);
      panel.Controls.Add(this.LinkControl);

      return panel;
   }
   return null;
}

現在のリストアイテムの [タイトル] フィールドの現在の値を取得することで、このメソッドが開始されることに注意してください。現在の値は、ItemFieldValue プロパティに格納されています。

CreateControlForNew メソッドの次のオーバーライドを追加します。

protected override MobileControl CreateControlForNew()
{
   MobileControl myNewControl = null;
   if (this.Field != null)
   {
      string text = "Group: Project Name";
      if (!this.Page.IsPostBack)
      {
         this.TextBoxControl.Text = text;
      }
      myNewControl = this.TextBoxControl;
   }
   return myNewControl;
}

CreateControlForEdit メソッドの次のオーバーライドを追加します。

protected override MobileControl CreateControlForEdit()
{
   MobileControl myEditControl = null;
   if (this.Item != null && this.Field != null)
   {
      if (this.NeedEllipsisRendering)
      {
         myEditControl = this.CreateControlForDisplay();
      }
      else
      {
         if (!this.Page.IsPostBack)
         {
            string strEdit = this.Field.GetFieldValueForEdit(this.ItemFieldValue);
            string overDue = "OVERDUE: ";

            SPListItem item = this.ListItem;
            if (item["Expires"] != null)
            {
               System.DateTime date = (DateTime)item["Expires"];
               if (date.CompareTo(System.DateTime.Today) < 0)
               {
                  this.TextBoxControl.Text = overDue + strEdit;
               }
               else
               {
                  this.TextBoxControl.Text = strEdit;
               }
            }
         }
         myEditControl = this.TextBoxControl;
      }
   }
   return myEditControl;
}

レンダリングテンプレートを作成するには

AnnouncementsItemTitleField.ascx ファイルを開き、ディレクティブセクション全体を次のマークアップで置き換えます。

<%@ Register TagPrefix="GroupBoardMobile"   Namespace="Microsoft.SharePoint.Applications.GroupBoard.MobileControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Control Language="C#"   %> 
<%@ Assembly Name="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 
<%@ Register TagPrefix="mobile" Namespace="System.Web.UI.MobileControls" Assembly="System.Web.Mobile, Version=1.0.3300.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a" %> 
<%@ Register TagPrefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 
<%@ Register TagPrefix="SPMobile" Namespace="Microsoft.SharePoint.MobileControls" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 
<%@ Register TagPrefix="WPMobile" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=14.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>

次のコードを使用して、タグプレフィックス登録を追加します。
```
<%@ Register TagPrefix="Contoso" Namespace="Contoso.SharePoint.MobileControls" Assembly="$SharePoint.Project.AssemblyFullName$" %> 
```
プロジェクトの構築時に、Visual Studio のトークン $SharePoint.Project.AssemblyFullName$ が、4 つの部分で構成されるアセンブリ名に置き換えられます。
Microsoft.SharePoint 名前空間の Import ディレクティブを追加します。
```
<%@ Import Namespace="Microsoft.SharePoint" %>
```
ディレクティブの下に RenderingTemplate を追加し、これに、ランタイムが検索する ID (MobileCustomListField_Announcements_Text_Title) を指定します。
```
<SharePoint:RenderingTemplate RunAt="Server" ID="MobileCustomListField_Announcements_Text_Title" >

</SharePoint:RenderingTemplate>
```
RenderingTemplate 要素内で、カスタマイズされた ItemTitleField オブジェクトを子コントロールとして持っている Template 要素を定義します。
```
<Template>
  <Contoso:ItemTitleField RunAt="Server" />
</Template>
```
このファイルが、「[チュートリアル] モバイルフォームのアイテムのタイトルをカスタマイズする」で作成したファイルとほぼ一致することに注目してください。違いは以下のとおりです。
- "Contoso" タグプレフィックスを登録するために新しい Register ディレクティブが追加されています。
- Microsoft.SharePoint 名前空間をインポートする行が追加されています。
- 次の行が [チュートリアル] モバイルフォームのアイテムのタイトルをカスタマイズするに存在します。
  
  <mobile:Label Text="Title field in Announcements List" RunAt="Server" />
  
  この行が、このトピックのコード例では以下の行で置き換えられています。
  
  <Contoso:ItemTitleField RunAt="Server" />
  
  これにより、レンダリングテンプレートが、このチュートリアルの前半で作成したフィールドレンダリングコントロールを呼び出すことができます。
[ビルド] メニューで [ソリューションの展開] を選択します。これにより、アセンブリが自動的にリビルドされ, .ascx ファイルが保存されます。また、アセンブリはグローバルアセンブリキャッシュに展開され, .ascx ファイルは %ProgramFiles%\Common Files\Microsoft Shared\web server extensions\14\TEMPLATES\ControlTemplates に展開されて、Web アプリケーションが再利用されます。

レンダリングコントロールのテスト

モバイルデバイスまたはエミュレーターを使用して、Web アプリケーション内のお知らせリストを含む Web サイトにアクセスします。お知らせリストにアクセスします。[新しいアイテム] リンクをクリックします。図 1 のように表示されます。

図 1. 新しいフォームの [タイトル] フィールドに対して指定した既定のテキスト

カスタマイズされたモバイルの新規アイテムフォーム

新しいアイテムを作成し、そのアイテムに過去の日付の Expires 値を設定します。[保存] をクリックします。これにより、リストビューに戻ります。クリックして新しいアイテムを表示します。図 2 のように表示されます。[検索] リンクがタイトルの最後に追加されています。

図 2. [表示] フォームに追加された [検索] リンク

カスタマイズされたモバイルのアイテム表示フォーム

[編集] リンクをクリックします。図 3 のように表示されます。"期限日" が現在のタイトルに追加されています。

図 3. [編集] フォームの [タイトル] フィールドにおけるテキストの条件付きレンダリング

カスタマイズされたモバイルのアイテム編集フォーム

次の方法で共有

モバイルページのカスタムフィールドレンダリングコントロールを作成する

前提条件

カスタムフィールドプロジェクトをセットアップするには

レンダリングコントロールを作成するには

レンダリングテンプレートを作成するには

レンダリングコントロールのテスト

関連項目

タスク

概念

その他のリソース

次の方法で共有

モバイル ページのカスタム フィールド レンダリング コントロールを作成する

前提条件

カスタム フィールド プロジェクトをセットアップするには

レンダリング コントロールを作成するには

レンダリング テンプレートを作成するには

レンダリング コントロールのテスト

関連項目

タスク

概念

その他のリソース

モバイルページのカスタムフィールドレンダリングコントロールを作成する

カスタムフィールドプロジェクトをセットアップするには

レンダリングコントロールを作成するには

レンダリングテンプレートを作成するには

レンダリングコントロールのテスト