Posts tagged as Silverlight

[Silverlight]Silverlight 3 betaだとローカルでうんたら

「Silverlight 3 betaだとブラウザで表示しているSilverlightのコンテンツをローカル(OutOfBrowser)でも使えるよ」の仕組みを適当に調べてみた。

 

もろもろの環境作って、以下のSilverlightのサイトにある「#11: Out-of-browser Experiences」ソースをダウンロードし、 サンプルを ビルドして試した。

Videos : The Official Microsoft Silverlight Site
http://silverlight.net/learn/videocat.aspx?cat=12#sl3

 

実行してみると、「MyTasks」というSilverlightコンテンツがlocalhostで立ち上がって、Silverlight上で右クリックしたらこんな感じ。「Install MyTasks onto this computer…」を選んでみた。

outofbowse01

次に、ダイアログがでてきて、「OK」するとローカルにアプリとして展開、自動でローカルアプリになったSilverlightのコンテンツが普通のEXEウィンドウで立ち上がった。
outofbowse02

 

んで、ウィンドウのタイトルバーに「MyTasks」ってあって、右クリックしてみると、今度は「Remove this application…」のメニューになってる。
outofbowse03_0

 

ブラウザのSilverlightもまだ生きてて、こっちも「Remove this application…」になってた。かしこい。
outofbowse04

 

どこにローカルに関連するファイルとかあるんかなーと見てみたら
Windows XPで「C:\Documents and Settings\[ユーザー]\Local Settings\Application Data\Microsoft」に「Silverlight」てのができてて、そん中に「Offline」ってフォルダがあった。(たぶんVistaだとRomingの中とか)

そのなかの「localhost.0」ってのが今回できたローカル用ファイルみたい。(localhost実行だからこんな名前なのかな?)
outofbowse05_0

Windows XP
C:\Documents and Settings\[ユーザー]\Local Settings\Application Data\Microsoft\Silverlight\Offline\localhost.0

 

.xapとかある。なんかhtmlもあるんです。

htmlのobject タグのsourceが「value=”offline://localhost.0″」となってて、さっきの「localhost.0」を指してるっぽい。

<html xmlns="http://www.w3.org/1999/xhtml" >
  <!-- saved from url=(0014)about:internet -->
<head>
  <style type='text/css'>
    html, body { height: 100%; overflow: auto; }
    body { padding: 0; margin: 0; }
    #silverlightControlHost { height: 100%; }
  </style>
</head>
<body scroll=no>
    <div id="silverlightControlHost">
      <object data="data:application/x-silverlight," type="application/x-silverlight" width="100%" height="100%">
          <param name="source" value="offline://localhost.0"/>
          <param name="background" value="white" />

          <a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text-decoration: none;">
              <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/>
          </a>
      </object>
      <iframe style='visibility:hidden;height:0;width:0;border:0px'></iframe>
    </div>
</body>
</html>

 

で次。
outofbowse06

デスクトップのショートカットのプロパティを見たら
「”C:\Program Files\Microsoft Silverlight\3.0.40307.0\sllauncher.exe” localhost.0」だってさ。「sllauncher.exe」ってので動かしてるっぽい。
ここでもさっきの「localhost.0」がでてきた。

 

ふーん、だいたい分かったから、いたずらする。

そのSilverlightの内容が表示されてるローカルのEXEウィンドウにURLショートカットをD&Dします。

 

結果コレ。
outofbowse07_0
タイトルバーは「MyTasks」のまま。

 

ローカル?でSilverlightを動かす「sllauncher.exe」ってやつは、ウィンドウ全体にIEコンポーネント(WebBrowserコンポーネント的なやつ?)を敷いてるのただのEXEってことですか?

結局IEだったとしたら、そりゃIEにFlash Playerが入っていれば、SWFがあるサイトだって動くよね。GoogleのURLショートカットからGmailへのログインだってOKだったよ。普通にWebのネットワークと繋がって、UIが全然ないIEってことだからそうなるよね。

 

んー、Out of Browserと、確かにWeb上のブラウザ外ではあると思います。

しかしながら、IEのセキュリティ設定をそのまま持ってるってことなの?

でも、なんつーかウェブ上でしてることと同じことではないの?。まだbetaだからってこと?。もっと劇的なローカルだからできることとか用意されてんのか?

Web上からだってローカルのストレージ(IsolatedStorage)は使えるんだし、よくわかんね。

 

Webから右クリックで・・・というのは良いアイディアだと思うのだけど、なんか拍子抜け。

なんというか、もっと直接.xapファイルをローカルEXEとして起動するみたいな仕組みに成ってるのかと思ってたけど、本当にこの適当に確認した仕組みのとおりだったら見せかけだけのギミックみたいでなんかつまんない。

あーでも、Macではどうやるんだろう?とかあるけど、このへんでおしまい。

 

ちなみにローカルデータの使用はC#のソースで以下になってた。

if (NetworkInterface.GetIsNetworkAvailable())
{
 // save online using web service
}
{
// use IsolatedStorage because we're offline
}

ってネットワーク上かどうかのフラグ判定して、Webかローカルのストレージ(IsolatedStorage)のどっちを使うか振り分ける感じだね。

なんだか、いろいろまだ不明点は残るけど、いちばんの収穫はif文でelseって省略できるのかな?って発見したこと。
知らなかったな、そんな書き方しないけど一度試してみよ。

 

Related posts

[Silverlight]Adobe AS3 Class Diagram Viewer

既に、Pepeさんやnitoyonさんが紹介している「Flex, ActionScript, AIR Posters」をWebで見れるようにしてみました。

Flex Team
Update on Flex, ActionScript, AIR Posters

中垣 茂 ( Shigeru Nakagaki ) | ブログ ( Flex, AIR, ColdFusion )
AS3, Flex 3, AIR ポスター...97メガっすか

てっく煮ブログ
AIR・AS3・Flex3のクラス相関図ポスターが公開中

 

申し訳ないですが、Silverlightです。
Silverlight 2.0 Beta Silverlight 3のプラグインが必要なので見たい人は入れてください。

Microsoft Silverlight: Light Up the Web
http://www.microsoft.com/silverlight/default.aspx

 

Deep Zoom Adobe ActionScript 3.0 Class Diagram Viewer – Silverlight 3
http://violentcoding.com/content/AdobeAS3ClassDiagramViewer/index.html

posters.pdfから1枚7,200×10,800ピクセル(解像度300相当)のPNG画像に書き出し、それら5枚を横に並べています。各画像のサイズは、22.3MB、32.3MB、32.7MB、24.1MB、30.0MBというボリュームです。

Adobe AS3 Class Diagram Viewer01

 

SilverlightのDeep Zoomという機能を使って表示してます。
MIX08で紹介されていたHard Rock Cafeのサイトで使っているやつです。

Hard Rock Memorabilia
http://memorabilia.hardrock.com/

マウスドラッグで画像の移動やマウスホイールで拡大縮小ができます。

Adobe AS3 Class Diagram Viewer02

Deep Zoomでは拡大縮小や移動を行っている最中に、結構な負荷がかかっています・・・。
CPU%で拡大縮小・移動時には80% – 90%位のスコアをたたき出しております。

 

作りはMSエバンジェリスト 大野さんの完コピです。

develop .net : Silverlight 2 の新機能 – Deep Zoom
http://blogs.msdn.com/mohno/archive/2008/03/12/silverlight-2-deep-zoom.aspx

develop .net : Silverlight 2 の新機能 – Deep Zoom(マウスホイール編)
http://blogs.msdn.com/mohno/archive/2008/03/12/Silverlight-2-Deep-Zoom-with-Mouse-Wheel.aspx

Related posts

[WPF]XBAPとSilverlight

まれに旭山動物園のサイト「Mother Earth 〜母なる地球」がSilverlightとか書かれているのを見るんだけど、違うんだ。

クロスプラットフォームでは無いWPFのブラウザ展開「XBAP」(拡張子[.xbap])なんだよ。
「XAMLブラウザアプリケーション」って言われたりする。

 

たぶんSilverlightが、Flashみたいなマイクロソフトのブラウザ・プラグイン → WPFがWebで動く → 「旭山動物園」みたいな流れで誤解してしまっているのかな。

でも、SilverlightだったらMacでも見られるよね。

 

まあ、この「XBAP」自体、Silverlightがリリースされて、今後目にする機会はあまり無いと思う。
業務アプリとか社内イントラなどの動作環境が特定・統一できるところで(Windowsでしかも.NET Framework 3.0以上が入れられて・・・)、目立たず使われる事があるくらいだろうな。

XBAPは基本的にWPFをブラウザ内で動作させているので、動作環境がVistaか.NET Framework 3.0が入ってるXPで、しかもブラウザはIEのみなんだよ。.NET Framework 3.5 (今はBeta)を入れればFirefoxでも見れるようになるけどさ。

旭山動物園はHTMLページ段階でIE判定が入っているからFirefoxは蹴られちゃう。(XBAPのURLを直接たたけば大丈夫だけど)

 

Silverlightと何が違うかっていうと、Silverlightはプラグイン上で動作しているけど、XBAPは違う。実はEXEが動いてる。

 

まず「.xbap」はURLを直接指定するか、HTMLのiframeの中で指定しなきゃブラウザで見る事ができない。さらに「.xbap」自体は数KBしかなくて、実際のコンテンツとなるアプリ実体の(サーバーに配置された)「.exe」を指定しているに過ぎないファイル。

そして、もっとややこしいことに、このEXEを実行しているのはブラウザではなく、System32あたりにある「PresentationHost.exe」みたいな名前のWPF実行環境が行ってる。

当然、普通に相対パスとか書いていると、このPresentationHost.exeが基準の相対パスになる。もろにローカルで動いている。またWPFだからといっても、ローカルで動くアプリケーションに比べるとブラウザ内で動く以上、セキュリティ系やパフォーマンス系でいくつかの制約もある。

しかも、Silverlightがでてきて、忘却の彼方へ向かってる。(実際、久しぶりに「XBAP」という言葉を思い出した)

 

「旭山動物園」がSilverlightと誤解されたままだと、「Silverlightで3Dを使った、あの旭山動物園みたいの作ってよ」って言われても作れないよ。Silverlightの1.1でもリリースの時に、3Dをサポートする予定はないし。コンテンツ自体は3D部分を除くか、疑似で表現すればSilverlightになりそうな気もするけど。

クロスプラットフォームで動くのはSilverlightだけ。

 

じゃあ、結局SilverlightはFlashと比べてどうなのって話になるんだろうけど、たぶん

  • .NET開発者がWebのリッチコンテンツを作れる
  • DLLが使える
  • JavaScript・Python・RubyでもOK
  • LINQでデータにアクセスできる
  • XAMLのランタイム時のパースや動的生成ができる
  • .NET Framework の連携開発

が主なところになるんかな。

.NETでWebリッチコンテンツを作れるってのが一番大きいんだろうけど、技術的興味じゃなくて、そういうモノを作りたいって思う人が.NET開発者にどれだけいるかにかかってるんじゃないかな。

 

あ、もうひとつ付け加えておくと、シンプルなXAMLならXBAPみたく直接ブラウザで見れる「LooseXAML」ってのもある。実際のコンテンツじゃなありえないだろうけど直接URLに「.xaml」を指定して見れるやつ。これもSilverlightじゃないよ。

 

Related posts

[Blend]Canvas.xaml用テンプレートを追加する

Expression Blendで[ファイル]メニュー – [新しいアイテムの追加]に、パーシャルクラスを持たないXAMLのみの「Canvas」を追加する方法です。

Canvas.xamlを生成するテンプレート定義を作って、テンプレート用ディレクトリに配置すれば、[新しいアイテムの追加]ダイアログに「Canvas」が追加されます。

Blend1_addNewItem_Canvas

 

Blendのテンプレート用ディレクトリは、
C:\Program Files\Microsoft Expression\Blend 1.0\Templates\ja\が基本で、さらにその中に言語別の「CSharp」「VisualBasic」というフォルダがあります。

で、それぞれのフォルダに配置されたテンプレート定義が使用言語プロジェクトの「新しいアイテムの追加」ダイアログで表示されるテンプレートとなります。

 

テンプレート定義の内訳は、以下の3つです。

  • Canvas.vstemplate
  • Canvas.xaml
  • Canvas.png

Canvas.vstemplateが定義ファイルで、Canvas.xamlは追加されるファイル、Canvas.pngはダイアログで表示されるアイコン用です。

 

ダウンロード:
Blend1.0用Canvasテンプレート定義:CanvasTemplate_blend.zip
解凍した「Canvas」フォルダを使用する言語用フォルダ内に置いてください。

パーシャルクラスのコードを必要としない今回のCanvas.xamlでは、C#・VBを区別する必要が無いので、ResourceDictionaryのテンプレート定義と同じように「ja」直下の
C:\Program Files\Microsoft Expression\Blend 1.0\Templates\ja\に3つのファイルを直接配置してもOKです。

 

「.vstemplate」ファイルでいろいろ設定するんですが、<ProjectItem>タグのSubTypeが”form”の場合、ダイアログの「コードファイルを含める」チェックボックス部分が有効になるので、その部分をグレーアウトするために、ResourceDictionaryにならってSubTypeは「Canvas」としておきました。

<ProjectItem TargetFileName="$fileinputname$.xaml" ReplaceParameters="true" SubType="Canvas">Canvas.xaml</ProjectItem>

 

あんまりWPFアプリケーション作成の場合に使い道は無いですが、Silverlight用のプロジェクトが作成できるBlend2を使う場合には、そこそこメリットがあるかもしれません。


ということで、Silverlight 1.1を作成できるBlend2では、パーシャルクラスを必要としないCanvas.xamlを使用することもあり、そんな場合の単独Canvas.xamlファイルを作成したいときに使えます。

 

Silverlight 1.1用プロジェクトの場合、UserControlの追加でもCanvasのXAMLファイルが作成されるんですが、VBやC#のコードも作成されるので、CanvasのXAMLを単独で使用したい時には、それらを削除する必要があります。

この時、Canvas用テンプレートを用意すれば、VBやC#のコードを削除する手間が省けます。

 

はい。ただそれだけです。

 

Blend2 August Previewにテンプレートを追加するには、
まず、C:\Program Files\Microsoft Expression\Blend 2 August Preview\Templatesに「en」の内容をコピーした「ja」フォルダを作成する必要があります。

そしてBlend 1の場合と同じように「ja」直下に「CSharp」「VisualBasic」というフォルダがあります。ちなみに「HTML」というフォルダはSilverlight 1.0用ですね。

 

ダウンロード:
Blend2 August Preview用Canvasテンプレート定義:CanvasTemplate_blend2.zip
解凍した「Canvas」フォルダを使用する言語用フォルダ内に置いてください。

 

「CSharp」とか「VisualBasic」にテンプレート用ファイルを配置するか、「ja」直下に直接ファイルを置くかすれば「新しいアイテムの追加」ダイアログに追加されます。

Blend2 AddItemDialog Orcas

 

Blend2 August PreviewではWPFアプリケーション用のプロジェクトの他に、Silverlight 1.1 用に2種類のプロジェクト(Visuau Studio 2005用とVisual Studio 2008 Beta(Orcas)用)があるので、Silverlight用に2つのテンプレート定義を追加します。

  • Canvas.vstemplate :WPF用テンプレート定義
  • Canvas.xaml :WPF用Canvas.xaml
  • Canvas_Silverlight2005.vstemplate :Silverlight 1.1(.NET)用テンプレート定義
  • Canvas_Silverlight.vstemplate :Silverlight 1.1(.NET Orcas)用テンプレート定義
  • Canvas_Silverlight.xaml :Silverlight用Canvas.xaml
  • Canvas.png :ダイアログ用アイコン

 

Silverlight用のテンプレート定義では「.vstemplate」内で、
Silverlight(.NET Orcas)用に<templategroupid>を「Silverlight」と指定し、

    <templategroupid>Silverlight</templategroupid>

Silverlight(.NET)のVisual Studio 2005用では「Silverlight2005」とすれば良いみたいです。

    <templategroupid>Silverlight2005</templategroupid>

 

WPF用とSilverlight用でCanvas.xamlが別なのはXAMLのネームスペースが異なるからです。

WPFアプリケーション用:

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

Sliverlight用:

xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

 

Related posts

[Silverlight]SWF+Silverlight1.1のサンプル更新

この前、SWFからExternalInterfaceを経由して、Silverlight 1.1 のDLLを使用するサンプル作ってみましたが、Silverlight1.1 が Alpha Refresh版となったことで、Alpha Refresh用にサンプル・ソースを変更しました。

[Flash]SWFからSilverlight 1.1のDLLを使う
http://violentcoding.com/blog/2007/06/10/archives/8

 

変更といっても、Silverlight.js差し替えたり、
CreateSilverlight.jsの中で「 Sys.Silverlight.createObjectEx({source: ’simple.xaml’,・・・」となっている部分で、最初の「Sys.」を消すぐらいで済みました。その他はSilverlightのプロジェクト名を変えたのでネームスペースを調整しています。

 

Related posts

Pages: 1 2 Next