★【 My Biz Blog 】★

興味のあるビジネス情報を伝えていきます♪
(IoT,Azure,Windows 10, etc...)

Silverlight for Windows Embedded でアプリを作る - 6 -

2009-12-31 10:00:00 | Windows Embedded関連
先日の記事では、作成したSilverlight for WEのサンプルアプリを

デバイスエミュレータ上で動作させてみました。

今回は、ボタンのクリックイベントハンドラ(クリックされた時の処理)を実装します。



手順は以下のような感じです。

・イベント処理用の関数をクラスのパブリックメンバとして作成する。
     ↓
・CreateDelegate関数を使用して、デリゲートを作成する。
     ↓
・ホストオブジェクトから、GetRootElement関数を使用して
 XAMLのルートエレメントを取得。
     ↓
・ルートエレメントから、イベント処理を実装したいオブジェクトを取得。
     ↓
・AddClickEventHandler関数により、イベント処理のデリゲートを
 オブジェクトに登録する。



コードと一緒に確認していきます。
※説明簡略化のため、エラー処理を省いていますので、
 お気を付けください。


①イベント処理用の関数を作成する。
 クラスを定義し、そのパブリックメンバ関数として、
 クリックイベントハンドラを実装します。

class CMyEventHandler
{
public:
  HRESULT Click(IXRDependencyObject* source,XRMouseButtonEventArgs* args)
  {
    return S_OK;
  }
}


 クリックイベントハンドラは関数の型が決まっています。
 戻り値はHRESULT型。
 引数として、IXRDependencyObject型ポインタと
 XRMouseButtonEventArgs型ポインタをとります。

 今回のサンプルアプリでは、
 ボタンをクリックしたら、ダイアログ(画面)を閉じるようにしようと
 思います。
 ダイアログを閉じるには、EndDialog関数を呼ぶ必要がありますが、
 この関数はIXRVisualHostクラスのメンバ関数なので、
 クラスにIXRVisualHostクラスのオブジェクトを保持する仕組みを作成します。

class CMyEventHandler
{
public:
  CMyEventHandler()
  {
    // メンバ変数を初期化
    m_pHostPtr = NULL;
  }

  HRESULT Click(IXRDependencyObject* source,XRMouseButtonEventArgs* args)
  {
    // ダイアログを閉じる
    m_pHostPtr->EndDialog(1);
    return S_OK;
  }

  SetHostPtr(IXRVisualHostPtr pHostPtr)
  {
    // ホストオブジェクトのアドレスを保存
    m_pHostPtr = pHostPtr;
  }
private:
  IXRVisualHostPtr m_pHostPtr;

};


 EndDialog関数を使用すると、ダイアログが閉じられ、
 ダイアログを表示開始する関数であるStartDialog関数から抜けてきます。

 その時、EndDialog関数の引数で指定した値が、
 StartDialog関数の引数で指定したバッファに格納されています。

 このサンプルソースでは、とりあえず1を渡していますが、
 特に意味はありません。


②デリゲートの作成
 先ほど作成したクラスのインスタンスを生成し、
 デリゲートを作成します。
 C#でのプログラミング経験がある方は、
 デリゲートをご存知だと思います。
 関数ポインタに近いイメージです。
 ここでは、マウス操作イベント用関数型 XRMouseButtonEventArgs型で
 デリゲートを作成します。
 WinMain関数でホストオブジェクトを生成後、
 以下のような処理を追加してください。

  CMyEventHandler objEventHandler;
  IXRDelegate<XRMouseButtonEventArgs>* pClickdelegate;

  CreateDelegate(&objEventHandler, &CMyEventHandler::Click, &pClickdelegate);


 これで、デリゲートオブジェクトが生成され、
 そのデリゲートにCMyEventHandlerクラスのClick関数が登録されました。


③XAMLのルートエレメントを取得。
 XAMLにより生成されたGUIの各要素にアクセスするための準備作業です。
 ホストオブジェクトのGetRootElement関数で、
 ルートエレメントオブジェクトを取得します。

  IXRFrameworkElementPtr pRoot;
  pHostPtr->GetRootElement(&pRoot);

 GUIの各要素にアクセスするには、
 さらにこのルートエレメントから各要素のオブジェクトを取得します。


④イベント処理を実装したいオブジェクトを取得。
 「Silverlight for Windows embedded でアプリを作る - 2 -」でGUIを作成しましたが、
 ボタンは『btn001』という名前をつけています。
 先ほど取得したルートエレメントのFindName関数を使用して、
 『btn001』という名前のボタンオブジェクトを取得します。

  IXRButtonBasePtr pObjBtn;
  pRoot->FindName(TEXT("btn001"),&pObjBtn);

 
 ボタンオブジェクトはIXRButtonBase型です。


⑤イベント処理のデリゲートを登録
 ②で作成したデリゲートを、
 ④で取得したボタンオブジェクトに登録します。
 クリックイベントハンドラの登録には、
 AddClickEventHandler関数を使用します。

  pObjBtn->AddClickEventHandler(pClickdelegate);


 基本的なクリックイベントハンドラの追加方法は、
 以上のように実装できます。

 なお、このサンプルでは、クリックイベント時にダイアログを閉じる際、
 ホストオブジェクトを使用しますので、
 ①で作成したイベントハンドラを定義したクラスの
 StartDialog関数を呼ぶ前に、SetHostPtr関数をコールして
 ホストオブジェクト情報をクラスに渡しておいてください。

  objEventHandler.SetHostPtr(pHostPtr);





実装は以上になりますので、
Silverlight for Windows embedded でアプリを作る - 5 -同様、
デバイスエミュレータで動作を確認してください。


Windows Embedded Standard 公式解説書

2009-12-30 13:29:27 | Windows Embedded関連
Windows embedded Standard 2009のマイクロソフト公式解説書が

発売されました。


Windows embedded Standard
組み込みOS構築技法入門 (マイクロソフト公式解説書)

岩崎 平,奥村 正明,金井 典彦,杉本 拓也,田靡 哲也,
中田 佳孝,宮島 剛,森里 良平,石黒 一敏
日経BPソフトプレス

このアイテムの詳細を見る




自分もちょっとだけ執筆にご協力させていただきました。

まぁ、ほんとにほんのちょっとですが(笑)。


梅田の紀伊國屋書店やヨドバシカメラの書籍コーナーに並んでるのを見て、

ちょっと感動しました~


業務に少しでも貢献できれば幸いです。


Silverlight for Windows Embedded でアプリを作る - 5 -

2009-12-25 10:00:00 | Windows Embedded関連
前回までの記事で、Silverlight for Windows embeddedを使った、

簡単なアプリを作成しました。


今回は実際に作成したアプリを、

デバイスエミュレータ上で動作させてみます。


OSイメージをビルドして、デバイスエミュレータにAttachしたら、

Remote ToolsのFile Viewerや、デバイスエミュレータのフォルダ共有機能などを使って、

XAMLファイルをルートディレクトリにおいてください。

また、XAMLファイルで使用している背景画像も同様にルートディレクトリにおいてください。

(ルートディレクトリに置くのは、あくまで今回のプログラミングがそういう実装だからです。

 必ずしもルートディレクトリではなければならない・・・ということはありません)





デバイスエミュレータ上でコマンドプロンプトを起動し、

作成したアプリ名(今回では「SLDemoApp」)を入力してEnterキーを押します。



すると、作成したGUIがそのまま表示されるかと思います。

(クリックすると、大きい画像が表示されます。)




ボタンもちゃんと半透明で表示されてますね。



そう、終了処理を実装していないので(笑)、

アプリを終了するには、コマンドプロンプト上で[Ctrl] + [C]で強制終了してください



XAMLでGUIを開発する利点を確かめておきましょう。

SLDemoAppGUI.xamlファイルをテキストエディタでもいいので開いて、

<Button>タグ内の「Width="100" Height="100"」と記載されている個所を

「Width="50" Height="50"」として、

再度アプリを実行してみてください。

(クリックすると、大きい画像が表示されます。)



アプリの再コンパイルなしで、GUIデザインを変更できました。


次回はボタンイベントを実装して、ちゃんとアプリを終了できるようにします(笑)。


Silverlight for Windows Embedded でアプリを作る - 4 -

2009-12-24 10:00:00 | Windows Embedded関連
前回の記事では、Silverlight for Windows embedded用アプリの

プロジェクト『SLDemoApp』を作成しました。

今回は、前々回作成したGUIを表示するコードを作成します。

簡単なコードの流れは

・Silverlightエンジンの初期化
  ↓
・XAMLデータ元の設定
  ↓
・表示するWindowの設定
  ↓
・XAMLデータを使ってWindowを表示開始

といった感じです。


※説明のために、エラー処理等を省いていますので、
 お気を付けください。


①まずは『SLDemoApp』プロジェクト内にある、
 SLDemoApp.cppファイルを開いてください。
 Silverlight for WEの機能を使うために、
 関連ヘッダをincludeします。


  #include <pwinuser.h>
  #include <XamlRuntime.h>
  #include <xrdelegate.h>
  #include <xrptr.h>


②WinMain関数に、Silverlight for WEを使うためのコードを
 記述していきます。
 まずは、Silverlgiht for WEのエンジンを初期化します。


  XamlRuntimeInitialize();


 
③XAMLデータ元を指定します。
 ここでは、前々回作成したXAMLファイルがデータ元なので、
 SetFile関数を使用して、ファイルを指定します。
 ファイルは、ルートフォルダにある想定です。

  XRXamlSource XamlSource;
  XamlSource.SetFile(TEXT("SLDemoAPPGUI.xaml"));




④XAMLで作成したGUIを表示する際の
 Windowのパラメータを指定します。
 Win32APIでWindowを表示する際にも
 同じようなことをしますよね。


  XRWindowCreateParams WindowsParam;

  // 変数初期化(お忘れなく)
  memset(&WindowsParam,0x00,sizeof(WindowsParam));

  // Window タイトルの設定
  WindowsParam.pTitle = TEXT("Silverligh for WE Demo Application");

  // Window スタイルの設定
  WindowsParam.Style = WS_POPUP;

  // Windowの表示位置指定
  WindowsParam.Left = 0;
  WindowsParam.Top = 0;



⑤上記の③、④での設定を使って、
 XAMLファイルでのGUI表示を開始します。
 ここからは少しだけややこしいです。

 アプリケーションオブジェクト(IXRApplicationのインスタンス)を取得します。
 このオブジェクトは、プロセス毎に一つ生成されるそうです。


  IXRApplicationPtr pAppPtr;
  hRes = GetXRApplicationInstance(&pAppPtr);


 取得したインスタンスから、XAMLファイルデータからWindowを表示したり、
 XAMLの構造を解析する、ホストオブジェクトを生成します。

  IXRVisualHostPtr pHostPtr;

  pAppPtr->CreateHostFromXaml(&XamlSource,&WindowsParam,&pHostPtr);


 そして、Window(ダイアログ)の表示を開始します。
 この関数は同期処理のようですね。
 MFCのDoModal関数のようなものでしょうか。
 uiRetにはWindowを閉じたときの終了コードが入ります。

  UINT uiRet = 0;
  pHostPtr->StartDialog(&uiRet);





実装は以上です。

これだけでXAMLファイルの表示ができます。

といっても、ホントに表示だけで、

このままだと終了処理もないので

強制終了以外にWindowを閉じれないですが(笑)。



早速ビルドすると、

・・・ビルドが失敗しました

2か所ほど追記が必要です。



⑥ビルドして、以下のようなエラーが出る場合


fatal error C1083: Cannot open include file: 'pwinuser.h': No such file or directory


 単純にincludeのパスが通っていないだけだと思います。
 SLDemoAppのプロジェクトフォルダ内にあるSourcesファイルに
 以下の記述を追加してみてください。


INCLUDES= $(_WINCEROOT)publiccommonoakinc;




⑦ビルドして、以下のようなリンクエラーが出る場合
 

error LNK2019: unresolved external symbol GetXRApplicationInstance referenced in function WinMain


 参照するライブラリファイルが足りていません。
 SLDemoAppのプロジェクトフォルダ内にあるSourcesファイルの
 項目[TARGETLIBS]に、
  ・xamlruntime.lib
  ・uuid.lib
 を追記してみてください。
 

TARGETLIBS=
・・・・・・
$(_PROJECTROOT)cesysgensdklib$(_CPUINDPATH)xamlruntime.lib ¥
$(_PROJECTROOT)cesysgensdklib$(_CPUINDPATH)uuid.lib




 以上でビルドが通るかと思います。

 次回は、作成したアプリをデバイスエミュレータ上で
 動作させてみようと思います。


Silverlight for Windows Embedded でアプリを作る - 3 -

2009-12-23 12:00:00 | Windows Embedded関連
前回は、Expression Blend 2を使って、

Silverlight for WE アプリ用の簡単なGUIを作成しました。

今回は、Silverlight for WEを使えるOSイメージ、

そしてアプリケーション用のプロジェクトを作成します。



※Silverlight for Windows embeddedは、Windows embedded CE 6.0 R3から

 追加された機能です。

 そして、Windows embedded CE 6.0 R3は、R2のアップデートとして提供されています。

 まずは、Windows embedded CE 6.0 R3用の開発環境を構築してください。


※一部の画像は、クリックすると大きい画像で見れます。

①OSデザインのプロジェクトを作成/用意した後、
 以下のようにCatalog Item Viewで
 [Core OS]->[CEBASE]->[シェルおよびユーザー インターフェース]->[ユーザー インターフェース]内の
 Silverlight for Windows embeddedにチェックを入れてください。



※うちの環境は、日本語版Visual Studioに英語版Platform builderなので、
 メニューの表示が多言語混ざってます


②Silverlight for WE機能を使うアプリケーションの
 プロジェクトを作成します。
 [ファイル]メニューの[追加]から、サブプロジェクトの新規作成を選択して下さい。



③アプリのテンプレートとして、
 ここでは、[WCE Application]を選択します。
 サブプロジェクト名は任意に設定してください。
 ここでは、『SLDemoApp』としています。



④アプリの種類として、
 ここでは、[A Simple Windows embedded CE Application]を選択しています。
 [完了]ボタンをクリックして、Wizardを終了して下さい。



⑤以下のように、アプリのプロジェクトがソリューションエクスプローラの
 [Subprojects]に追加されます。




次回は、前回作成したXAMLファイルをCE上で表示するC++コードを作成していきます。

Windows Embedded 組み込みセミナー(3)

2009-12-22 10:00:00 | Windows Embedded関連
マイクロソフト社主催で、組込み開発者向けのセミナーが開催されます。
今回は都内です。

開催日時:2009/12/26 13:00~
場  所:専修大学 神田キャンパス
申し込み:Webサイト

セミナー概要:
※以下はWindows embeddedニュースレター『DevWire』からの抜粋です。
 内容は変更になる可能性があります。

・13:00-14:00
  産学協同演習 - 大学教育と企業研修のシームレスな融合を目指して -
  (専修大学 ネットワーク情報学部 飯田 周作 教授)


・14:00-14:40
  組込みスキル標準(ETSS)の活用事例
  (独立行政法人 情報処理推進機構(IPA)/
   ソフトウェア・エンジニアリング・センター(SEC) 渡辺 登 氏)


・14:40-15:20
  アカデミックソリューションのご紹介と
  Windows CE開発プラットフォームのご紹介
  (東京エレクトロンデバイス(株) 河端 麻紀子 氏
   アイウェーブ・ジャパン(株) 代表取締役社長 菅野 治 氏)

・15:20-15:30
  休憩

・15:30-16:10
  組み込みシステム開発マイスターの育成教育
  (東京高専 情報工学科 松林勝志 教授)

・16:10-16:50
  組込み技術者育成と評価方法について
  ~ETEC組込みソフトウェア技術者試験の活用と事例~
  (株式会社サートプロ 代表取締役 /
   社団法人組込みシステム技術協会 ETEC運営事務局 近森 満 氏)


・16:50-17:30
  Windows embeddedと組み込み開発者コミュニティー
  「エンベデッドフォーラム」のご紹介
  (マイクロソフト株式会社 松岡正人氏)

・17:30-18:30
  懇親会

Silverlight for Windows Embedded でアプリを作る - 2 -

2009-12-21 10:00:00 | Windows Embedded関連
前回の記事では、簡単にSilverlight for WEの概要を説明しました。

今回からは実際にアプリを開発していきます。


Silverlight for WEでは、XAMLベースでのGUI開発ができるという話をしました。

ここでは、XAMLファイルをExpression Blend で作成します。

Expression Blendでソースコード等も生成されますが、

使用するのはXAMLファイル(とXAMLファイルで使用している画像ファイル)のみです。


①Expression Blendを起動。
 起動するとこんな感じ。
 (クリックすると大きい画像が見れます。)


②新しくプロジェクトを作成します。
 [ファイル]メニューから、[新しいプロジェクト]を選択。



③プロジェクトの種類は[Silverlight 2 アプリケーション]を選択。
 名前、場所は任意で入力してください。
 言語は特に変更する必要はありません。 
 (クリックすると大きい画像が見れます。)




④新規にプロジェクトを作成すると、以下のような状態になります。
 右側のペインの[プロジェクト]タブに、生成されたファイルが表示されます。
 Page.xamlというファイルが、GUIとなるファイルです。
 [プロジェクト]のリスト上でファイルを選択し、
 F2キーで名前が変更できるので、お好みで変更してください。
 ここでは、「SLDemoAPPGUI.xaml」という名前にしています。

 真ん中のペインで、GUIの変更を行います。
 初期状態では通常のWindowsアプリのようなバーや枠がありません。
 背景は白色です。
 [デザイン]タブが選択された状態では、
 マウス操作でデザインを変更できます。
 [XAML]タブを選択すれば、直接XAMLのタグをテキストで変更できます。
 (クリックすると大きい画像が見れます。)


