Associações blazor móveis experimentais
As Associações De Blazor Móveis Experimentais permitem que os desenvolvedores criem aplicativos móveis nativos e híbridos usando C# e .NET para Android, iOS, Windows, macOS e Tizen usando padrões de programação web familiares. O Experimental Mobile Blazor Bindings usa a sintaxe Razor para definir componentes e comportamentos da interface do usuário de um aplicativo. Os componentes de interface do usuário subjacentes são baseados em componentes de interface do usuário nativos do Xamarin.Forms e em aplicativos híbridos eles são misturados com elementos HTML.
O Blazor é executado no .NET Standard 2.0 para que você possa compartilhar seu código .NET com a maioria dos outros aplicativos .NET.
Com as Associações do Blazor Móvel, é fácil criar uma interface do usuário nativa com rótulos, botões e outros componentes nativos da interface do usuário:
<StackLayout>
<Label FontSize="30"
Text="@("You pressed " + count + " times")" />
<Button Text="+1"
OnClick="@HandleClick" />
</StackLayout>
@code {
int count;
void HandleClick()
{
count++;
}
}
E aqui ele está em execução no Android Emulator:
E você pode criar aplicativos híbridos que combinam interface do usuário nativa e interface do usuário HTML na mesma tela, todos compartilhando a mesma lógica e estado do aplicativo:
/Main.razor
: (interface do usuário nativa)@inject CounterState CounterState <ContentView> <StackLayout> <StackLayout Margin="new Thickness(20)"> <Label Text="@($"You pressed {CounterState.CurrentCount} times")" FontSize="30" /> <Button Text="Increment from native" OnClick="@CounterState.IncrementCount" Padding="10" /> </StackLayout> <BlazorWebView ContentRoot="WebUI/wwwroot" VerticalOptions="LayoutOptions.FillAndExpand"> <FirstBlazorHybridApp.WebUI.App /> </BlazorWebView> </StackLayout> </ContentView> @code { // initialization code }
/WebUI/App.razor
: (interface do usuário HTML)@inject CounterState CounterState <div style="text-align: center; background-color: lightblue;"> <div> <span style="font-size: 30px; font-weight: bold;"> You pressed @CounterState.CurrentCount times </span> </div> <div> <button style="margin: 20px;" @onclick="ClickMe">Increment from HTML</button> </div> </div> @code { private void ClickMe() { CounterState.IncrementCount(); } // initialization code }
E aqui ele está em execução no Simulador do iOS, com a interface do usuário nativa na parte superior e a interface do usuário HTML na parte inferior, compartilhando a lógica e o estado do aplicativo:
Para criar seus primeiros aplicativos, marcar estes tópicos:
- Comece a configurar seu ambiente de desenvolvimento.
- Crie seu primeiro aplicativo usando componentes nativos da interface do usuário.
- Crie seu primeiro aplicativo híbrido usando uma combinação de componentes nativos de interface do usuário e interface do usuário HTML.
E quando estiver pronto para mais, marcar os passo a passo:
Em seguida, alguns dos tópicos avançados:
- Injeção de dependência – registrar e compartilhar serviços entre partes do aplicativo
- Escrever componentes personalizados – criar componentes reutilizáveis em seus aplicativos
- Xamarin.Essentials – fornece aos desenvolvedores APIs multiplataforma para seus aplicativos móveis
E, por fim, se você quiser contribuir, marcar estes tópicos: