Criar aplicativos da Windows Store usando o Blend for Visual Studio 2013

  • Artigo

O Blend for Visual Studio é um conjunto de ferramentas de design incluídas no Visual Studio 2013 que podem ser usadas para compilar aplicativos da Windows Store com as linguagens JavaScript, VB, C# ou C++.

Blend é instalado quando você instala o Visual Studio. Para localizar o Blend, digite Blend na caixa Pesquisar.

Você também pode abrir um projeto no Blend dentro do Visual Studio. Com o projeto aberto no Visual Studio, siga um dos seguintes procedimentos:

  • No menu Exibir, clique em Abrir no Blend.

  • Clique com o botão direito do mouse no arquivo no Gerenciador de Soluções e clique em Abrir no Blend.

    Abrir no comando de mesclagem do Visual Studio

Para aplicativos da Windows Store compilados com JavaScript, o Blend inclui um pacote de ferramentas HTML5 e CSS3 que permite a você executar tarefas, como criar rapidamente animações CSS3, definir e gerenciar estilos e depurar HTML e CSS. Para obter mais informações, consulte "Criando aplicativos da Windows Store (HTML)", posteriormente neste artigo.

Para criar seu primeiro aplicativo HTML da Windows Store com o Blend, consulte Criar seu primeiro aplicativo da Windows Store com o Blend, parte 1: a página mestra (HTML e JavaScript).

Para aplicativos da Windows Store compilados com VB C# ou C++, o Blend inclui um pacote de ferramentas XAML que ajuda você a executar tarefas, como aplicar rapidamente estilos a controles, criar e definir modelos e associar itens a dados de exemplo. Para obter mais informações, consulte "Criando aplicativos da Windows Store (XAML)", posteriormente neste artigo.

Para criar seu primeiro aplicativo HTML da Windows Store com o Blend, consulte Criar seu primeiro aplicativo da Windows Store com o Blend, parte 1: a página mestra (XAML e C#).

Para obter mais informações sobre as novidades no Blend, consulte O que há de novo para desenvolvedores HTML no Blend for Visual Studio 2013 e O que há de novo no Visual Studio 2013 Preview para a criação de aplicativos XAML da Windows Store no Blog do Visual Studio.

Usar o Blend com o Visual Studio

O Visual Studio fornece ferramentas essenciais para o desenvolvimento de aplicativos para a Windows Store, incluindo o gerenciamento de licença de desenvolvedor, o Designer de Manifesto e as ferramentas de codificação e empacotamento que tornam possível enviar seu aplicativo para a Windows Store.

Ao usar o Blend junto com o Visual Studio, você pode aproveitar as avançadas ferramentas de design HTML e XAML no Blend para personalizar, de forma fácil e rápida, a aparência de seu aplicativo. Você pode se concentrar em criar inteiramente seu aplicativo de forma visual, incluindo a estrutura, o layout, os modos de exibição de dados e a aparência do aplicativo, em vez de ter que se concentrar na sintaxe do código.

Para obter mais informações sobre como usar o Blend com Visual Studio, incluindo fluxos de trabalho recomendados e melhores práticas, consulte o Alternar para o Visual Studio e voltar novamente.

Você pode abrir e editar projetos de aplicativos da Windows Store criados no Visual Studio no Blend, assim como abrir e editar aplicativos da Windows Store criados no Blend no Visual Studio.

Você pode alternar entre o Blend e o Visual Studio enquanto estiver trabalhando em um projeto. Para alternar do Visual Studio para o Blend, clique com o botão direito do mouse no projeto em Gerenciador de Soluções e clique em Abrir no Blend. Para alternar do Blend para o Visual Studio, clique com o botão direito do mouse no painel Projetos e clique em Editar no Visual Studio.

Dica

Você pode ter o mesmo arquivo de projeto aberto no Blend e no Visual Studio ao mesmo tempo, no mesmo computador. Quando salvar uma alteração em um arquivo em uma ferramenta e alternar para outra, você receberá uma mensagem perguntando se deseja recarregar o arquivo para ver a versão mais recente do projeto.

Criar aplicativos da Windows Store (JavaScript e HTML)

Com o Blend, você cria novos aplicativos da Windows Store. É possível usar um dos modelos de projeto HTML interno ou abrir um aplicativo existente da Windows Store que tenha sido criado no Visual Studio. Assim como qualquer aplicativo nativo do Windows, um aplicativo da Windows Store compilado com HTML5, CSS3 e JavaScript tem acesso direto à plataforma subjacente e pode compartilhar informações com outros aplicativos.

Você pode modificar, de forma rápida, a aparência do aplicativo usando um conjunto de ferramentas de design HTML5 e CSS3 que permite a você:

  • Criar e modificar elementos HTML   Arraste e solte elementos HTML e controles de aplicativo do Windows do painel Ativos no artboard e modifique a hierarquia, defina propriedades e aplique estilos diretamente na interface de usuário. Consulte Criar e definir o estilo de um modelo de item.

  • Exibir estados de tempo de execução Use o modo interativo para acessar e modificar seu aplicativo em estados que estariam disponíveis somente em tempo de execução. Usar o modo interativo.

  • Exibir dados de tempo de design   Associe e exiba dados em seu aplicativo da Windows Store de forma que possa modificar, de maneira mais fácil, a aparência dos dados em tempo de execução. Consulte Associar dados do filme.

  • Fontes personalizadas inseridas   Use o gerenciador de família de fontes para inserir fontes personalizadas em seu aplicativo da Windows Store. Consulte Inserir uma fonte personalizada.

  • Criar animações CSS3   Crie e edite animações CSS3 usando a linha do tempo de animação de quadro chave interno.

  • Definir e gerenciar estilos Crie estilos CSS de forma rápida com o painel Regras de Estilo e use o painel Propriedades CSS para aplicar definições de estilo, exibir a cascata CSS para qualquer elemento (a regra virtual Propriedades Predominantes) ou determinar como o Windows 8.1 calculará os valores da propriedade CSS para cada elemento (a regra virtual Valores Calculados). Consulte Definir regras de estilo CSS.

  • Depurar HTML e CSS    Depure de forma visual HTML e CSS diretamente no Blend. Basta identificar e solucionar os erros exibidos no painel Resultados.

Para obter mais informações sobre as novidades para criar aplicativos da Windows Store compilados com JavaScript no Blend, consulte o blog do Visual Studio.

Criando aplicativos da Windows Store (VB/C#/C++ e XAML)

Com o Blend, você cria novos aplicativos da Windows Store. É possível usar um dos modelos de projeto XAML interno ou abrir um aplicativo existente da Windows Store que tenha sido criado no Visual Studio. Assim como qualquer aplicativo nativo do Windows, um aplicativo da Windows Store em XAML e VB, C# ou C++ tem acesso direto à plataforma subjacente e pode compartilhar informações com outros aplicativos.

Você pode modificar, de forma rápida, a aparência do aplicativo usando um conjunto de ferramentas de design XAML que permite a você:

  • Criar um layout personalizado   Use as avançadas ferramentas de layout, incluindo modelos, controles internos, réguas, guias e suporte a ajustes para criar layouts personalizados para seu aplicativo da Windows Store. Consulte Estilizar a exibição dos dados.

  • Criar e estilizar controles Arraste e solte controles na superfície de design e estilize-os por meio de modificação das propriedades diretamente na interface de usuário. Estilizar imagens e elementos.

  • Criar e editar modelos de controle   Use as ferramentas de edição de modelo para criar modelos de controle personalizados que podem ser reutilizados em todo o projeto. Adicione-os à sua biblioteca de controle para reutilizá-los em projetos fora do projeto atual. Consulte Transformar uma imagem em controle de usuário.

  • Criar e editar modelos de dados   Crie modelos que definam como você deseja que os dados sejam exibidos em seu aplicativo. Consulte Criar e estilizar as associações de dados.

  • Exibir dados de tempo de design e de exemplo   Associe e exiba dados em seu aplicativo da Windows Store de forma que possa modificar, de maneira mais fácil, a aparência dos dados em tempo de execução. Consulte Definir o DataContext.

  • Usar comportamentos para adicionar interatividade   Adicione interatividade a seu aplicativo. Basta arrastar um comportamento interno para o objeto na superfície de design e modificar as propriedades para atender às suas necessidades. Consulte Adicionar um comportamento interno

  • Editar marcação XAML   Além das ferramentas de interface de usuário que facilitam a criação e a modificação de XAML sem a necessidade de alterar código, o Blend também destaca o avançado editor XAML que permite a você fazer alterações de maneira fácil e rápida diretamente na marcação XAML. Consulte Depurar XAML no Blend.

Para obter mais informações sobre as novidades para criar aplicativos da Windows Store compilados com C#, C++, e VB no Blend, consulte oblog do Visual Studio.

Recursos

Além da documentação do Blend no Centro de Desenvolvimento do Windows, você encontrará uma grande variedade de recursos para ajudá-lo a começar a criar aplicativos da Windows Store, incluindo: