Ruby and Python with Silverlight: Martha Rotter Microsoft Ireland Developer and Platform Group [email_address] O RLY? YA R...
For Today:  <ul><li>What is Silverlight? </li></ul><ul><li>What does Silverlight look like? </li></ul><ul><li>Ruby + Pytho...
But first … D00d what iz silverlight?!?!?!1
e X stensible  A pplication  M arkup  L anguage <ul><li>Declarative Language – Just XML </li></ul><ul><ul><ul><li>Describe...
XAML Basics <ul><li>You can create drawings directly with XAML  </li></ul><ul><li>XAML is made up of Tags </li></ul><ul><u...
Example XAML <ul><li>For example: </li></ul><Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot;> <Rectangle Width=&quot;...
Common XAML Elements <ul><li>Basic Vocabulary of Tags </li></ul><ul><ul><li>Canvas </li></ul></ul><ul><ul><li>Brushes </li...
DEMOS
Silverlight Developer’s Toolkit
Silverlight Architecture XAML Browser Host Integrated Networking Stack DOM Integration Installer JavaScript Engine Present...
<Script src=“Silverlight.js”/> <Script src=“Default.html.js”/> <Script src=“Scene.xaml.js”/> Web Browser Web Page Silverli...
Helper JavaScript in SDK
Web Page <ul><li><html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;> </li></ul><ul><li><head> </li></ul><ul><li><title>M...
createSilverlight() <ul><li>function createSilverlight() </li></ul><ul><li>{  </li></ul><ul><li>Silverlight.createObject( ...
createSilverlightEx <ul><li>function createSilverlightEx() </li></ul><ul><li>{  </li></ul><ul><li>Silverlight.createObject...
Programming a Silverlight-Based Application with a Dynamic Language <ul><li>Root html page which calls your createSilverli...
DEMOS
The Future… Examples COUNT!!1 HAI  CAN HAS STDIO? I HAS A VAR  IM IN YR LOOP  UP VAR!!1  VISIBLE  VAR IZ VAR BIGGER THAN 1...
Upcoming SlideShare
Loading in …5
×

Ruby & Python with Silverlight O RLY? YA RLY!

3,312 views

Published on

Introduction to Silverlight and dynamic languages

Published in: Technology
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,312
On SlideShare
0
From Embeds
0
Number of Embeds
48
Actions
Shares
0
Downloads
94
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • Ruby & Python with Silverlight O RLY? YA RLY!

    1. 1. Ruby and Python with Silverlight: Martha Rotter Microsoft Ireland Developer and Platform Group [email_address] O RLY? YA RLY!
    2. 2. For Today: <ul><li>What is Silverlight? </li></ul><ul><li>What does Silverlight look like? </li></ul><ul><li>Ruby + Python + ??? on Silverlight </li></ul>
    3. 3. But first … D00d what iz silverlight?!?!?!1
    4. 4. e X stensible A pplication M arkup L anguage <ul><li>Declarative Language – Just XML </li></ul><ul><ul><ul><li>Describes the look and feel </li></ul></ul></ul><ul><ul><ul><li>Generated by Microsoft Expression tools </li></ul></ul></ul><ul><li>Designer / Developer Workflow </li></ul><ul><ul><li>No More Mockups or Wireframes </li></ul></ul><ul><li>Runtime Format </li></ul><ul><ul><li>“ Skinable” UI </li></ul></ul>
    5. 5. XAML Basics <ul><li>You can create drawings directly with XAML </li></ul><ul><li>XAML is made up of Tags </li></ul><ul><ul><ul><li>Represent a single item or container of the design </li></ul></ul></ul><ul><ul><ul><ul><li>E.g. Rectangle, Ellipse, Canvas, Storyboard, etc. </li></ul></ul></ul></ul><ul><ul><ul><li>Not all Tags are design elements (e.g. animations) </li></ul></ul></ul>
    6. 6. Example XAML <ul><li>For example: </li></ul><Canvas xmlns=&quot;...&quot; xmlns:x=&quot;...&quot;> <Rectangle Width=&quot;200&quot; Height=&quot;150&quot; Fill=&quot;Black&quot; /> <Ellipse Width=&quot;200&quot; Height=&quot;150&quot; Stroke=&quot;Orange&quot; /> </Canvas>
    7. 7. Common XAML Elements <ul><li>Basic Vocabulary of Tags </li></ul><ul><ul><li>Canvas </li></ul></ul><ul><ul><li>Brushes </li></ul></ul><ul><ul><li>Basic shapes </li></ul></ul><ul><ul><ul><li>Rectange, Ellipse, Line, Polygon, etc. </li></ul></ul></ul><ul><ul><li>TextBlock </li></ul></ul><ul><ul><li>Image </li></ul></ul><ul><ul><li>No Controls in Silverlight 1.0 </li></ul></ul>
    8. 8. DEMOS
    9. 9. Silverlight Developer’s Toolkit
    10. 10. Silverlight Architecture XAML Browser Host Integrated Networking Stack DOM Integration Installer JavaScript Engine Presentation Core .NET for Silverlight Inputs Keyboard Mouse Ink Media WMV / VC1 WMA MP3 Controls Layout Editing UI Core 2D Vectors Animation Text Images Transforms DRM Media Dynamic Languages Ruby Python BCL Generics Collections Web Services REST RSS SOAP POX JSON Data LINQ LINQ-to-XML WPF for Silverlight Extensible Controls Common Language Runtime ASP.NET AJAX Libs <asp:xaml> <asp:media> Server Silverlight 1.0 Silverlight 1.1 Legend
    11. 11. <Script src=“Silverlight.js”/> <Script src=“Default.html.js”/> <Script src=“Scene.xaml.js”/> Web Browser Web Page Silverlight Host UI Logic <div id=&quot;SilverlightPlugInHost&quot;> <script type=&quot;text/javascript&quot;> createSilverlight(); HTML
    12. 12. Helper JavaScript in SDK
    13. 13. Web Page <ul><li><html xmlns=&quot;http://www.w3.org/1999/xhtml&quot;> </li></ul><ul><li><head> </li></ul><ul><li><title>My Silverlight Application</title> </li></ul><ul><li><script type=&quot;text/javascript&quot; src=&quot;Silverlight.js&quot;></script> </li></ul><ul><li><script type=&quot;text/javascript&quot; src=&quot;Default.html.js&quot;></script> </li></ul><ul><li><script type=&quot;text/javascript&quot; src=&quot;Scene.xaml.js&quot;></script> </li></ul><ul><li></head> </li></ul><ul><li><body> </li></ul><ul><li><div id=&quot;SilverlightPlugInHost&quot;> </li></ul><ul><li><script type=&quot;text/javascript&quot;> </li></ul><ul><li>createSilverlight(); </li></ul><ul><li></script> </li></ul><ul><li></div> </li></ul><ul><li></body> </li></ul><ul><li></html> </li></ul>
    14. 14. createSilverlight() <ul><li>function createSilverlight() </li></ul><ul><li>{ </li></ul><ul><li>Silverlight.createObject( </li></ul><ul><li>&quot;plugin.xaml&quot;, // Source property value. </li></ul><ul><li>parentElement, // DOM reference to hosting DIV tag. </li></ul><ul><li>&quot;myPlugin&quot;, // Unique plug-in ID value. </li></ul><ul><li>{ // Plug-in properties. </li></ul><ul><li>width:'1024', // Width of rectangular region of plug-in in pixels. </li></ul><ul><li>height:'530', // Height of rectangular region of plug-in in pixels. </li></ul><ul><li>inplaceInstallPrompt:false, // Determines whether to display in-place install prompt if invalid version is detected. </li></ul><ul><li>background:'white', // Background color of plug-in. </li></ul><ul><li>isWindowless:'false', // Determines whether to display plug-in in windowless mode. </li></ul><ul><li>framerate:'24', // MaxFrameRate property value. </li></ul><ul><li>version:'1.0' // Silverlight version. </li></ul><ul><li>}, </li></ul><ul><li>{ </li></ul><ul><li>onError:null, // OnError property value -- event-handler function name. </li></ul><ul><li>onLoad:null // OnLoad property value -- event-handler function name. </li></ul><ul><li>}, </li></ul><ul><li>null, // initParams -- user-settable string for information passing. </li></ul><ul><li>null); // Context value -- passed to Silverlight.js onLoad event handlers. </li></ul><ul><li>} </li></ul>
    15. 15. createSilverlightEx <ul><li>function createSilverlightEx() </li></ul><ul><li>{ </li></ul><ul><li>Silverlight.createObjectEx({ </li></ul><ul><li>source: 'plugin.xaml', // Source property value. </li></ul><ul><li>parentElement:parentElement, // DOM reference to hosting DIV tag. </li></ul><ul><li>id:'myPlugin', // Unique plug-in ID value. </li></ul><ul><li>properties:{ // Plug-in properties. </li></ul><ul><li>width:'1024', // Width of rectangular region of plug-in in pixels. </li></ul><ul><li>height:'530', // Height of rectangular region of plug-in in pixels. </li></ul><ul><li>inplaceInstallPrompt:false, // Determines whether to display in-place install prompt if invalid version is detected. </li></ul><ul><li>background:'white', // Background color of plug-in. </li></ul><ul><li>isWindowless:'false', // Determines whether to display plug-in in windowless mode. </li></ul><ul><li>framerate:'24', // MaxFrameRate property value. </li></ul><ul><li>version:'1.0'}, // Silverlight version. </li></ul><ul><li>events:{ </li></ul><ul><li>onError:null, // OnError property value -- event-handler function name. </li></ul><ul><li>onLoad:null}, // OnLoad property value -- event-handler function name. </li></ul><ul><li>initParams:null, // initParams property value -- user-settable string for information passing. </li></ul><ul><li>context:null}); // Context value -- passed to Silverlight.js onLoad event handlers. </li></ul><ul><li>} </li></ul>
    16. 16. Programming a Silverlight-Based Application with a Dynamic Language <ul><li>Root html page which calls your createSilverlight method </li></ul><ul><li>CreateSilverlight.js (implementation of parameterless createSilverlight method to start your application) </li></ul><ul><li>Silverlight.js (defines createObject & createObjectEx methods) </li></ul><ul><li>pageName.xaml (UI of your application) </li></ul><ul><li>pageName.xaml.py (code behind the UI) </li></ul><ul><ul><li> Compiled & executed at runtime </li></ul></ul>
    17. 17. DEMOS
    18. 18. The Future… Examples COUNT!!1 HAI CAN HAS STDIO? I HAS A VAR IM IN YR LOOP UP VAR!!1 VISIBLE VAR IZ VAR BIGGER THAN 10? KTHXBYE IM OUTTA YR LOOP KTHXBYE FILEZORZ: HAI CAN HAS STDIO? PLZ OPEN FILE &quot;LOLCATS.TXT&quot;? AWSUM THX VISIBLE FILE O NOES INVISIBLE &quot;ERROR!&quot; KTHXBYE

    ×