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

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

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

表示フォーム - 検索リンクを追加します。ユーザーはここから MSN ニュースの検索結果ページに移動できます。
編集フォーム - Expires 列の値が現在の日付より前であるときは、既定のテキストを追加します。
新規作成フォーム - 値の特定の形式をユーザーに表示する既定のテキストを追加します。

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

前提条件

「[ウォークスルー] モバイルフィールドのレンダリングをカスタマイズする」の完了。

カスタムフィールドレンダリングコントロールの開発準備

Visual Studio で、[ツール] メニューから [外部ツール] を選択します。
[外部ツール] ダイアログで、[追加] をクリックし、[タイトル] に「アセンブリの公開キーを取得する」と入力します。
sn.exe を参照し、[コマンド] テキストボックスに入力します。通常は、C:\Program Files\Microsoft Visual Studio 8\SDK\v2.0\Bin\sn.exe となります。
[引数] テキストボックスで、「-Tp "$(TargetPath)"」と入力します (大文字と小文字を区別)。
[出力ウィンドウを使用] チェックボックスをオンにします。
[OK] をクリックします。新しいコマンドが、[ツール] メニューに追加されます。

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

Visual Studio で、[ファイル] メニューから [新しいプロジェクト] を選択します。
[新しいプロジェクト] ダイアログボックスで、[プロジェクトの種類] ボックスに [Visual C#]、[テンプレート] ボックスに [クラスライブラリ] をそれぞれ選択し、次に [名前] ボックスで「ItemTitleField」と入力します。[OK]をクリックします。
[ソリューションエクスプローラ] で [参照設定] ノードを右クリックし、 [参照の追加] をクリックします。[参照の追加] ダイアログボックスの [.NET] タブで、Ctrl キーを押しながら [System.Web]、[System.Web.Mobile]、[Microsoft SharePoint Services] を選択します。 [OK] をクリックします。
[ソリューションエクスプローラ] でプロジェクト名を右クリックし、[プロパティ] を選択します。
[プロパティ] ダイアログの [アプリケーション] タブで、[アセンブリ名] に「自分の会社.SharePoint.MobileControls.ItemTitleField」、[既定の名前空間] に「自分の会社.SharePoint.MobileControls」と入力します。自分の会社を所属する会社名と置き換えます。 このウォークスルーを通じて、自分の会社を所属する会社名と置き換えます。
[署名] タブを開き、[アセンブリの署名] を選択します。
[厳密な名前のキーファイルを選択してください] ボックスの一覧の [<新規作成...>] をクリックします。
[厳密な名前キーの作成] ダイアログの [キーファイル] ボックスで「ItemTitleField.snk」と入力し、次に [保護...] チェックボックスがオフになっていることを確認します。[OK] をクリックします。[ビルドイベント] タブを開き、[ビルド後に実行するコマンドライン] ボックスに次を (下を) 入力します。このコードにより、プロジェクトを再構築する際は常に最新のバージョンのプロジェクトファイルが適切な場所にコピーされると共に、 Windows SharePoint Services 3.0 が再起動されるようになります。これにより、最新バージョンのアセンブリがロードされます。
```
cd "$(ProjectDir)"
"%programfiles%\microsoft visual studio 8\sdk\v2.0\bin\gacutil" /i "$(TargetPath)" /nologo /f
%systemroot%\system32\iisapp.vbs /a "SharePoint_App_Pool" /r
xcopy *.ascx "C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\CONTROLTEMPLATES\" /y
```
SharePoint_App_Pool を、ご使用の Windows SharePoint Services Web アプリケーションに割り当てられているインターネットインフォメーションサービス (IIS) アプリケーションプロトコルの実際の名前に置き換えます。この名前は通常、アプリケーションを保有する IIS Web サイト (例: "SharePoint - 80") と同じ名前となります。 (名前にスペースが含まれない場合は、引用符を省略できます。)
タブの他の有効なコントロールをクリックすると、Visual Studio で変更分が検出され、タブのラベルにアスタリスクが表示されます。
ツールバーの [すべてを保存] ボタンをクリックします。
[ソリューションエクスプローラ] でファイルの名前を Class1.cs から ItemTitleField.cs に変更します。

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

プロジェクトの ItemTitleField.cs ファイルがまだ開いていない場合は開き、次の using 文を追加します。
```
using System.Web.UI.MobileControls;
using Microsoft.SharePoint;
using Microsoft.SharePoint.MobileControls;
```
名前空間を自分の会社.SharePoint.MobileControls に変更します。
Class1 の宣言全体を以下のコードに置き換えます。
```
public class ItemTitleField : SPMobileBaseTextField
{

}// end ItemTitleField class
```
新しいクラスは、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.NavigateUrl = "https://search.msn.com/results.aspx?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;
}

