SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

ComponentZine(ComponentOne)

ファイルを開くダイアログを持ったSilverlightアプリケーションの作成

ComponentOne Studio for SilverlightのC1FilePickerコントロールを使ったWebページの作成

  • このエントリーをはてなブックマークに追加

 ComponentOne Studio for Silverlightに収録されているC1FilePickerコントロールを使えば、Silverlightアプリケーションで、Windowsアプリの「ファイルを開くダイアログボックス」と同様の機能を持ったダイアログをポップアップさせ、ユーザーにファイルを選択してもらうことができます。今回は、このC1FilePickerコントロールを使って、テキストファイルとイメージ画像ファイルを選んで表示できるWebページを作成してみました。

  • このエントリーをはてなブックマークに追加

はじめに

 Windowsアプリケーションでおなじみの「ファイルを開く」ダイアログボックスは、ファイル操作になくてはならないダイアログボックスです。これがWebページで使えたら便利ですよね。

 ComponentOne Studio for Silverlightに収録されているFilePicker for Silverlightを使えば、Silverlightで「ファイルを開く」ダイアログボックスと同様の機能を持ったダイアログをポップアップさせ、ユーザーにファイルを選択してもらうことができます。今回は、このC1FilePickerコントロールを使って、テキストファイルとイメージ画像ファイルを選んで表示できるWebページを作成してみました。

Webページ上で「ファイルを開く」ダイアログボックスを表示し、UTF-8フォーマットのテキストファイルを読み込んで表示する
Webページ上で「ファイルを開く」ダイアログボックスを表示し、UTF-8フォーマットのテキストファイルを読み込んで表示する
イメージ画像を選び、リストボックスに組み込む
イメージ画像を選び、リストボックスに組み込む

対象読者

 Visual Basic/Visual C# 2008を使ってプログラムを作ったことのある人。また、SilverlightおよびXAMLに対する基礎的な知識が必要になります。

必要な環境

 Visual Basic 2008、Visual C# 2008、Visual Studio 2008でプログラムが作れる環境。また、Visual Studio 2008 Silverlight Tools 3.0をインストールしていることが必須条件です。

 なお、本プログラムはWindows Vista上で動作するVisual Studio 2008およびVisual Studio 2008 Silverlight Tools 3.0を使用して作成し、Internet Explorer 8で動作確認を行っています。

コンポーネントのインストール

 FilePicker for Silverlightを使用する方は、Visual Studio、Visual Basic、Visual C#の開発環境にComponentOne Studio Enterprise 2010Jをインストールする必要があります。

 インストーラは、グレープシティのWebページからダウンロードできます。製品ページの[申込フォーム]をクリックし、グレープシティのWebサイトへ必要情報を登録すると、添付トライアルライセンスキーファイルとダウンロードサイトを記載したE-Mailが送られてきますので、ここからダウンロードします。制限事項などの詳細については、インストーラに同梱されているリリースノートを参照ください。

FilePicker for SilverlightのC1FilePickerコントロールについて

 C1FilePickerコントロールは、Silverlightアプリケーションに「ファイルを開く」ダイアログボックスを実装できるコントロールです。Windowsフォームで使われる「ファイルを開く」ダイアログボックスとほぼ同様の機能を持ち、選択したファイルをそのままWebページでアップロードすることができます。

 ダイアログボックスにはファイルの拡張子やカテゴリといったフィルタータイプを設定でき、設定書式もWindowsフォームの「ファイルを開く」ダイアログボックスと同じように記述します。

 XAMLでは、C1FilePickerコントロールの配置、外観形状、フィルターの設定を行い、選択したファイルの取得はコードビハインドで行います。ユーザーがファイルを選択すると、C1FilePickerコントロールには「SelectedFilesChanged」というイベントが発生し、「SelectedFile」プロパティで選択したファイルを「FileInfo」クラス(System.IO 名前空間)のオブジェクトとして取得します。

 C1FilePickerコントロールは、右側にダイアログボックスを表示するボタンがあり、コントロール起動時は左側にウォーターマークが表示されています。このウォーターマークの部分は、ファイルが選択されるとそのファイル名に表示が変わります。

C1FilePickerコントロールの形状
C1FilePickerコントロールの形状

 ファイルは、デフォルトでは単一の選択状態になっていますが、Multiselectプロパティを使って一度に複数のファイルを選択できるように設定することもできます。

複数選択状態の「ファイルを開く」ダイアログボックス
複数選択状態の「ファイルを開く」ダイアログボックス

次のページ
Webページの作成

この記事は参考になりましたか?

  • このエントリーをはてなブックマークに追加
ComponentZine(ComponentOne)連載記事一覧

もっと読む

この記事の著者

瀬戸 遥(セト ハルカ)

8ビットコンピュータの時代からBASICを使い、C言語を独習で学びWindows 3.1のフリーソフトを作成、NiftyServeのフォーラムなどで配布。Excel VBAとVisual Basic関連の解説書を中心に現在まで40冊以上の書籍を出版。近著に、「ExcelユーザーのためのAccess再...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/5663 2010/12/27 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング