Compartilhar via

Criar seu primeiro aplicativo híbrido

  • Artigo

Importante

Este projeto é uma versão experimental. Esperamos que você experimente associações blazor móveis experimentais e forneça comentários em https://github.com/xamarin/MobileBlazorBindings.

A maneira mais fácil de começar a usar associações blazor móveis experimentais para criar aplicativos híbridos é criar o projeto inicial a partir da linha de comando. Este modelo dá suporte à criação de aplicativos para Android, iOS, WPF (Windows) e macOS.

Observação

Se você ainda não fez isso, marcar os pré-requisitos e as instruções de instalação do modelo.

  1. Abrir um prompt de comando ou uma janela do shell

  2. Crie seu projeto executando este comando:

    dotnet new blazorhybrid -o FirstBlazorHybridApp

    Isso criará uma pasta chamada FirstBlazorHybridApp com o arquivo de solução (SLN) e cinco projetos em subdiretórios:

    1. FirstBlazorHybridApp/FirstBlazorHybridApp.csproj – esse é o projeto compartilhado que conterá a interface do usuário híbrida e a lógica do aplicativo. Ou seja, ele conterá a interface do usuário nativa e a interface do usuário da Web usando a sintaxe Razor.
    2. FirstBlazorHybridApp.Android/FirstBlazorHybridApp.Android.csproj – este é o projeto de "back-end" para direcionar dispositivos Android. No Windows ou mac, você pode executar este projeto para iniciar o aplicativo no Android Emulator.
    3. FirstBlazorHybridApp.iOS/FirstBlazorHybridApp.iOS.csproj – esse é o projeto de "back-end" para direcionar dispositivos iOS. No Mac, você pode executar esse projeto para iniciar o aplicativo no Simulador do iOS. No Windows, você também pode executá-lo se tiver um Mac emparelhado.
    4. FirstBlazorHybridApp.Windows/FirstBlazorHybridApp.Windows.csproj– esse é o projeto de "back-end" para direcionar dispositivos Windows usando Windows Presentation Foundation (WPF). No Windows, você pode executar este projeto para iniciar o aplicativo.
    5. FirstBlazorHybridApp.macOS/FirstBlazorHybridApp.macOS.csproj – esse é o projeto de "back-end" para direcionar dispositivos macOS. No Mac, você pode executar este projeto para iniciar o aplicativo.

  3. Agora você está pronto para abrir a solução no Visual Studio. Para abrir a solução, você pode clicar duas vezes no arquivo SLN em seu disco ou abrir primeiro o Visual Studio 2019, selecionar File / / OpenProject/Solutione, em seguida, navegar até a nova pasta que você criou e selecionar .FirstBlazorHybridApp.sln A solução no Visual Studio deve ter esta aparência:

    Gerenciador de Soluções com todos os 5 projetos

  4. Para executar o projeto, você precisará definir um dos projetos de "back-end" como seu projeto de inicialização. Em Gerenciador de Soluções, clique com o botão direito do mouse no projeto Android, iOS, Windows ou macOS e selecione Set as StartUp Project.

    Definir o projeto de inicialização no Gerenciador de Soluções

  5. Pressione F5 para iniciar o projeto no emulador ou em um dispositivo (dependendo do projeto escolhido) com o depurador anexado (ou pressione Ctrl+F5 para ser executado sem o depurador)

    • Dica: se você quiser executar o projeto do iOS no Simulador do iOS, selecione o iPhoneSimulator destino na barra de ferramentas do Visual Studio em vez de iPhone.

  6. Seu primeiro aplicativo será iniciado em um emulador ou em um dispositivo e terá esta aparência:

    Olá, Mundo aplicativo híbrido em execução no Simulador do iOS

  7. Parabéns, você criou e executou seu primeiro aplicativo híbrido Experimental Mobile Blazor Bindings!

Dica

Se você estiver enfrentando um problema, consulte o guia de solução de problemas.

Dica

Consulte o tópico de opções avançadas de modelo para obter mais opções ao criar um novo projeto.

Próximas etapas