Chaves

SilverArcade.com = XNA em Silverlight

Agora que o SilverSprite está já disponível para seja possível integrar o XNA nas aplicações Silverlight, nasceu uma comunidade de jogos casuais: o SilverArcade.com 

Com 23 jogos e um com um modelo de negócio, este é um excelente exemplo de como se pode tirar partido da tecnologia, e ao mesmo tempo co-existir com um modelo de negócio.

Vamos ver o progresso desta plataforma, para que tanto em Zune como na XBOX 360, seja possível utilizar e exportar os jogos de uma forma mais simples. É sempre bom quando podemos reaproveitar já os recursos feitos (neste caso, os jogos em XNA), e que estes fiquem disponíveis em mais plataformas.

SilverSprite = Silverlight + XNA

O SilverSprite é novidade! Mas já há algum tempo que a comunidade estava à sua espera, e porquê? Com o SilverSprite é possível executar XNA (aka jogos :) ) no plugin de Silverlight.

Uma vez que ambas as tecnologias são managed em .NET, era só uma questão de tempo até surgir alguma ferramenta que faça a ponte entre as bibliotecas de XNA e o XAML.

Neste momento o SilverSprite apenas suporta jogos em 2D e faz a “compilação” para o Silverlight 2, e portanto onde quer que o Silverlight corra… temos jogo :)

Vídeo Channel 9 – Bill Reiss fala sobre esta tecnologia e mostra como podemos usá-la para os nossos jogos.

Farseer Physics Engine em XNA dentro de Silverlight

Como fazer?

Neste artigo podemos encontrar passo por passo da utilização de SilverSprite para correr o nosso jogo em XNA.

Este é um excelente exemplo de como com a .net framework conseguimos não só re-aproveitar o nosso código, mas também nos é possível integrar as framework que vão aparecendo com base em .net :)

(cross posted: http://xamlpt.com/blogs/chaves/archive/2009/04/29/silversprite-silverlight-xna.aspx)

Videos on Visual Web Developer

For those who want to iniciate on Visual Web Developer Express environment software here's a video collection to help and learn:

http://www.asp.net/vwd/ 

What Visual Web Developer Express offers :

• A rich editor that allows you to work with HTML and CSS in source view, design view or both using split-view
• Powerful debugging support for ASP.NET, C#, VB as well as JavaScript
• Support for application frameworks like ASP.NET MVC, AJAX, Silverlight and third party libraries like jQuery
• Built-in support for FTP-based Web deployment and database deployment
• Intellisense features such as syntax highlighting and auto-completion that help improve productivity
• Ability to test your Web applications instantly with the integrated Web server or IIS

http://www.microsoft.com/express/ - get the software for free.

Acessibilidade em aplicações Silverlight 2 e 3

Um bom artigo que nos mostra as boas práticas e técnicas de acessibilidade, para construir aplicações em Silverlight 2 e 3.

http://www.code-magazine.com/article.aspx?quickid=0810062&page=1

Silverlight: Como mudar a experiência na instalação do plugin?

Foi lançado um papper, que explica a melhor forma para se desenhar uma experiência instalação personalizada do plugin do Silverlight. Assim é possível dar ao utilizador (que não tem o plugin instalado) uma experiência mais rica em vez do actual:

Devidamente acompanhado com alguns exemplos que demonstram as guidelines sugeridas pelo documento.

São dados nos exemplos alguns templates para as aplicações Silverlight web, e para as aplicações Silverlight de vídeo. Estes estão desenhados para serem fáceis de personalizar e de serem utilizado nas aplicações actuais. Além disso outras caraterísticas destes são:

- Fáceis de tradução

- Compatíveis com os vários browsers

- Leves e compactos

- Preparados para vários controlos

- São compatíveis e desenhado em conjunto com a biblioteca Silverlight.js

A utilização de instalações personalizadas faz todo o sentido… tendo em conta que provávelmente a nossa aplicação vêm trazer ao utilizador uma experiência mais rica, mais fácil e com um comportamento mais cool. Entrar na página da nossa aplicação e deparar com um simples “Install Microsoft Silverlight”, quando depois a aplicação em si é extremamente rica… mexe certamente com a expectativa do utilizador.

O documento está dividido em:

Princípios de uma boa experiência na instalação

Como programar uma nova experiência de instalação

Extremos e boas práticas na programação da nova experiência de instalação

Conclusão

Para todos os programadores que desenvolvem em Silverlight é um documento obrigatório :)

