Silverlight

Size: px

Start display at page:

Download "Silverlight"

しなつこしの
7 years ago
Views:

1 <html xmlns=" xml:lang="jp"> <head> <title>silverlight Hello World</title> <script type="text/xaml" id="xaml"> <?xml version="1.0"?> <Canvas xmlns=" <TextBlock Text="Hello World!" /> </Canvas> </script> </head> <body> <object type= application/x silverlight id= agcontrol width= 640 height="480"> <param name="source" value="#xaml" /> </object> </body> </html> Copyright 2007 Archway Inc Page 1

3 アークウェイについてビジョン: 開発者たちの幸せサービスコンサルティングサービス.NET 技術を中心としたアーキテクチャ/システム構築のコンサルテーションアーキテクチャ策定サービス最適なアーキテクチャ策定をご支援しますメンタリングサービス開発現場の一員として参加しながら.NET 技術やアジャイル開発などの技術指導を行いますトレーニングサービス.NET 技術アジャイル開発などのトレーニング Copyright 2007 Archway Inc Page 3

4 アークウェイについて製品 ainote(アイノート) マインドマップ機能対応ソフトウェアファクトリ支援ツールベータ3(2007/09 版 ) 明日リリース! 研究開発ソフトウェアファクトリ NAgile 詳しくはホームページをご覧ください URL: モチベーションが高い開発者メンターを募集しています! 連絡先 :sales@archway.co.jp Copyright 2007 Archway Inc Page 4

10 RIA バックグラウンド Web ( ) ( 現実解 ) Web 2.0 より使いやすくやや1.0へ戻す SAAS より S+S Tool Text pad vs Rich Env Adobe Flash, Adobe Flex Adobe Integrated Runtime(AIR) Google Gears Microsoft Windows Presentation Foundation(WPF) Copyright 2007 Archway Inc Page 10

24 最も簡単なSilverlightアプリケーション <html xmlns=" xml:lang="jp"> <head> <title>silverlight Hello World</title> XAML <script type="text/xaml" id="xaml"> <?xml version="1.0"?> <Canvas xmlns=" <TextBlock Text="Hello World!" /> </Canvas> </script> </head> <body> <object type="application/x silverlight" id="agcontrol" width="640" height="480"> <param name="source" value="#xaml" /> </object> </body> </html> Silverlightコントロール Copyright 2007 Archway Inc Page 24

25 ファイル構成呼び出し元 HTML 基本動作 SCRIPTタグで下記 2つのJSファイルを参照 CreateSilverlight.js(VSでは TestPage.html.js ) cretateobjetを呼び出し( 次ページ参照 ) Silverlight.js createobject とcreateObjectEx を定義 Page.xaml Page.xaml.cs (.vb ) フォルダ ClientBin Copyright 2007 Archway Inc Page 25

26 利用するHTML <html xmlns=" > <head> <title>silverlight Project Test Page </title> <script type="text/javascript" src="silverlight.js"></script> <script type="text/javascript" src="testpage.html.js"></script> <style type="text/css">.silverlighthost { width: 640px; height: 480px; } </style> </head> <body> <div id="silverlightcontrolhost" class="silverlighthost" > <script type="text/javascript"> createsilverlight(); </script> </div> </body> </html> Copyright 2007 Archway Inc Page 26

27 CreateSilverlisht.js function createsilverlight() { Silverlight.createObjectEx({ source: "Page.xaml", parentelement: document.getelementbyid("silverlightcontrolhost"), id: "SilverlightControl", properties: { width: "100%", height: "100%", version: "1.1", enablehtmlaccess: true }, events: {} }); document.body.onload = function() { var silverlightcontrol = document.getelementbyid('silverlightcontrol'); if (silverlightcontrol) silverlightcontrol.focus(); } } Copyright 2007 Archway Inc Page 27

28 XAMLファイル <Canvas x:name="parentcanvas" xmlns=" xmlns:x=" Loaded="Page_Loaded" x:class="silverlightproject.page;assembly=clientbin/silverlightproject.dll" Width="640" Height="480" Background="Green" > </Canvas> Copyright 2007 Archway Inc Page 28

32 Browser Host.NET for Silverlight Data WPF Networking MS AJAX Library LINQ XLINQ Extensible Controls REST POX DOM Integration Application Services Ruby DLR Python BCL Generics Collections CLR Execution Engine XAML RSS SOAP JSON Legend V1.1 Legend Deploy Presentation Core V1.0 UI Core Inputs DRM Friction-Free Installer Vector Text Keyboard Mouse Ink Media Auto- Updater Animation Images Media VC1 WMA MP3 Controls Layout Editing Copyright 2007 Archway Inc Page 32

51 Silverlight Event Example <Canvas xmlns=" " xmlns:x=" " MouseEnter="OnMouseEnter"> </Canvas> = Canvas canvas = new Canvas(); canvas.mouseenter += OnMouseEnter; // or more explicitly: canvas.mouseenter += new MouseEventHandler(OnMouseEnter); Copyright 2007 Archway Inc Page 51

52 Silverlight Event Example (VB) <Canvas xmlns=" " xmlns:x=" " Height="100" Width="100" Background= Blue" x:name= canvas /> </Canvas> Private Sub something _ (ByVal o As Object, ByVal e As MouseEventArgs) _ Handles canvas.mouseenter rectangle.fill = New SolidColorBrush(Colors.Green) End Sub Copyright 2007 Archway Inc Page 52

53 Silverlight Event Example <Canvas xmlns=" " xmlns:x=" " Height="100" Width="100" Background= Blue" MouseEnter="OnMouseEnter" /> </Canvas> void OnMouseEnter(object sender, MouseEventArgs e) { } Copyright 2007 Archway Inc Page 53

56 Silverlight Architecture Data WPF for Silverlight.NET for Silverlight Server LINQ LINQ to XML Dynamic Languages Ruby Python Extensible Controls BCL Generics Collections Web Services REST RSS SOAP POX JSON ASP.NET AJAX Libs <asp:xaml> <asp:media> Common Language Runtime XAML Legend V1.1 2D Vectors Animation Text UI Core Images Transforms Inputs Keyboard Mouse Ink Media WMV / VC1 WMA MP3 Controls Layout Editing DRM Media Legend V1.0 Presentation Core Integrated Networking Stack DOM Integration Installer JavaScript Engine Browser Host Copyright 2007 Archway Inc Page 56

58 Feature Plans: Controls 1.1 (alpha) 1.1 (planned) WPF Button Sample Yes Yes TextBox No Yes Yes Scrollbar Sample Yes Yes Slider Sample Yes Yes ListBox Sample Yes Yes CheckBox No Yes Yes RadioButton No Yes Yes ComboBox No Yes Yes TreeView No No Yes RichTextBox No No Yes DataGrid No No 3 rd party UserControl Yes Yes Yes Copyright 2007 Archway Inc Page 58

60 Feature Plans: Other 1.1 (alpha) 1.1 (planned) WPF Mouse events Partial Yes Yes Keyboard events Partial Yes Yes Resource dictionary Partial Yes Yes Data binding No Yes Yes Styling No Yes Yes 3D vector graphics No No Yes GPU h/w accel. No No Yes Out of browser No No Yes Offline No No Yes Cross platform Yes Yes No Copyright 2007 Archway Inc Page 60