Mock-up é uma maquete ou um modelo em tamanho real de um projeto. Utilizado para o ensino, demonstração, avaliação de concepção e outras finalidades. Um Mock-up é um protótipo e mostra pelo menos alguma funcionalidade que o projeto real visa ter.

O SketchFlow é um recurso da família Microsot Expression Studio Ultimate, que lhe da a capacidade, rapidez e eficácia de mapear o fluxo de uma aplicação de interface com o usuário através de layout de telas permitindo a transição de um estado para outro. Esta habilidade permite explorar e testar várias idéias sem investir grandes quantidades de tempo, mostrando ao seus clientes que você é capaz de encontrar a solução certa para eles.

Com o SketchFlow os clientes podem testar diversos cenários e fornecer um feedback para a equipe de desenvolvimento, através de comentários, anotando a sua experiência enquanto navegam pelo protótipo.

Então vamos começar!!!

Um cliente te ligou solicitando a criação de uma tela para a consulta de pedidos de compra feitos no dia que deve mostrar o número de vendas/hora por vendedor. Você logo imaginou o que o cliente queria e iniciou o desenvolvimento do protótipo de tela.

Para isso inicie o Microsoft Expression Blend 4 + Skecth Flow e na guia Projects escolha New Project, e então na tela New Project escolha Silverlight SketchFlow Application e nomeie o protótipo com o seguinte nome PurchaseRequestSample então click em OK, conforme a figura 1 logo abaixo.

Figura 1 – Criando o projeto para o protótipo da tela.

Na barra de ferramentas do blend clique em Assets (recursos) e então na árvore selecione SketchFlow –> Styles –> SketchStyles clique no controle TitleLeft-Sketch e então desenhe no topo da página. Com um duplo clique no controle você poderá editar o texto ou então utlizar a barra de propriedades no grupo Common Properties propriedade Text.

Figura 2 – Selecionando o controle.

Figura 3 – Controle desenhado no topo da página.

Figura 4 – Barra de propriedades.

Existem algumas coisas importantes que você precisa saber ao utilizar o Expression Blend.

Utilize essa seta, quando você quiser redimensionar os controles. Quando o controle estiver selecionado ele ficará de forma parecida como o da imagem abaixo, mostrando as áreas em que você pode manipular o mouse para redimensionar o controle. Podemos também manipular as âncoras do controle. Quando a âncora está habilitada ela fica dessa forma e quando desabilitada dessa . Quando habilitada; a medida em que a página for redimensionada o controle também será. Isso depende das configurações de âncora que você definiu, nesse caso o controle é redimensionado quando todas as âncoras estão habilitadas. Para habilitar ou desabilitar as âncoras basta dar um clique em cima dela. Utilize essa seta, quando você quiser mover os controles. Utilize a “Mãozinha” para mover a página dentro do Expression Blend sem desorganizar os controles. Utilize a Lupa para aumentar o zoom da página. Mantenha a tecla ALT pressionada enquanto clica para reduzir o zoom. Utilize para inserir textos na página. BasicTextBlock-Sketch para Labels e BasicTextBox-Sketch para caixas de texto. Utilize para inserir controles de usuário como botões, caixas de seleção, etc…

Agora, vamos criar um subtítulo para a tela, para isso em Assets –> Sketch Styles selecione SubtitleLeft-Sketch e adicione o controle logo abaixo do título, então altere o texto para “Vendas hora por vendedor”. Você pode encontrar os controles facilmente fazendo buscas conforme a figura 5.

Figura 5 – Localizando os controles mais facilmente.

Mude o tamanho da fonte do controle para 14, através da barra de propriedades conforme a figura 6.

Figura 6 – Mudando o tamanho da fonte

Agora vamos inserir um retangulo abaixo do subtítulo para simular uma caixa de listagem, para isso pesquise em Assets por rect para localizar o controle Rectangle-Sketch.

A sua página deverá ficar como a figura 7 ao executar o protótipo. Para executar o protótipo pressione a tecla F5 ou vá para o menu Project e clique na opção Run Project .

Figura 7 – Página esperada até o momento.

Em algum momento teremos de redimensionar a página que está sendo criada. Uma coisa que você precisa saber é que toda a página ou UserControl criado pelo Expression Blend por padrão tem um controle Grid nomeado de LayoutRoot é nele que adicionamos os nossos controles. Através da barra de ferramentas Objects and Timeline podemos observar como os nosso controles estão organizados. Veja a figura 8.

Figura 8 – Objects and Timeline

Todos os controles que estão no UserControl podem ser observados através dessa barra de ferramenta. Cada controle possui um símbolo de um olho , clique nele para ocultar ou mostrar os controles que estão na página. Você também pode travar os controles evitando que eles se movam acidentalmente, para isso clique ao lado do símbolo do olho para habilitar o cadeado.

Figura 9 – TextBlock Travado.

O controle Grid “LayoutRoot” é redimensionado junto com a página, pois todas as suas âncoras estão habilitadas por padrão. Como queremos aumentar a página devemos clicar em UserControl na barra Objects and Timeline e então clicar na seta de redimensionamento e redimensionar a página conforme o desejado.

Quando estamos redimensionando a página podemos notar que os controles acompanham o redimensionamento do controle pai. Caso você não queira que eles acompanhem desabilite as âncoras.

Agora vamos inserir alguns retângulos dentro do rentâgulo criado anteriormente e dentro de cada retângulo adicione um controle BasicTextBlock-Sketch com o nome do vendedor.

Figura 10 – Selecionando o controle BasicTextBlock-Sketch

Deixe o nome dos vendedores em negrito selecionando B “Bold” através da barra de propriedades no grupo Text.

Figura 11

A página deverá ficar conforme a figura 12.

Figura 11

Vamos redimensionar a página e adicionar mais controles até que ela fique da seguinte forma.

Figura 12

As setas do lado direito foram desenhas através dos controles Block Arrow Down Sketch e Block Arrow Up Sketch, elas foram redimensionadas até que ficassem dessa forma.

As cores dos retângulos foram aplicadas através do grupo Brushes da barra de propriedades, selecionando Background e aplicando a cor desejada.

Figura 13

Nesse post conhecemos o SketchFlow e aprendemos diversos detalhes do Expression Blend. Aprendemos como adicionar controles a página, redimensioná-los e alterar suas propriedades.

No próximo post adicionaremos fluxos de navegação a esse protótipo, e será demonstrado como o cliente pode fornecer um feedback para a equipe de desenvolvimento.

Veja o protótipo desse post clicando aqui ou um mais completo aqui.

Continue acompanhando novidades através do blog da FlexDev e do meu blog no wordpress, até o próximo artigo.

Neste artigo será apresentada uma pequena introdução ao desenvolvimento de projetos mobile com o Windows Phone 7, o Windows Phone 7 ou WP7, é o mais recente sistema operacional da Microsoft para a plataforma mobile, foi projetado para proporcionar ao desenvolvedor a criação de aplicativos com recursos interativos e ricos, seu visual é simples, agradável e moderno. Para o desenvolvimento de aplicativos para essa plataforma a Microsoft investiu praticamente no Microsoft Silverlight e no Framework XNA.

O Silverlight pode ser utilizado para diversas finalidades, mas sua força está na criação de aplicativos de negócios em geral, utilizando a plataforma .net. Além do WP7 é possível utilizar o Silverlight para criar projetos web , rodando no browser ou até mesmo criar projetos Silverlight que rodam instalados fora do browser.

O XNA é um framework completo para o desenvolvimento de games, tanto para PCs com o Windows, como para o XBOX 360 e o Windows Phone 7, é possível criar jogos com o Silverlight , mas como o XNA foi concebido com esse propósito ele tem um suporte melhor para a criação de games mais complexos.

Se você já programa em C# .net ou até em Silverlight, você poderá aproveitar e aplicar seus conhecimentos para criar aplicativos para o WP7, neste artigo será apresentado como preparar o ambiente de desenvolvimento para você iniciar a criação de aplicativos para o Windows Phone 7 com Silverlight utilizando o Visual Studio 2010 ou com o Expression Blend.

O Ambiente de desenvolvimento para o WP7 é totalmente gratuito, você poderá utilizar o Visual Studio 2010 Express, o Visual Studio é a principal IDE da Microsoft para o desenvolvimento de aplicativos para a plataforma .net, neste artigo vou usar a versão Premium do Visual Studio 2010 , mas você poderá utilizar os mesmos conceito na versão Express (gratuita).

Uma ferramenta muito interessante e com total suporte ao Windows Phone 7 é o Expression Blend 4, o Blend é uma ferramenta completa para a criação de layouts aprimorados, com suporte ao Windows Phone, nela diversas tarefas são realizadas com a ajuda do mouse, os códigos XAML são gerados automaticamente conforme você manipula visualmente o layout das telas, além de praticidade e produtividade ele também possui um emulador do Windows Phone e diversos recursos para o designer da aplicação. 

Ambiente de desenvolvimento – Windows Phone 7 Developer Tools

Para iniciar o desenvolvimento com o WP7 você vai precisar instalar o Windows Phone Developer Tools  RTW , ele está disponível para o Windows Vista e Windows 7, o programa inclui os seguintes aplicativos:

Para outras informações sobre o ambiente gratuito de desenvolvimento para o WP7 clique aqui.

Inicie a instalação do Windows Phone Developer Tools RTW, se você tiver alguma versão incompatível instalada,  o software vai alertá-lo, a primeira etapa é aceitar a licença do programa, em seguida aparecerá uma tela com o botão “Install Now”, clique  para iniciar a instalação, você poderá neste momento alterar o diretório de instalação, Figura 1, se clicar no botão Customize.

O Windows Phone Developer Tools iniciará a instalação dos programas e você verá a tela da Figura 2 assim que a instalação de todos os programas for completada.

Figura 1. Customizando a Instalação do Windows Phone Developer Tools

Figura 2. Instalação concluída do Windows Phone Developers Tools

Os programadores Visual Basic tem um Windows Phone Developers Tools específico neste link Visual Basic for Windows Phone Developer Tools – RTW.

Criando uma aplicação no Visual Studio 2010

Abra o Microsoft Visual Studio 2010 e clique em File->New->Project, cinco opções são apresentadas como modelos de projetos para o Windows Phone, o primeiro é o Windows Phone Application, nele temos um projeto básico com o mínimo necessário para criar uma aplicação WP7, a segunda opção é a Windows Phone Databound, que permite criar uma aplicação baseada em um modelo capaz de trabalhar com uma lista de dados e com controle de navegação,  a terceira opção é a Windows Phone Class Library, onde é possível criar uma biblioteca para o Windows Phone, em seguida temos o Windows Phone Panorama Application, que cria um projeto com um modelo de navegação muito comum no Windows Phone, onde é possível através do toque na tela andar pela aplicação e navegar em suas listas de dados e por ultimo temos o Windows Phone Pivot Application, onde está disponível um controle Pivot para ser usado na aplicação.

Figura 3. Tipo de projetos para Windows Phone no Visual Studio 2010

Como o foco do artigo não é a criação de uma aplicação para o Windows Phone 7 e sim somente dar uma introdução ao desenvolvimento para a plataforma, vamos criar um projeto do tipo Windows Phone Panorama Application e modificar somente em dois pontos e em seguida visualizar as alterações.

No código fonte da aplicação (XAML), vamos modificar o título da aplicação e o cabeçalho do primeiro item do controle panorâmico, localize o controle  Panorama e modifique o parâmetro Title para um nome qualquer, em seguida faça o mesmo com a propriedade Header do controle PanoramaItem, veja a Figura 4.

Figura 4. Modificando o fonte do projeto Windows Phone Panorama Application

Agora clique no play do Visual Studio 2010 para executar a aplicação e visualizar o emulador do Windows Phone 7, Figura 5 e 6.

Figura 5. Executando a aplicação no emulador do Windows Phone 7

Figura 6. Emulador do Windows Phone 7 no Visual Studio 2010

Abrindo a aplicação no Expression Blend 4

