Blazor -  Apresentando MatBlazor

Hoje vou apresentar a biblioteca de componentes MatBlazor que implementa componentes do Material Design para o Blazor.

Se você esta chegando agora e não sabe o que é o Blazor leia o artigo ASP .NET Core - Iniciando com o Blazor - Macoratti; se você já conhece e quer saber mais pode fazer o curso de Blazor Essencial.  

O Blazor já saiu da fase experimental e se consolida a cada dia como uma alternativa viável para criações de aplicações SPA na plataforma .NET.

Eu já apresentei a biblioteca Blazor Radzen que possui  dezenas de componentes gratuitos para o Blazor e hoje vou apresentar a biblioteca MatBlazor.

A biblioteca MatBlazor compreende uma variedade de componentes que implementam padrões de interação comuns, de acordo com a especificação do Material Design.

Você pode acessar a documentação e exemplos no site: https://www.matblazor.com/

Configurando o projeto para usar a MatBlazor

Para usar a biblioteca basta instalar no seu projeto via Nuget :

Install-Package MatBlazor  ou   Install-Package MatBlazor

A seguir no arquivo _Imports.razor inclua a declaração :

@using MatBlazor

Para projetos do lado do cliente e do lado do servidor inclua na seção de script do arquivo index.html ou _Host.cshtml , na seção head:

<script src="_content/MatBlazor/dist/matBlazor.js"></script>
<link href="_content/MatBlazor/dist/matBlazor.css" rel="stylesheet" />

A seguir uma lista dos recursos disponíveis na versão 2.2.0, que a versão atual em fev/2020:

Forms Control Navigation Layout Buttons Popups Data Table
  • AutocompleteList
  • Checkbox
  • DatePicker
  • FileUpload
  • NumericUpDownField
  • RadioButton
  • Select
  • SelectItem
  • SelectValue
  • Slider
  • SlideToggle
  • TextField
  • Validation via EditContext
     
    		•
  • AppBar
  • Drawer
  • Nav Menu

    •  
  • Card
  • Divider
  • Elevation
  • Expansion Panel
  • Hidden
  • Layout Grid
  • List
  • Menu
  • Tab
  • Themes
  • Typography

    •  
  • Button
  • Chip
  • FAB
  • Icon
  • IconButton
  • ProgressBar
  • Ripple

    •  
  • Dialog
  • Snackbar
  • Toast
  • Tooltip

    •  
  • Paginator
  • SortHeader
  • Table

    •  

    Acessando a documentação existem exemplos com código fonte pronto para testar.

    E estamos conversados...

    "Tendo sido, pois, justificados pela fé, temos paz com Deus, por nosso Senhor Jesus Cristo;
    Pelo qual também temos entrada pela fé a esta graça, na qual estamos firmes, e nos gloriamos na esperança da glória de Deus."
    Romanos 5:1,2

    Referências:

    José Carlos Macoratti