Exibir gráficos em aplicativos móveis tem sido sempre uma ótima maneira de oferecer aos usuários uma visão clara dos dados numéricos. 

Tradução por André Xavier  do blog.xamarin.com

No meu tempo como um desenvolvedor, eu queria que essa tarefa fosse tão fácil como escrever algumas linhas de código, mas eu não poderia encontrar uma maneira simples e direta para conseguir isso, e é por isso que eu comecei a explorar os  SkiaSharp e os Micrográficos criados. Micrográficos é uma seleção de gráficos comuns que são fáceis de usar, visualmente agradáveis, e construído com compatibilidade entre cross-plataform.

 

Micrográficos fornece gráficos ready-to-use para Android, iOS, MacOS, UWP, e até mesmo Xamarin.Forms. Se você já está usando SkiaSharp em seu aplicativo, você também pode renderizar em qualquer tela SkiaSharp.

Entradas de dados

Cada gráfico exibido via Micrográficos consome um conjunto de entradas de dados, e eles sempre terão a mesma estrutura, independentemente do tipo de gráfico que você deseja exibir.

Cada entrada terá:

  • Um número flutuante que representa o seu valor (obrigatório) .
  • Uma Label descrevendo o que a sua entrada está associando.
  • Uma ValueLabel para formatar o seu valor.
  • Uma Color associada com a entrada.

Aqui está uma amostra rápida de um conjunto de pontos de entrada que vamos traçar em um momento:

 

Tipos de gráficos

Uma vasta gama de gráficos estão incluídos no Micrográficos, para que você possa escolher aquele que se adapta à sua aplicação e seus dados. Tudo que você precisa fazer é definir as entradas de dados por meio das Entries, propriedade de qualquer controle de gráfico.

Gráfico de barras

 

Gráfico de linha

 

Gráfico de pontos

 

Gráfico Radial

 

Gráfico Rosquinha

 

Gráfico Radar

 

Exibindo um Gráfico

Para exibir um gráfico, vamos precisar para hospedá-lo em uma ChartView.

Os dados de gráficos pode agora ser afectada pela view Chart propriedade.

 

Uma propriedade Chart é uma propriedade ligável, por isso também é perfeitamente possível usar uma ligação a partir de um ViewModel para isso.

 

O exemplo acima usa Xamarin.Forms, mas pontos de vista internos também estão disponíveis diretamente para iOS, Android, MacOS e UWP.

Aprimorando o aspecto visual

Cada tipo de gráfico tem várias propriedades para modificar ligeiramente a sua aparência final. Por exemplo, o nosso exemplo anterior LineChart ficou assim:

 

 

Alterando as propriedades de linha e ponto, podemos finalmente harmonizar o projeto:

 

 

Sinta-se livre para explorar cada propriedade gráfico para torná-lo seu próprio e criar um design único.

Exemplo de aplicação

Para um uso mais contextual de Micrográficos, por favor dê uma olhada no repositório dedicado, que mostra uma aplicação de ciclismo com vários casos de uso para gráficos.

Isto é apenas o começo!

Micrográficos ainda é jovem e vai continuar a ser melhorada, portanto, fique atento no GitHub ou Twitter ! Este projeto é open-source, então por favor não hesite em partilhar novo tipo de gráficos, propriedades ausente e problemas.

Esta é uma postagem do Convidado de Aloïs Deniel. Aloïs trabalha na Orange Applications como um consultor Xamarin para negócios. Você pode encontrá-lo no Twitter em @aloisdeniel e no Github em @aloisdeniel .

Discutir este post nos fóruns .

Link para o original:

https://blog.xamarin.com/microcharts-elegant-cross-platform-charts-for-any-app/