O Expression Blend é um aplicativo que auxiliar na parte gráfica da aplicação, com ele temos uma ferramenta gráfica e com recursos específicos para essa finalidade, um bom exemplo e a criação de animações em sua aplicação, vamos supor que você queira animar um determinado elemento, seja uma imagem ou um botão, por exemplo,a vantagem de utilizar o Blend nesta tarefa é a possibilidade de gravar toda a animação na tela e ele automaticamente gera todo o código XAML, poupando dezenas de linhas de códigos que seriam digitadas no Visual Studio 2010.

O Microsoft Expression Blend for Windows Phone é um dos aplicativos instalados pelo Windows Phone Developers Tools, existe também uma versão para uso do Silverlight  que é a que estou usando neste artigo, chamada de Expression Blend 4, que faz parte do pacote do Expression Studio 4, integrado com o Visual Studio 2010 e que também funciona para programar para o Windows Phone 7.

Saiba mais sobre o Expression Studio 4 neste artigo da .net Magazine.

O Expression Blend é integrado ao Visual Studio 2010, basta clicar no seu projeto com o botão direito do mouse e clicar em Open in Expression Blend, Figura 7, qualquer modificação feita nas ferramentas já é atualizado na outra assim que uma é acionada.

Figura 7. Emulador do Windows Phone 7 no Visual Studio 2010.

Figura 8. Expression Blend 4.

App Hub

Os aparelhos com o Windows Phone 7 ainda não chegaram ao Brasil, o jeito é aguardar ou adquirir um aparelho importado, depois que você já preparou o ambiente de desenvolvimento e já está desenvolvendo aplicativos com a tecnologia Silverlight ou XNA, você vai querer testar o aplicativo no próprio aparelho e ainda começar a ganhar dinheiro enviando sua aplicação para o Windows Phone Marketplace, o Windows Phone Marketplace é onde você pode testar e comprar aplicativos, jogos, músicas para o seu Windows Phone 7.

O Windows Phone Marketplace já está aberto para que os desenvolvedores possam enviar seus aplicativos, para que você possa criar aplicações e vender no Marketplace você vai precisar desbloquear o equipamento e criar uma conta no site App Hub, vamos ver agora passo a passo como realizar esse procedimento.

1. Acesse o site http://create.msdn.com/en-US .
2. Clique em Sig-in .
3. Entre com o seu Window Live ID .
4. Selecione o tipo de conta: Company (Empresas), Individual (desenvolvedor individual) ou Student (estudante que participa do projeto DreamSpark) .

As contas do tipo Company e Individual tem um custo anual de $99, se você é estudante, participe do projeto DreamSpark, atualmente o Dreamspark é a única forma de participar do App Hub sem custos, no meu caso eu selecionei um conta de desenvolvedor individual.

Figura 8. Tipo de conta no App Hub

5. O próximo passo é digitar algumas informações pessoais como nome, endereços e email, no campo Publisher Name, você informará o nome que aparecerá no Windows Phone Marketplace.
6. Selecione a imagem que será apresentada quando você participar de fóruns do App Hub.

Figura 9. Imagem que será apresentada nos fóruns.

7. Se você não selecionou o tipo Student (Dreamspark), será necessário pagar uma taxa anual para enviar aplicativos para o Windows Phone Marketplace, está disponível atualmente o pagamento via cartão de crédito VISA e MASTERCARD.

8. A última etapa e a confirmação do email e de sua identidade, no caso da conta individual, ambos são feitos por e-mail. Você receberá uma e-mail alguns dias após o cadastro para validar a sua identidade, no caso de desenvolvedor individual é necessário enviar uma cópia da sua carteira de motorista ou passaporte.

Figura 10. Conclusão do cadastro no App Hub.

Na página do App Hub, no link Devices, aparecerão os aparelhos que você vai desbloquear e poderá realizar o deploy no Visual Studio 2010 antes de publicar no Windows Marketplace. 

Zune

O Zune é o software que irá fazer a sincronização da sua aplicação no Visual Studio 2010 e o equipamento, para mais informações sobre o Zune veja no blog do MSDN.

Faça o Download da última versão do Zune no site oficial.

