ヘッダーとアニメーション
WebImageViewerコントロールのプロパティウィンドウにある「Header」を展開し、「Text」にタイトル文字列を設定し、VisibleプロパティをTrueにします。これで、ウィンドウ上部にタイトルを表示できます。
また、画像のリストは、ウィンドウタイトル右にあるナビゲーションボタンをクリックするか、画像をマウスでドラッグすると、水平方向にスクロールしていきます。
このスクロールのアニメーションは、デフォルトでは「Continuous」という設定になっており、連続して画像がスクロールするアニメーションになっています。アニメーションの動作は、他に「NextItem」と「Page」の2種類があり、画像を少しずつ1枚単位で送るアニメーションや、1枚ずつ表示していくアニメーションに切り替えることができます。
それぞれ、画像の整列方法やアニメーションの速度を設定することができ、これらはプロパティウィンドウの「ScrollAnimations」を展開して表示されるプロパティを使用して設定します。
WebImageViewerコントロールの向きの変更とコードからの画像の設定
WebImageViewerコントロールのOrientationプロパティを「Vertical」に設定すると、縦にスクロールするWebImageViewerコントロールを使うことができます。
また、画像の組み込みを「Edit Image Items」ダイアログを使わずに、コードから行うこともできます。
ここでは、WebImageViewerコントロールをもう1つ配置し、ここにWebサイトのサブディレクトリ「images2」にあるすべての画像ファイルをWebImageViewerコントロールに組み込み、「NavigateUrl」プロパティに画像ファイルへのURLを設定します。
（1）画像ファイル名のリストの作成
まず、画像のファイル名リストを作成します。これは、System.IO.DirectoryクラスのGetFilesメソッドを使用します。このメソッドは、引数に指定したフォルダ内のすべてのファイル名を一括で取得できます。ただし、引数に指定するパス名はWebサーバの仮想ディレクトリではなく、ファイルシステムのフルパスを指定します。
ここでは、ドライブJの「\_GENKOU\インフラジスティックス\ NetAdvance2008_AJAXEnabledWebSite\Website_vb\images2」に、Webサーバの仮想ディレクトリが設定されていますので、これを指定しています。
GetFilesメソッドはファイル名をString型の配列で返してきますので、変数に受取って置きます。
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load If Me.IsPostBack Then Return ' 画像のリストを取得します Dim imgs() As String = _ System.IO.Directory.GetFiles("J:\_GENKOU\インフラジスティックス\ NetAdvance2008_AJAXEnabledWebSite\Website_vb\images2", "*.*")
protected void Page_Load(object sender, EventArgs e)
{
if (this.IsPostBack) return;
// 画像のリストを取得します
string[] imgs =
System.IO.Directory.GetFiles("J:/_GENKOU/インフラジスティックス/
NetAdvance2008_AJAXEnabledWebSite/Website_cs/images2", "*.*");
（2）画像ファイルへのURLを生成
次に、このファイル名を使って、ImageItemオブジェクトを作成し、WebImageViewerコントロールに追加していきます。この操作は、For Each（foreach）ステートメントを使い、ファイル名の配列の要素すべてに対して繰り返し行っていきます。
まず、GetFileNameメソッドをファイル名の配列に対して実行し、パス名を除くファイル名だけを取得します。
次に、ImageItemクラスのコンストラクタを使用して、インスタンスを作成します。コンストラクタの引数は3つで、最初の引数で画像ファイルへのパス名を仮想ディレクトリのURLで指定します。そのために、次のようなURL文字列を作成します。
For Each img As String In imgs Dim theFile As String = "~/images2/" + System.IO.Path.GetFileName(img)
foreach (string img in imgs)
{
string theFile = "~/images2/" + System.IO.Path.GetFileName(img);
（3）ImageItemオブジェクトの作成とWebImageViewerへの追加
このURLを元に、ImageItemクラスのコンストラクタを実行します。残りの引数は、代替テキストとツールヒントを設定します。
ImageItemオブジェクトが作成できたら、NavigateUrlプロパティに画像ファイルへのURLを設定します。ここでも、NavigateUrlプロパティではURLの先頭に「~/」を付けないでください。
最後に、WebImageViewerコントロールのImageItemCollectionクラスのaddメソッドで、このコレクションにImageItemオブジェクトを追加して出来上がりです。
Dim pict As Infragistics.Web.UI.ListControls.ImageItem
pict = New Infragistics.Web.UI.ListControls.ImageItem(theFile, "", System.IO.Path.GetFileName(img))
pict.NavigateUrl = "images2/" + System.IO.Path.GetFileName(img)
Me.WebImageViewer2.Items.Add(pict)
Next
End Sub
Infragistics.Web.UI.ListControls.ImageItem pict;
pict = new Infragistics.Web.UI.ListControls.ImageItem(theFile, "", System.IO.Path.GetFileName(img));
pict.NavigateUrl = "images2/" + System.IO.Path.GetFileName(img);
this.WebImageViewer2.Items.Add(pict);
}
}