[cross posted: http://xamlpt.com/blogs/chaves/archive/2009/04/15/silverlight-como-mudar-a-experi-234-ncia-na-instala-231-227-o-do-plugin.aspx]

Silverlight: Leituras da Semana

Queria partilhar convosco algumas leituras que ando a fazer esta semana, dedicadas ao silverlight ou que se relacionem directamente:

Saving and Retrieving File Using the SQL Server 2k8 – Nada como umas dicas para storage de ficheiros numa base de dados.

Navigation Behavior em Silverlight 3 – Este é um assunto no qual estou a preparar umas demos, e que irei falar mais à frente.

Mouse Wheel Behavior – Um bom post sobre os eventos da roda do rato em Silverlight. Como podemos tirar partido desta funcionalidade em aplicações Slv.

DropShadow e Blur Effects – Mais duas boas referências para estes novos efeitos que podem ser utilizados em Silverlight 3

Silverlight toolkit themes – Mais uma boa referência de como podemos tirar partido de utilização de temas nas nossas aplicações usando os controlos do toolkit. Mais sobre personalização e criação de temas aqui

Silverlight e Azure – Como podemos por as nossas aplicações na cloud … isto faz sentido para silverlight? Alguns exemplos.

HyperVideo em Silverlight – O hyperVideo em Silverlight permite-nos obter vídeo interactivos com o utilizador. Na linha de tempo do vídeo os markers podem “disparar” sugestões para o player, o utilizador apartir da accção navega para outros contúedos relacionados.

Silverlight .NET RIA Services – Esta é uma nova framework anunciada no Mix09, que permite construir aplicações e serviços de negócio sobre esta plataforma. Além de andar a ler o documento, existe também um série de post’s sobre o assunto.

Silverlight out of browser – Agora que com slv 3 as aplicações poderão estar a correr OOB, a discussão sobre a forma como as aps “correm” tem sido bastante discutida. Deverão as apps em OOB correr como Full Trust?

Interagir com HTML e Silverlight – Mais um post com algumas dicas de como podemos aceder no code behind em silverlight a uma “div” e interagir com esta.

Silverlight Whitepapper – foi publicado um papper sobre o Silverlight, a sua experência de utilização e a interacção com a web. Neste kit podemos encontrar alguns templates, tanto para páginas web, como para a parte de mídia do Silverlight.

Criar um gradiente no Blend 3 – Não sou designer :) mas não custa nada “apanhar” uma dica de como se faz um gradiente xpto em blend 3 preview.

[cross posted: http://xamlpt.com/blogs/chaves/archive/2009/04/15/silverlight-leituras-da-semana.aspx]

DreamBuild and Play

Perspectiva 3D do Silverlight 3 Beta (c/ demo)

Uma das funcionalidades disponíveis na versão beta do Silverlight 3, é a perspectiva em 3D, e não confundir com 3D no seu estado “puro”.

Apesar de existirem algumas técnicas e exemplos de como criar animações ou prespectivas 3D para o Silverlight 2.0, com esta nova funcionalidade não só nos facilita na criação dos storyboards como também no acesso às transformações dos objectos, tanto pelo código como pelo design (XAML).

Com a projecção, podemos então criar efeitos bastantes apelativos nas nossas aplicações, e dar uma nova personalização e conforto.

Esta funcionalidade é introduzida pelo Projection que nos disponibiliza as rotações nos eixos X,Y e Z.

<StackPanel.Projection>

   <PlaneProjection RotationX="0" RotationY="0" RotationZ="0"/>

</StackPanel.Projection>

Como se pode ver na imagem abaixo, as rotações são dadas como mostra o eixo:

Uma pequena demo, demonstra como podemos dar outro conceito à nossa aplicação ou até mesmo com vídeo o efeito que podemos transmitir ao utilizador. Experimente deslizar as barras para definir um novo valor numa das rotações.

Não esquecer, que fora da projecção continuamos a ter os eixos normais de X,Y que definem a posição de um objecto relativamente ao plugin do Silverlight.

Mais informações sobre projecções:

http://silverlight.net/learn/learnvideo.aspx?video=187308

http://silverlight.net/learn/learnvideo.aspx?video=189248

http://msdn.microsoft.com/en-us/library/cc838158(vs.96).aspx

O Código utilizado para a associação do valor da barra com uma determinada rotação é bastante simples:

public partial class MainControl : UserControl
    {
        PlaneProjection myplane = new PlaneProjection();
        
        public MainControl()
        {
            
            // Required to initialize variables
            InitializeComponent();            
            form1.Projection = myprojection;        
        }

        private void sliderY_ValueChanged(object sender, System.Windows.RoutedPropertyChangedEventArgs<double> e)
        {
            myprojection.RotationY = e.NewValue;
        }

    }

[cross posted from: http://xamlpt.com/blogs/chaves/archive/2009/04/08/perspectiva-3d-do-silverlight-3-beta-c-demo.aspx]

Microsoft Dynamics European Campus Tour - Convite

JavaScript em ASP.NET - Dicas

Um artigo bastante completo sobre a utilização de JavaScript em ASP.NET

Vale apena dar uma vista de olhos principalmente para quem faz utilização regular destas duas tecnologias em conjunto.

Parte 1

http://aspalliance.com/1701_Using_JavaScript_Effectively_in_ASPNET_20__Part_1.all 

Parte 2

http://www.codedigest.com/Articles/ASPNET/221_Using_JavaScript_Effectively_in_ASPNet_20_%e2%80%93_PART_2.aspx 

Imput de “tab” em Silverlight (dica)

Publicidade em Silverlight (SACK – Silverlight Ad Creation Kit)

Foi hoje lançado o SACK – Silverlight Advertising Creation Kit, é um bom exemplo para demonstrar como é bastante simples de integrar anúncios em aplicações Silverlight 2, ou simplesmente em páginas (estáticas ou dinâmicas) de internet.

Este kit tem também como objectivo a discussão sobre as várias técnicas de design para a criação de anúncios utilizando o Silverlight 2. Outra vantagem do kit, é que tem instruções passo a passo e o seu documento é bastante útil! Ora dêem uma vista de olhos, e vão ver que encontram uma documentação sobre a própria utilização do Silverlight muito útil, com técnicas e optimizações.

Existem 5 exemplos neste kit, pretende focar os vários tipos de anúncios:

Anúncios “educados”;

Estudo de comportamento (tracking);

Sincronização;

Suporte com uso de TAG;

Painel expansível sobre a página;

Exemplo do anúncio com painel extensível sobre a página:

Os anúncios na Internet, efectivamente são uma realidade, e além deste Kit fornecer opções, sugestões e técnicas para a criação de anúncios em Silverlight 2, explora e apela à criatividade dos Silverlightianos para que cada vez mais estes anúncios se aproximem dos consumidores.

O código e as animações que estes exemplos contêm são bastante simples e acessíveis para quem ainda não tem muita experiência com Silverlight. O Visual Studio 08, Blend 2 e o Silverlight Tools são necessários para se visualizar os exemplos.

Relembro para a documentação deste Kit, que se apresenta devidamente estruturada e bastante instrutiva para o desenvolvimento em Silverlight 2.

[cross posted: http://xamlpt.com/blogs/chaves/archive/2009/04/02/publicidade-em-silverlight-sack-silverlight-ad-creation-kit.aspx]

Menu de contexto em Silverlight 2 e 3 (c/Demo)

Nas aplicações em Silverlight, existe o menu de contexto do plugin que contem a informação da versão do plugin instalado e também, na versão 3 do silverlight, a opção de instalarmos a nossa aplicação e assim tirar partido da funcionalidade de “out of Browser experience” .

Como personalizar este menu?

Apesar das boas práticas no desenvolvimento em Silverlight, indicarem que não se deve sobrepor este menu, existe forma de o substituir, e criar um novo menu, ou utilizar o clique direito do rato para a aplicação.

A única forma é mesmo utilizar as técnicas abaixo, até porque não é possível em Silverlight 2 e 3, personalizar o menu de contexto do plugin!

Problemas?

Sim, existe alguns pontos que devemos ter em atenção para se substituir o menu de contexto do plugin, e garantir que tanto em IE como em FireFox funcione correctamente.

Se utilizarmos as seguinte linhas:

System.Windows.Browser.HtmlPage.Document.AttachEvent("oncontextmenu", this.OnContextMenu);

private void OnContextMenu(object sender, System.Windows.Browser.HtmlEventArgs e)
{
MessageBox.Show("You click at " + e.OffsetX + "," + e.OffsetY);
e.PreventDefault();
}

Apenas em IE é que o comportamento será o esperado. Porquê? Esta questão tem a ver com o funcionamento que o DOM do FireFox (camada existente entre o plugin e o núcleo do browser. Normalmente onde o JavaScript e outros, se executam) tem com os objectos no browser, e os disponibiliza para os plugins que estão a ser utilizados na janela.

Solução?

Sim existe, este exemplo contém duas classes que resolvem o problema acima. Desta forma é possível esperar o mesmo comportamento gerado pelo clique direito do rato, sobre o plugin do Silverlight.

O exemplo, contém então alguns métodos Scriptables, estes métodos permitem que sejam acedidos por JavaScript. Isto significa que o Javascript em execução no browser consegue de certa forma manipular o comportamento da nossa aplicação. :)

Uma vez que os diferentes browsers têm pequenas diferenças na camada DOM, é sempre possível lidar com este tipo de métodos e portanto garantir que a nossa aplicação tenham o comportamento esperado.

Onde está a diferença?

A técnica que é usada para o FireFox é através da utilização de uma DIV:

this.pluginBlocker = HtmlPage.Document.CreateElement("div");

this.pluginBlocker.SetStyleAttribute("width", "100%");

this.pluginBlocker.SetStyleAttribute("height", "100%");

this.pluginBlocker.SetStyleAttribute("position", "absolute");

this.pluginBlocker.SetStyleAttribute("top", "0px");

this.pluginBlocker.SetStyleAttribute("left", "0px");

this.pluginBlocker.SetStyleAttribute("zIndex", "100");

this.pluginBlocker.SetStyleAttribute("display", "none");

e esta fica à frente do menu de contexto do plugin do Silverlight, e nota que é necessário que a propriedade de windowless do plugin do silverlight esteja a TRUE , para que tudo isto funcione.

<param name='windowless' value='true'/>

Extensibilidade

No exemplo, a biblioteca Contextmenu.cs permite-nos definir o comportamento dos eventos e dos seus handlers para que exista mais liberdade no tratamento e na utilização desta funcionalidade.

Basta abrir o projecto e corrê-lo, e neste caso substituiu-se o menu de contexto por uma caixa de texto, esta é desenhada na posição onde foi clicado com o rato. Isto porque, se utilizou também o método GetPosition que dado um controlo, retorna a posição onde o mesmo se encontra.

Pode-se aproveitar este exemplo, para se usar um menu de contexto próprio com um controlo de Silverlight, e aproximar a experiência de utilização da aplicação com o que já estamos mais habituados a usar.

Alguns exemplos de controlos para menus de contexto:

http://www.onteorasoftware.net/post/Silverlight-20-Create-a-context-menu.aspx

http://www.vectorlight.net/controls/menu_(popup).aspx

 

[cross posted: http://xamlpt.com/blogs/chaves/archive/2009/04/01/menu-de-contexto-em-silverlight-2-e-3-c-demo.aspx ]