Desconecte o seu aparelho do computador, caso esteja conectado, feche todos os aplicativos abertos e inicie a instalação, a primeira etapa é aceitar a licença do ZUNE, em seguida o software é instalado. Quando você receber a mensagem de “INSTALAÇÃO DO SOFTWARE DO ZUNE CONCLUÍDA”, clique em fechar, uma tela será apresentada com as etapas de configurações do ZUNE, a primeira configuração e a tela abaixo onde você vai inserir o nome que o equipamento vai ter no software do ZUNE, no equipamento e no site.

Figura 11. Nome do telefone no ZUNE

Conecte o seu celular via USB e deixe o windows realizar a instalação dos drivers, agora você já tem o seu aparelho sincronizado com o ZUNE.

Figura 12. Dados do aparelho sincronizado

Registrando o aparelho no Windows Phone Developer

Este é o último passo antes de você iniciar o deploy com o Visual Studio 2010 e enviar sua aplicação ao Marketplace, vamos agora registrar a conta como desenvolvedor, no menu iniciar do Windows, localize o menu Windows Phone Developer Tools e clique em Windows Phone Developer Registration.

Figura 13. Registro de desenvolvedor

Deploy no Visual Studio 2010

No menu do Visual Studio 2010, localize o combo onde está escrito Windows Phone 7 Emulator e altere para Windows Phone 7 Device, selecione o projeto no Solution Explorer do Visual Studio com o botão  direito do mouse e clique em deploy. O Zune deverá sempre estar ativo para realizar a sincronização com o equipamento.

Figura 14. Deploy no Visual Studio 2010

Conclusão

Com a evolução dos aparelhos de celulares e smartphones, o mercado mobile está crescendo assustadoramente a cada ano, os novos equipamentos estão recheados de novos recursos e com isso a necessidade de que tenha um sistema operacional capaz de aproveitar ao máximo tudo que as novas tecnologias estão oferecendo, é neste cenário que a Microsoft apresenta o seu Windows Phone 7.

O Windows Phone Marketplace está recheado de aplicativos e games, o potencial do sistema operacional da Microsoft é muito positivo, particularmente eu acho o sistema operacional fantástico e de incrível liberdade de desenvolvimento para os desenvolvedores .net, principalmente pela produtividade e pelo fato de aproveitar os conhecimentos já adquiridos em C#, Visual Basic, XNA e Silverlight, enquanto o Windows Phone ainda não está disponível aqui no Brasil , podemos criar aplicações com as ferramentas gratuitas da Microsoft.

Links Interessantes:

http://winphoneblog.com.br/ 

http://channel9.msdn.com/Series/Windows-Phone-7-Development-for-Absolute-Beginners

http://www.devmedia.com.br/post-17986-Windows-Phone-7-e-Silverlight-4.html

http://www.charlespetzold.com/phone/

http://www.devmedia.com.br/post-18740-Animacoes-no-Windows-Phone-7.html

http://blogs.msdn.com/b/jpclementi/archive/2011/02/02/links-mais-importantes-para-o-windows-phone-7.aspx?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+clementi+%28Falando+de+novidades+e+tecnologias+Microsoft%29

http://www.microsoft.com/showcase/en/us/related?video=bda22419-a49e-4ef6-973d-f9c6d59aa525

FAQ

Este artigo trata de um overview da mais nova versão das ferramentas contidas no pacote Microsoft Expression. Lançado recentemente, o Expression 4 possui importantes ferramentas para o dia-a-dia do desenvolvedor, designer e híbridos (profissionais que atuam tanto na criação e concepção de conceitos e design, até navegação, experiência do usuário e desenvolvimento da aplicação e/ou websites).

Escrevi o artigo junto com o Fernando Martin (Caverna), evangelista de desenvolvimento web com foco em ferramentas e prototipagem, integrante de time de de especialistas e comunidades da Microsoft Brasil.

Saiba mais:  http://www.devmedia.com.br/post-18487-Revista–net-Magazine-Edicao-79.html

Twitter: @atsh2

Olá pessoal!

Estamos na edição 19!
São 42′ de boa informação. Ouça, comente e aproveite os links abaixo.

