ImageKit コントロールは Web アプリケーションにイメージを表示する便利なインターフェイスを提供します。表示形式として、「実寸」、「スケール」、「ストレッチ」があります。さまざまなイメージ形式で表示でき、ブラウザでサポートされていないイメージは自動変換できるので Web ページにきちんと表示されます。ブラウザの違いや同じブラウザでもバージョンが違うせいで、ImageKit コントロールを使用する上での注意点がいくつかあります。以下の手順に従えば、使用するブラウザに関係なくイメージを読込/表示できます。

では、ImageKit コントロールを使用する際の注意点を説明します。

ImageKit.Web ImageKit コントロールの使用

ImageKit コントロールを使用する際の手順は次の通りです。

1. ツールボックスに ImageKit コントロールを追加する

ImageKit のインストーラが自動的にツールボックスに ImageKit のコントロールを追加します。手動で追加する場合は以下を行います。

   1. ツールボックスでマウスを右クリックし、「タブの追加」を選択する。
   2. 新しいタブに名前を付けたら、そのタブを右クリックし、「アイテムの選択」を選択する。
   3. 「参照」ボタンをクリックし、「Newtone.ImageKit.Web.ImageKit.dll」 を選択する。
   4. 「OK」 ボタンをクリックする。

Web フォーム用の ImageKit コントロールと PanWindow コントロールがツールボックスに追加されます。

2. フォームに ImageKit コントロールを貼り付ける

マウスで Web フォームに ImageKit コントロールをドラッグすると、左上端に ImageKit コントロールがデフォルトサイズで表示されます。ImageKit コントロールのサイズ/位置を変える前に、ImageKit コントロールの位置を絶対値に設定します。お使いの Visual Studio のバージョンによって多少手順が異なります。ImageKit コントロールの位置を手動で絶対値に設定するには、html のソースを開き、ImageKit コントロールのタグの Style に "position: absolute;" を入力してください。

<cc1:ImageKit ID="ImageKit1" runat="server" style="position: absolute;" />

位置を絶対値に設定したら、Web フォームの ImageKit コントロールのサイズや位置を設定できます。

3. Http ハンドラの設定

ImageKit コントロールは、ブラウザにイメージをストリーム転送します。ストリーム転送を有効にするには、http ハンドラを設定しなければなりません。方法は２つあります。１つは、Web アプリケーションの web.config ファイルに http ハンドラを設定することです。もう１つは、Web プロジェクトに IkStream.ashx ファイルを追加することです。

Web.Config ファイルを使用する場合：

VS2010 およびそれ以前のバージョンの web.config ファイルに使用するコード：

<system.web>

     <httpHandlers>

          <add verb="*" path="IkStream.ashx" type="Newtone.ImageKit.Web.IkStream" />

     </httpHandlers>

</system.web>

VS2012 およびそれ以降のバージョンの web.config ファイルに使用するコード：
<system.webServer>

     <handlers>

          <add verb="*" path="IkStream.ashx" name="IkStream" type="Newtone.ImageKit.Web.IkStream" />

     </handlers>

</system.webServer>

IkStream.ashx ファイルを使用する場合：

web.config ファイルに http ハンドラを追加する代わりに、http ハンドラをファイルとして追加することができます。ImageKit には IkStream.ashx という http ハンドラのファイルが同梱されているので、このファイルを Web アプリケーションのディレクトリにコピーし、それを Visual Studio のプロジェクトに追加するだけです。これは、ソリューションエクスプローラを右クリックし、[追加] -> [既存の項目] を選択し、IkStream.ashx ファイルを参照することで行えます。

IkStream.ashx ファイルは、ImageKit のインストール ディレクトリの 「System」 フォルダにあります。

4. イメージの読込/表示コードの設定

下記は、TIF ファイルをサーバーからクライアントのブラウザにストリーム転送する、Page_Load イベントのコード例です。

[Visual Basic]
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
     ImageKit1.Url = "abc.tif"
     ImageKit1.LoadImageFromFile()
     ImageKit1.DisplayMode = Newtone.ImageKit.Web.DisplayMode.Scale
     ImageKit1.Display()
End Sub

[C#]
private void Page_Load(object sender, System.EventArgs e)
{
     ImageKit1.Url="abc.tif";
     ImageKit1.LoadImageFromFile();
     ImageKit1.DisplayMode = Newtone.ImageKit.Web.DisplayMode.Scale;
     ImageKit1.Display();
}

読み込むイメージは必ず Web アプリケーションに配置してください。つまり、読み込むイメージが Web アプリケーションのルートフォルダか、Web アプリケーションがアクセス可能なサブフォルダになくてはならない、ということです。イメージのパスは、ImageKit1.Url プロパティで設定します。上記の場合、イメージはルートディレクトリにあるので、相対的な仮想パスはイメージのファイル名だけです。
注意：Url プロパティは、Web アプリケーションの仮想パスで設定しなければなりません（物理パスでの設定不可）。詳しくは、Url プロパティを参照してください。

 

ImageKit メンバ | Newtone.ImageKit.Web.ImageKit