Silverlight - Hello World Sample

  • Article

Ein Kollege von mir behauptet steif und fest er sei der Erfinder von "Hello World". Tja, leider hat er anscheinend dazu kein Patent eingereicht. Hätte er das, müsste er heute nicht Events in Asien organisieren ;-)

Hier ist quasi die Silverlight-Variante von "Hello World".

Der nötige HTML-Code

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<html xmlns="https://www.w3.org/1999/xhtml">
<head>
    <title>01_HelloWorld</title>

    <script type="text/javascript" src="Silverlight.js"></script>
    <script type="text/javascript" src="Default.html.js"></script>
    <script type="text/javascript" src="Scene.xaml.js"></script>
</head>

<body>
    <div id="SilverlightPlugInHost">
        <script type="text/javascript">
            createSilverlight();
        </script>
    </div>
</body>
</html>

Die XAML-Datei

 <Canvas xmlns="https://schemas.microsoft.com/client/2007" xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml">
  <TextBlock x:Name="myText" Text="Hello World" />
</Canvas>

Die passende Scene.xaml.js

 if (!window._0_Base)
    window._0_Base = {};

_0_Base.Scene = function() 
{
}

_0_Base.Scene.prototype =
{
    handleLoad: function(plugIn, userContext, rootElement) 
    {
        this.plugIn = plugIn;
        
        // Sample button event hookup: Find the button and then attach event handlers
        this.text = rootElement.children.getItem(0);    
        
        this.text.addEventListener("MouseEnter", Silverlight.createDelegate(this, this.handleMouseEnter));
        this.text.addEventListener("MouseLeftButtonDown", Silverlight.createDelegate(this, this.handleMouseDown));
        this.text.addEventListener("MouseLeftButtonUp", Silverlight.createDelegate(this, this.handleMouseUp));
        this.text.addEventListener("MouseLeave", Silverlight.createDelegate(this, this.handleMouseLeave));
    },
    
    // Sample event handlers
    handleMouseEnter: function(sender, eventArgs) 
    {
        this.text.text = "MouseEnter";
    },
    
    handleMouseDown: function(sender, eventArgs) 
    {
        this.text.text = "MouseDown";
    },
    
    handleMouseUp: function(sender, eventArgs) 
    {
        this.text.text = "MouseUp";
    },
    
    handleMouseLeave: function(sender, eventArgs) 
    {
        this.text.text = "MouseLeave";
    }
}

Die gesamten Sourcen dazu findet man hier.