⑤まずはアプリケーションの画面サイズを変更したいと思います。
 右側のペインで[プロパティ]タブを選択すると、
 真ん中のペインで選択されてるオブジェクトのプロパティが表示されます。
 [レイアウト]グループの[Width]、[Height]をお好みで変更してください。




⑥続いて、背景用画像をプロジェクトに追加します。
 [ファイル]メニューから、[既存のアイテムの追加]を選択し、
 用意した画像を選択してください。

 ※調査しきれていませんが、
  Expression Blendではjpegやpngファイルは扱えましたが、
  GIFファイルは扱えないようです。



⑦画像ファイルを追加すると、
 右側のペインの[プロジェクト]タブのリストに
 追加したファイルが表示されます。
 これをアプリケーションのGUIで表示したい場合、
 このリストでファイルを選択し、
 真ん中のペインにドラッグ&ドロップするだけでOKです。





⑧真ん中のペインで画像が選択された状態で、
 [プロパティ]タブを表示し、サイズを調整しました。
 位置は、真ん中のペインでマウス操作で調整可能です。
 Windowに合わせて背景画像を調整してみました。
 (クリックすると大きい画像が見れます。)



⑨背景画像だけだとちょっとさみしいので(笑)、
 ボタンも追加してみることに。
 いちばん左端にあるツールバーから[ボタン]を選択し、
 マウスドラッグでボタンを追加します。




⑩以下の画面は、ボタンを追加した後、プロパティのOpacityを変更して、
 ボタンを半透明にしています。
 CEでWin32APIを使って半透明ボタンを作成するには
 結構大変だと思いますが、
 Silverlight for WEだと、XAML上でボタンオブジェクトのプロパティを
 変更するだけ。
 すごく簡単にできてしまいます。
 (クリックすると大きい画像が見れます。)



⑪ボタンに名前を付けます。
 C++コードからXAMLのオブジェクトにアクセスするには、
 この名前を使ってアクセスするので、
 適当な名前を付けてください。
 右側のペインの[プロパティ]タブで設定・変更することができます。




⑫以上でGUIの作成は完了です。
 ファイルを全て保存してください。

 プロジェクトのフォルダを確認してください。
 作成したXAMLファイル、追加した背景画像ファイルがあります。
 前述の通り、その他のファイルは、Silverlight for WEでは使用しません。




次回は、Silverlight for Windows embedded用のプロジェクトを作成します。


Silverlight for Windows Embedded でアプリを作る - 1 -

2009-12-20 13:42:18 | Windows Embedded関連
2か月程前の記事

CE 6.0 R3 に付属しているSilverlight for Windows embeddedの

サンプルアプリを紹介しました。


今回はこのサンプル等を参考に、

アプリケーションを実際に開発してみようと思います。





(1)Silverlight for Windows embedded 概要

Silverlight for WEは、Windows embedded CEのアプリケーションのGUI開発を

XAMLベースでできるようにする仕組みです。


Silverlightという名前を冠しているので、

.NET Compact Framework上で動作するのか?・・・と思ってしまいますが、

実は違います。

アプリケーションはC++で作成します。

GUIはXMLライクですが、

制御用のコードはNative コードです。


簡単な仕組みを図示すると、以下のような感じでしょうか。





次回以降、実際にアプリを作成していきます。

★用意するもの

・CE 6.0 R3 開発環境

・Silverlight2開発環境(Expression Blend2とService Pack1)

・画面に使うテキトーな絵(笑)



とりあえず画面を表示するだけの

シンプルなアプリから作っていこうと思います。



Silverlight for Windows Embeddedとライセンス

2009-12-18 20:09:52 | Windows Embedded関連

先日都内で行われた、とあるセミナー兼展示会で、

Silverlight for Windows embeddedを使った

遠隔監視のデモアプリを展示しました。


ナカタはアプリ作成のみで展示会には行けなかったんですが、

結構興味を持ってアプリを触ってくださるお客さんがおられたようで、

ホント感謝です




仕事中、後輩君にWindows embedded CEのコンポーネントとライセンスの

関係を聞かれて、MS社のWebサイトを教えてあげたんですが、

少し気になった点が。

⇒ページはこちら


Silverlight for Windows embeddedを使った製品を出荷する場合は、

C6G SKUのライセンスなんですね。

Core SKUの対象ではないことは注意が必要ですね。



ちなみに、C6G SKUは、説明によるとポータブルなミュージックプレイヤーや、

デジタルフォトフレームといった用途を対象としているような感じ。


Pro SKUになると、映像といったところや

シンクライアントのようなエンタープライズ系機能がメインな感じ。