• Silverlight Media Framework 2.0 (07/07)
• XAML Power Toys for VS2010
• Power Tools no ScottGu’s Blog
• RTW do WPF Ribbon Control
• Visual Studio LightSwitch
  • Vídeo no CH9: Anúncio no VSLive!
  • Post no blog do Somasegar
  • Lançamento previsto para o dia 23 de agosto de 2010
• Behaviors
  • Top 5 Silverlight Behaviors
  • Microsoft Expression Gallery (Silverlight Behaviors)

Para assinar:

• Feed RSS: http://www.xamlcast.net
• iTunes/iPod: pcast://www.xamlcast.net
• Zune: zune://subscribe/?XAMLCast=http://www.xamlcast.net

O XAMLCast também está no Twitter!

• Twitter oficial: @xamlcast (e hashtag #xamlcast)
• Siga os XAMLCasters:
  • @kelps
  • @robertos_br
  • @rodrigokono
• Adicione o Twibbon do XAMLCast ao seu avatar!
  • http://twibbon.com/join/XAMLCast

Até o próximo!

Abraços,

Kelps, Roberto Sonnino e Rodrigo Kono

Olá, pessoal esse é uns dos primeiros POST’s que estarei fazendo aqui na FlexDev sobre Silverlight e tecnologias .NET, meu nome é Rodrigo da Silva Brito e trabalho na flexdev desde abril de 2009, comecei a trabalhar com desenvolvimento de sistemas em 2004 na TreinaSoftware, trabalhava com Visual Basic 6, MySQL e o grande e famoso Microsoft Access. Em 2006 comecei a estudar .NET e C#, me apaixonei por C# e estou até hoje nessa caminhada de estudos. No momento estou terminando o bacharelado em ASTI (Análise de Sistemas e Tecnologias da Informação) pelo Centro Paula Souza – FATEC Ourinhos, e escrevendo a minha monografria sobre frameworks de persistência. Possuo um blog do qual estou ressuscitando, você pode acessá-lo através do seguinte endereço http://rodrigobrito.wordpress.com. Agora vamos ao que interessa!

Para começarmos você vai precisar ter instalado em sua máquina o Microsoft Visual Studio 2010. Neste artigo estarei utilizando a versão Premium, precisaremos também do Microsoft Silverlight 4 Tools for Visual Studio 2010 que é um pré requisito para desenvolver aplicações em Silverlight 4 e aplicações Ria Services através do Visual Studio 2010. Precisaremos também do Microsoft Expression Blend® 4 Release Candidate (RC).

1. Inicie o Microsoft Visual Studio 2010

2. No menu File passe o mouse sobre New, e então selecione New Project

3. A caixa de diálogo New Project será exibida

4. Em Installed Templates no lado esquerdo da janela selecione Visual C# e então selecione Silverlight. Selecione Silverlight Application e verifique se na caixa de seleção superior está selecionado o .NET Framework 4. Em Name colocaremos o nome de nossa aplicação no caso FirstSilverlightApplication e então click em OK.

5. Na caixa de diálogo New Silverlight Application desselecione Host the Silverlight application in a new Web site e em Silverlight Version verifique se Silverlight 4 está selecionado e então click em OK.

6. Após clicado em OK você terá uma tela como esta.

Criando Controles

Os controles podem ser adicionados a aplicação usando o ToolBox do Visual Studio ou editando o texto XAML diretamente no editor XAML.

1. Selecione o controle TextBlock e o arraste a MainPage.xaml.

A. Altere a propriedade Text do controle para Contatos.

B. Altere o tamanho da fonte do controle para 14, através da propriedade FontSize.

C. Deixe a fonte em negrito através da propriedade FontWeight selecionando Bold.

2. Selecione o controle Border e o arraste a MainPage.xaml, altere a propriedade CornerRadius para 5.

3. Arraste o controle Grid para dentro do controle Border, então resete as propriedades Height e Width do Grid.

4. Arraste controles TextBlock e TextBox para dentro do controle Grid de forma que a página fique conforme a figura abaixo.

Como você já deve ter percebido, todas as mudanças feitas através da ToolBox Properties são refletidas instantaneamente no código XAML. Veja abaixo o código XAML referente ao controles TextBlock e TextBox que adicionamos dentro do grid.

 <Grid>
         <TextBlock Height="20" HorizontalAlignment="Left" Margin="6,9,0,0" VerticalAlignment="Top" Width="74" Text="Nome:" TextAlignment="Right" />
         <TextBox Height="23" HorizontalAlignment="Left" Margin="86,6,0,0" Name="txtNome" VerticalAlignment="Top" Width="282" />
         <TextBlock Text="Empresa:" Height="20" HorizontalAlignment="Left" Margin="6,37,0,0" VerticalAlignment="Top" Width="74" TextAlignment="Right" />
         <TextBlock Text="Cargo:" Height="20" HorizontalAlignment="Left" Margin="6,66,0,0" VerticalAlignment="Top" Width="74" TextAlignment="Right" />
         <TextBlock Text="E-mail:" Height="20" HorizontalAlignment="Left" Margin="6,94,0,0" VerticalAlignment="Top" Width="74" TextAlignment="Right" />
         <TextBlock Text="Telefone:" HorizontalAlignment="Left" Margin="6,123,0,107" Width="74" TextAlignment="Right" />
         <TextBlock Text="Observações:" Height="20" HorizontalAlignment="Left" Margin="0,149,0,0" VerticalAlignment="Top" Width="80" TextAlignment="Right" />
         <TextBox Height="23" HorizontalAlignment="Left" Margin="86,35,0,0" Name="txtEmpresa" VerticalAlignment="Top" Width="282" />
         <TextBox Height="23" HorizontalAlignment="Left" Margin="86,64,0,0" Name="txtCargo" VerticalAlignment="Top" Width="282" />
         <TextBox Height="23" HorizontalAlignment="Left" Margin="86,92,0,0" Name="txtEmail" VerticalAlignment="Top" Width="282" />
         <TextBox Height="23" HorizontalAlignment="Left" Margin="86,121,0,0" Name="txtDDI" VerticalAlignment="Top" Width="41" />
         <TextBox Height="23" HorizontalAlignment="Left" Margin="133,121,0,0" Name="txtDDD" VerticalAlignment="Top" Width="41" />
         <TextBox Height="23" HorizontalAlignment="Left" Margin="180,121,0,0" Name="txtTelefone" VerticalAlignment="Top" Width="188" />
         <TextBox Height="95" HorizontalAlignment="Left" Margin="86,149,0,0" Name="txtObservacoes" VerticalAlignment="Top" Width="282" />
 </Grid>

5. Aumente o tamanho da página “Height” e arraste dois controles Button, botões Salvar e Cancelar. Altere as suas propriedades Content e Name respectivamente.

Imagem da página criada:

Código XAML completo da página:

Nos próximos artigos de Silverlight estaremos complementando essa pequena aplicação, iremos criar o Grid para a listagem de contatos, botões de inclusão, edição e deleção. Utilizaremos WCF para acesso aos dados.

O WCF para quem não conhece é um poderoso framework para a criação de aplicações orientadas a serviço.

Até o próximo artigo!

INTRODUÇÃO

Boa noite Galera!

Hoje gostaria de compartilhar com vocês, uma postagem com as principais características, das mais comentadas tecnologias de desenvolvimento de aplicações RIA(Rich Internet Applications) do mercado, o Microsoft Silverlight e o Adobe Flex.
São ao todo 20 características destacadas, sendo que elas foram aplicadas nas últimas versões das plataformas destacadas.
Gostaria da opinião de vocês, meus amigos leitores e desenvolvedores, até mesmo para que possam avaliar o conteúdo, caso eu tenha descrito algo errado. Lembrando que a intenção desta postagem, não é denegrir nenhuma tecnologia, mas sim, apresentar suas características!

Abaixo, segue a tabela:

Obrigado pessoal!

Abs.

Robson Fernandes

Boa noite Galera!

Muito show! Para aqueles que não tiveram a oportunidade de baixar a nova versão do Expression Studio, não perca tempo, pois está muito demais.
Há varias melhorias nos aplicativos, que incluem o:

- Microsoft Expression Blend 4
- Microsoft Expression Design 4
- Microsoft Expression Web 4
- Microsoft Expression Encoder 4

Acesse aqui, e baixe agora mesmo Microsoft Expression Studio 4

Abs.

Robson Fernandes

Acabei de publicar no Expression Gallery uma behavior para filtrar imagens em uma colleção do Deep Zoom.

Essa behavior, quando aplicada a um objeto do tipo MultiScaleImage, permite que se filtre as imagens dessa coleção de forma semelhante ao que acontece no site Memorabilia do HardRock Café.

O uso da behavior é muito simples:

• Anexe a behavior à um objeto MultiScaleImage.
• Defina as propriedades Source e MetadataUri da behavior respectivamente para a url da galeria e o arquivo de metadados da galeria.
• Defina o valor da propriedade Filter da behavior para o filtro que quer aplicar.

A behavior trabalha com o arquivo de metadados gerado pelo Deep Zoom Composer para saber quais tags estão associadas a cada imagem. Ela entende tags separadas por vírgula (,) tanto para atribuir às imagens quanto para filtrar. Filtrar por múltiplas tags vai exibir todas as imagens que tenham pelo menos uma das tags do filtro.

O arquivo de metadados não precisa ser necessáriamente o mesmo gerado pelo Composer, mas deve ter o mesmo formato. A behavior o campo ZOrder do arquivo de metadados para saber qual é cada imagem, portanto, se esse arquivo for gerado manualmente deve se tomar o cuidado de garantir que estão sendo atribuídas as tags às imagens certas e sempre que a galeria for atualizada o arquivo de metadados também precisará ser atualizado.

A behavior também expõe uma propriedade (AvailableTags) que é um array contendo todas as tags disponíveis na galeria atual. Isso pode ser bem útil se quisermos exibir na tela todas as tags, como fiz no exemplo que está no Expression Gallery.

Cada vez que o filtro for alterado, a galeria será filtrada e ocorrerá uma animação para exibir as imagens desejadas. É possível controlar o tempo dessa animação e sua função de Easing.

As imagens são posicionadas de forma a preecher o espaço do controle da melhor forma possível, mas ainda preciso melhorar a lógica para quando apenas uma imagem é exibida.

Também há espaço para melhorias no algorítmo de posicionamento, no que diz respeito ao alinhamento das imagens do lado direito.

O código fonte está disponível no Codeplex. Sugestões, melhorias e bug fixes podem ser reportados lá ou aqui no blog.

Em breve estarei aumentando essa biblioteca do Codeplex com outras behaviors e helpers.

Ahhh, quem gosta de futebol pode ver essa behavior em ação em http://www.msnnacopa.com.br.

Pessoal, nesse sábado (17) irei ministrar um HandsOn Lab de Silverlight aqui em Vitória.
O evento está sendo organizado pelo grupo MSDev-ES e é uma ótima oportunidade para quem deseja ingressar no universo Silverlight. Compareça!

Segue o folder do evento, mais informações e o link de inscrição.
Vejo vocês lá!
–

Visão Geral do Evento:

O HandsOn Lab foi criado a partir de solicitação de participantes do Community Launch Vitória e vai abranger a tecnologia como um todo. Iniciando com uma breve introdução à tecnologia e mostrando, em paralelo com a prática, desde o momento da prototipação da aplicação com SketchFlow, passando pelas ferramentas para desenvolvimento que incluem Expression Blend, DeepZoom e WCF e encerrando com a implantação da aplicação em um website utilizando o Expression Web.

Palestrante: Fabriccio Correia Bernardes.

Incrições: https://msevents.microsoft.com/CUI/EventDetail.aspx?EventID=1032449548&Culture=pt-BR

INTRODUÇÃO

Boa noite pessoal!  Galera, eu disponibilizei no Microsoft Expression Gallery, um aplicativo para fazer cálculos matemáticos simples (calculadora), chamado Modern Calculator, ele foi desenvolvido no Expression Blend 4,  e utiliza os novos recursos de estilização de janelas do Silverlight 4 OOB, como no tão conhecido Adobe Air!

Todos os fontes estão disponíveis para download!

Deixe seu feedback no Microsoft Expression Gallery, ele é muito importante para mim. Muito Obrigado!

PREVIEW

Abs e Obrigado pessoal!

Robson Fernandes