5/06/2007

IronPython no Silverlight - primeiro exemplo

A alguns dias atrás a Microsoft lançou oficialmente o Silverlight, uma ferramenta para apresentações e animações para web, para ser concorrente do Adobe Flash.

As principais características do Silverlight é a que ele é OpenSource e que ele é programado usando linguagens dinâmicas, entre elas o IronPython.

O desenvolvimento de apresentações funciona da seguinte maneira:

1 - Criamos o arquivo xaml, que é um xml que representa toda a parte visual da nossa apresentação. Ele pode ser criado 'no braço', sendo codificado ou usando o Microsoft Expression Design [1] que é uma ferramenta de ilustração e design gráfico onde você cria os desenhos e pode exportá-los para xaml.

2 - Criamos o arquivo que terá toda a parte de programação da noss apresentação. Como usaremos o IronPython, será um arquivo .py.

3 - Usando o Silverlight SDK, criamos a função createSilverlight, que é um javascript que faz a exibição da apresentação no html.

4 - Chamamos a função createSilverlight no html para exibir nossa apresentação.

Para desenvolvermos nossa primeira apresentação é necessário o player do Silverlight [2] e o SDK dele [3].

Vamos criar uma apresentação que carregue um texto quando a apresentação foi carregada. Vamos começar pelo xaml.

Scene.xaml

<Canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="100" Height="100" Background="Red" >

<x:Code Source="primeiro.py" Type="text/python" />

<Canvas Loaded="OnLoad" />

<TextBlock x:Name="Texto" Foreground="White" Text="IronPython" />

</Canvas>


O xaml acima é formado por 4 linhas praticamente. A primeira é a Canvas onde contém a linkagem com os xmlns oficiais do silverlight e ele também é o fundo da nossa aplicação que nesse caso use a cor de fundo como vermelha e usei o tamanho de 100x100.

<Canvas

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

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

Width="100" Height="100"

Background="Red"

>

A segunda, a x:Code é responsável por configurar o tipo da linguagem e onde fica o arquivo com os comandos.

<x:Code Source="primeiro.py" Type="text/python" />

A terceira linha contém uma tag canvas que uso apenas para colocara função Loaded que é disparada quando a apresentação é carregada. O nome da função chamada quando a apresentação é carregada é OnLoad.

<Canvas Loaded="OnLoad" />

E para finalizar o nosso texto que terá a cor branca e no python será representado pela instância Texto.

<TextBlock x:Name="Texto" Foreground="White" Text="IronPython" />

Agora vamos para o nosso arquivo em Python, que não passa de uma função chamada OnLoad que atribui um valor ao texto que criamos através do parâmetro Text.

primeiro.py

def OnLoad(sender, args):

Texto.Text = "Isso é d+++"

O SDK do silverlight dispoe do Silverlight.js e do CreateSilverlight.js que é um modelo para criação da função que chamará o xaml. Vamos abrir o CreateSilverlight.js e modificar a função createSilverLight.js para que chame o Scene.xaml. Nessa função também configuramos o framerate entre outros atributos.

function createSilverlight()

{

Sys.Silverlight.createObject("Scene.xaml", pe, "wpf",

{width:'350', height:'350',

inplaceInstallPrompt:false, background:'#00000000', isWindowless:'true',

framerate:'30', version:'0.95'},

{onError:null, onLoad:null},

null);

}


E para finalizar chamamos a função createSilverlight no nosso arquivo .html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">



<head>

<title>Primeiro</title>

<script src="js/silverlight.js" type="text/javascript" ></script>

<script src="js/CreateSilverlight.js" type="text/javascript" ></script>

</head>



<body>

<div id="iron" >

<script type="text/javascript">

var pe = document.getElementById("iron");

createSilverlight();

</script>

</div>

</body>

Com o Silverlight + IronPython pode-se fazer coisas que só a imaginação pode limitar.

Em breve, mais sobre Silverlight e IronPython, mas por enquanto é só.

Quer mais? [4].

[1] - http://www.microsoft.com/Expression/products/overview.aspx?key=design

[2] - http://msdn2.microsoft.com/en-us/silverlight/bb419317.aspx

[3] - http://www.microsoft.com/downloads/details.aspx?FamilyID=54B85D84-604D-43DB-BCFE-7AFD278208D8&displaylang=en

[4] - http://www.microsoft.com/brasil/msdn/tecnologias/expression/intro_silverlight.mspx

Nenhum comentário: