Criar um aplicativo Apache Cordova
Este artigo se refere ao Visual Studio Tools for Apache Cordova, que é um software de pré-lançamento. Os recursos descritos estão em pré-lançamento e sujeitos a alterações. Você pode baixar a visualização do Microsoft Download Center.
Um aplicativo criado usando o Visual Studio Tools para o Apache Cordova usa Cordova para acessar as APIs nativas usando tecnologias da web como HTML e CSS. Ao reduzir ou eliminar a necessidade de código nativo, aplicativos funcionam em vários dispositivos.
Algumas tarefas são comuns a maioria dos aplicativos de Cordova. Esses incluem:
Escolha uma estrutura JavaScript de terceiros
Criar uma interface do usuário
Adicionar recursos nativos (plug-ins)
Adicionar serviços conectados
Adicionar recursos específicos da plataforma
Teste, pacote, e de publicação
Criar um projeto de Cordova
Para obter uma introdução ao desenvolvimento com o Visual Studio Tools para Apache Cordova e uma descrição da estrutura do projeto para projetos de Cordova no Visual Studio, consulte Criar seu primeiro aplicativo Hello World.
Escolha uma estrutura JavaScript de terceiros
Normalmente, ao criar um aplicativo de Cordova, você também desejará incluir uma estrutura JavaScript de terceiros para facilitar o desenvolvimento de aplicativos ou seguir as práticas recomendadas para criar aplicativos. Você não está limitado a apenas uma única estrutura! (Nem é exigido. Essas estruturas não fazem parte do Cordova.)
Estruturas JavaScript de terceiros podem incluir uma variedade de recursos e características de design, como:
Padrões de design Model-View-Controller (MVC) para ajudar a preocupações de aplicativo separado. AngularJS e Backbone são apenas dois exemplos comuns disso.
Controles de interface do usuário e estilos. Uma estrutura de interface do usuário (ou biblioteca) normalmente inclui controles específicos, como um controle de grade e, às vezes, folhas de estilo CSS. Para obter mais informações, consulte criar uma IU.
Modelo de navegação. Estruturas como o AngularJS e código-fonte aberto WinJS, e outras estruturas fornecem um modelo de navegação de página única para ajudar a habilitar o comportamento do tipo de aplicativo.
Criar uma interface do usuário
Cordova aplicativos são executados em um controle WebView em todas as plataformas com exceção do Windows e Windows Phone 8.1, então, eles serão tendem a aparência de aplicativos web. Ao planejar uma experiência do usuário para os clientes, é importante pedir a duas perguntas:
Você deseja que seu aplicativo tenha a mesma aparência em plataformas diferentes?
Se seu alvo para uma nativa aparência e funcionalidade para cada plataforma, o custo de desenvolvimento será maior e uma nativa aparência e funcionalidade pode ser difícil obter.
Se você quiser uma nativa aparência e funcionalidade, é você visando uma plataforma específica mais do que outros?
Algumas estruturas de interface do usuário podem se parecer com o recurso aparência e funcionamento de uma plataforma específica. Mas, geralmente, eles fornecem uma experiência de marca e destinam-se para a mesma aparência em plataformas. Alguns exemplos de estruturas de interface do usuário populares incluem Ionic e Bootstrap.
É importante seguir as diretrizes de design para plataformas específicas certificar-se de que seu aplicativo pode passar pelo processo de revisão. Aplicativos não necessariamente precisam verificar nativo para obter aprovação para uma loja de aplicativos, mas eles devem se comportem mais como um aplicativo de uma página da web. Para obter mais informações. consulte Get Your Cordova App Approved by the App Stores.
Se a interface do usuário é relativamente simple, ou se você tiver os recursos de desenvolvimento disponíveis, você pode criar sua própria interface do usuário usando as práticas recomendadas para CSS de várias plataformas, como o uso de Flexbox CSS3 e @media consultas. Há muitos recursos da web que fornecem informações sobre isso.
Algumas coisas devem ser consideradas se você criar sua própria interface do usuário:
Se você direcionar 4.4 Android ou posterior (Chromium com base em navegador), Windows ou Windows Phone, suporte para os padrões atuais de CSS e outras tecnologias da web é melhor. Consulte caniuse.com para obter informações específicas sobre os recursos com suporte.
Se você direcionar iOS ou Android versões antes 4.4, o navegador é baseado em WebKit. (O emulador ondulação, que usa a versão instalada do Chrome, se comporta como Android 4.4.) Alguns comportamentos de navegador WebKit é diferente. Por exemplo, WebKit navegadores não fornecem suporte consistente para unidades vw e vh, que são úteis durante a criação de uma interface de usuário responsiva.
Dica
Use o mescla pasta em seu projeto para lidar com as diferenças de plataforma que não podem ser codificadas de forma mais genérica.
Para obter um exemplo que usa algumas técnicas de interface do usuário de várias plataformas, consulte o exemplo de página de detalhes mestre AngularJS.
Adicionar recursos nativos (plug-ins)
Um dos recursos mais importantes que fornece Cordova é o suporte para plug-ins que permitem o acesso a recursos nativos, como localização geográfica e bateria. Usando um plug-in, você pode programar a uma API genérica do JavaScript. Plug-ins principal geralmente oferecem suporte a todas as principais plataformas, enquanto os plug-ins de terceiros podem exigir mais investigação. Se o suporte de plug-in não estiver disponível, talvez seja necessário personalizar e existente plug-in ou escrever suas próprias, que requer código nativo.
Para obter mais informações, consulteGerenciar plug-ins para aplicativos compilados com o Visual Studio Tools for Apache Cordova
Adicionar serviços conectados
Se seu aplicativo estiver usando os serviços do Azure ou Office365, consulte Adicionar os serviços conectados ao seu aplicativo compilado com o Visual Studio Tools for Apache Cordova. Um plug-in de núcleo para serviços móveis do Azure está disponível na Config Designer no Visual Studio.
Para obter informações sobre como adicionar os serviços do Azure no aplicativo de exemplo de lista de tarefas do Visual Studio Tools para o Apache Cordova (versão AngularJS), consulte Criar o aplicativo de amostra ToDoList.
Adicionar recursos específicos da plataforma
Recursos específicos da plataforma, como telas iniciais e ícones de armazenamento, são necessários para que os aplicativos aprovados para download em lojas de aplicativos. A pasta res em seu projeto contém esses recursos. Você também pode usar a pasta res para adicionar arquivos de configuração personalizada. Para saber mais, veja Configurar seu aplicativo compilado com o Visual Studio Tools for Apache Cordova.