Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Entendendo o Material Design e o Cupertino

E aí, beleza?

Minha dúvida é a seguinte: entendi que o Material Design é voltado ao Android e Cupertino voltado ao iOS, mas a questão é, se eu adicionar só componentes do material, como ficaria o visual no iOS? (isso serve ao contrário, usar o Cupertino, como ficaria no Android).

Nesses casos, qual é a melhor abordagem:

  • adicionar uma verificação de qual plataforma o usuário está?
  • utilizar uma solução "bonita" nas duas plataformas?
  • ou então usar algo que traga por padrão o layout das duas plataformas?

Desde já valeuuuu.

2 respostas
solução!

Olá Matheus, tudo bem com você?

A maneira como o Flutter faz a parte gráfica dos widgets independe da plataforma que está sendo utilizada, então se você utilizar o Material dentro do ìOS`terá o mesmo resultado que no Android ( e quaaaaase vice-versa), na documentação fica até um pouco claro isso:

The Material design language was created for any platform, not just Android. When you write a Material app in Flutter, it has the Material look and feel on all devices, even iOS.

Codelabs Google

Ou seja, como o Material não foi criado pensando em uma plataforma, não temos esse problema de compatibilidade, pois terá o mesmo comportamento sempre :)

Entretanto ao usar o Cupertino dentro do Android teremos a mesma interface visual, entretanto, as fontes serão diferentes, dado que a Apple tem o direito / licença em cima das fontes do sistema

You can technically run a Cupertino app on either Android or iOS, but (due to licensing issues) Cupertino won't have the correct fonts on Android. For this reason, use an iOS-specific device when writing a Cupertino app.

Então o resultado, por conta das fontes, terá uma pequena diferença, para ser sincero eu nunca testei, mas acredito que não seja um grande problema

Agora em relação a melhor abordagem, isso vai depender de vários fatores, questão de tempo de desenvolvimento, tamanho da equipe que está trabalhando no projeto

adicionar uma verificação de qual plataforma o usuário está?

Acredito que essa é uma ótima opção, para que o usuário tenha seus aplicativos todos com o mesmo formato, algumas pessoas gostam de separar o código, por exemplo :

  • lib
    • android
      • pages
    • ios
      • pages

E dessa maneira precisamos trabalhar bem para que haja uma boa reusabilidade :)

utilizar uma solução "bonita" nas duas plataformas? Aqui temos uma questão bem bacana que é a flexibilidade do Material, podemos criar layouts incríveis que não pareçam muito com Android ou iOS, inclusive é bem comum a gente pegar alguns apps que tem o que chamam de interface única (trazendo uma interface visual mais parecida com a empresa), dessa maneira temos um desenvolvimento em que poucas partes da nossa aplicação acabam sendo diferente de uma plataforma para outra :)

ou então usar algo que traga por padrão o layout das duas plataformas?

Então, essa parte eu não irei opinar tanto por não ter tanto conhecimento, temos um pacote da comunidade que é o platform_widgets que você acaba tendo um desenvolvimento único, da seguinte maneira:

return PlatformButton(
  onPressed: () => print('send'),
  child: PlatformText('Send'),
  material: (_, __)  => MaterialRaisedButtonData(...),
  cupertino: (_, __) => CupertinoButtonData(...)
);

Mas não saberia dizer como ele se comportaria em projetos grandes, ou como seria o desempenho do app no longo prazo, acredito que eu iria mais pelas duas primeiras opções :)

Abraços e Bons Estudos!

Boa tarde Geovani.

Baita resposta. Tudo muito claro e de fácil entendimento. Parabéns.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software