[ビルド] メニューで [ビルド] を選択します。これで終わりではありません。ここでアセンブリをコンパイルする必要があります。これにより公開キートークンを生成することができます。

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

[ソリューションエクスプローラ] でプロジェクト名を右クリックし、「ItemTitleField」と入力して、[追加]、[新しいアイテム] の順に選択します。
[分類] ウィンドウで [Visual C# プロジェクトアイテム] を選択し、次に [テンプレート] ウィンドウで [テキストファイル] を選択します。
[名前] ボックスで「AnnouncementsItemTitleField.ascx」と入力し、[追加] をクリックします。 (プロジェクトフォルダのサブフォルダにファイルを配置しないでください。作成したビルド後のコマンドでこのファイルが検出されなくなります。)

作成した AnnouncementsItemTitleField.ascx ファイルに以下のマークアップを追加します。

<%@ Control Language="C#" %>
<%@ Assembly Name="Microsoft.SharePoint, Version=12.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=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> 
<%@ Register TagPrefix="SPMobile" Namespace="Microsoft.SharePoint.MobileControls" Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %>
<%@ Register TagPrefix="CustomMobile" Namespace="MyCompany.SharePoint.MobileControls" Assembly="MyCompany.SharePoint.MobileControls.ItemTitleField, Version=1.0.0.0, Culture=neutral, PublicKeyToken=Token" %> 
<%@ Import Namespace="Microsoft.SharePoint" %>

<SharePoint:RenderingTemplate RunAt="Server" ID="MobileCustomListField_Announcements_Text_Title" >
    <Template>
      <CustomMobile:ItemTitleField RunAt="Server" /> 
    </Template>
</SharePoint:RenderingTemplate>

両方の位置において、自分の会社を所属する会社名に置き換えます。
トークンを実際の公開キートークンと置き換えます。このトークンは、[ツール] メニューから [アセンブリ公開キーを取得する] をクリックすることによって取得します。このキートークンは、出力ウィンドウの最後の行に表示されます。キー全体ではなく token キーのみを使用します。

このファイルが、「[ウォークスルー] モバイルフィールドのレンダリングをカスタマイズする」で作成したファイルとほぼ一致することに注目してください。違いは以下のとおりです。
- 行
  
  <mobile:Label Text="Title field in Announcements List" RunAt="Server" />
  
  ([ウォークスルー] モバイルフィールドのレンダリングをカスタマイズする) は、
  
  このトピックのコード例で、以下の行で置き換えられています
  
  <CustomMobile:ItemTitleField RunAt="Server" />
  
  このため、レンダリングテンプレートでは、このウォークスルーの前半で作成したフィールドレンダリングコントロールが呼び出されます。
- 「CustomMobile」タグプレフィックスを登録するために新しいレジスタの命令が追加されています。
ファイルを保存して閉じます。
[ビルド] メニューで [リビルド] を選択します。

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

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

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

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

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

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

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

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

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

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

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

前提条件

カスタムフィールドレンダリングコントロールの開発準備

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

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

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

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

See Also

タスク

概念

その他のリソース

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

前提条件

カスタム フィールド レンダリング コントロールの開発準備

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

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

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

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

See Also

タスク

概念

その他のリソース

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

カスタムフィールドレンダリングコントロールの開発準備

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

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

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

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