Showing
1 changed file
with
58 additions
and
35 deletions
@@ -160,6 +160,8 @@ Get não é melhor ou pior que nenhum gerenciador de estado, mas você deveria a | @@ -160,6 +160,8 @@ Get não é melhor ou pior que nenhum gerenciador de estado, mas você deveria a | ||
160 | 160 | ||
161 | Definitivamente, Get não é o inimigo de nenhum gerenciador, porque Get é um microframework, não apenas um gerenciador, e pode ser usado tanto sozinho quanto em conjunto com eles. | 161 | Definitivamente, Get não é o inimigo de nenhum gerenciador, porque Get é um microframework, não apenas um gerenciador, e pode ser usado tanto sozinho quanto em conjunto com eles. |
162 | 162 | ||
163 | +Get tem dois gerenciadores de estado diferentes: o simple state manager (vamos chamá-lo de GetBuilder) e o reactive state manager (que tem o nome do pacote, GetX) | ||
164 | + | ||
163 | ### Reactive state manager | 165 | ### Reactive state manager |
164 | 166 | ||
165 | Programação reativa pode alienar muitas pessoas porque é dito que é complicado. GetX transforma a programação reativa em algo bem simples: | 167 | Programação reativa pode alienar muitas pessoas porque é dito que é complicado. GetX transforma a programação reativa em algo bem simples: |
@@ -187,7 +189,6 @@ var name = 'Jonatas Borges'.obs; | @@ -187,7 +189,6 @@ var name = 'Jonatas Borges'.obs; | ||
187 | 189 | ||
188 | E Na UI, quando quiser mostrar a variável e escutar as mudanças dela, simplesmente faça isso: | 190 | E Na UI, quando quiser mostrar a variável e escutar as mudanças dela, simplesmente faça isso: |
189 | 191 | ||
190 | - | ||
191 | ```dart | 192 | ```dart |
192 | Obx (() => Text (controller.name)); | 193 | Obx (() => Text (controller.name)); |
193 | ``` | 194 | ``` |
@@ -206,6 +207,16 @@ Você vai ter uma boa idea do poder do GetX | @@ -206,6 +207,16 @@ Você vai ter uma boa idea do poder do GetX | ||
206 | 207 | ||
207 | ## Gerenciamento de rotas | 208 | ## Gerenciamento de rotas |
208 | 209 | ||
210 | +Se você for usar routes / snackbars / dialogs / bottomsheets sem contexto, GetX é excelente para você também, veja: | ||
211 | + | ||
212 | +Adicione "Get" antes do seu MaterialApp, transformando-o em GetMaterialApp | ||
213 | + | ||
214 | +```dart | ||
215 | +GetMaterialApp( // Antes: MaterialApp( | ||
216 | + home: MyHome(), | ||
217 | +) | ||
218 | +``` | ||
219 | + | ||
209 | Para navegar para uma próxima tela: | 220 | Para navegar para uma próxima tela: |
210 | 221 | ||
211 | ```dart | 222 | ```dart |
@@ -256,9 +267,10 @@ Já está usando o Get e quer fazer seu projeto o melhor possível? Get tem um g | @@ -256,9 +267,10 @@ Já está usando o Get e quer fazer seu projeto o melhor possível? Get tem um g | ||
256 | Controller controller = Get.put(Controller()); // Em vez de Controller controller = Controller(); | 267 | Controller controller = Get.put(Controller()); // Em vez de Controller controller = Controller(); |
257 | ``` | 268 | ``` |
258 | 269 | ||
259 | -Em vez de instanciar sua classe dentro da classe que você está usando, você está instanciando ele dentro da instância do Get, que vai fazer ele ficar disponível por todo o App | 270 | +Em vez de instanciar sua classe dentro da classe que você está usando, você está instanciando ele dentro da instância do Get, que vai fazer ele ficar disponível por todo o App para que então você possa usar seu controller (ou uma classe Bloc) normalmente |
260 | 271 | ||
261 | -Para que então você possa usar seu controller (ou uma classe Bloc) normalmente | 272 | + |
273 | +**Dica:** O gerenciamento de dependência Get é desacoplado de outras partes do pacote, então se, por exemplo, seu aplicativo já estiver usando um gerenciador de estado (qualquer um, não importa), você não precisa reescrever tudo, você pode usar esta injeção de dependência sem problemas | ||
262 | 274 | ||
263 | ```dart | 275 | ```dart |
264 | controller.fetchApi(); | 276 | controller.fetchApi(); |
@@ -290,37 +302,26 @@ Get.lazyPut<Service>(()=> ApiMock()); | @@ -290,37 +302,26 @@ Get.lazyPut<Service>(()=> ApiMock()); | ||
290 | 302 | ||
291 | **Veja uma explicação mais completa do gerenciamento de dependência [aqui](./documentation/pt_BR/dependency_management.md)** | 303 | **Veja uma explicação mais completa do gerenciamento de dependência [aqui](./documentation/pt_BR/dependency_management.md)** |
292 | 304 | ||
293 | -# Como contribuir | ||
294 | - | ||
295 | -Quer contribuir no projeto? Nós ficaremos orgulhosos de ressaltar você como um dos colaboradores. Aqui vai algumas formas em que você pode contribuir e fazer Get (e Flutter) ainda melhores | ||
296 | - | ||
297 | -- Ajudando a traduzir o README para outras linguagens. | ||
298 | -- Adicionando mais documentação ao README (até o momento, várias das funcionalidades do Get não foram documentadas). | ||
299 | -- Fazendo artigos/vídeos ensinando a usar o Get (eles serão inseridos no README e no futuro na nossa Wiki). | ||
300 | -- Fazendo PR's (Pull-Requests) para código/testes. | ||
301 | -- Incluindo novas funcionalidades. | ||
302 | - | ||
303 | -Qualquer contribuição é bem-vinda! | ||
304 | - | ||
305 | # Utilidades | 305 | # Utilidades |
306 | 306 | ||
307 | ## Internacionalização | 307 | ## Internacionalização |
308 | ### Traduções | 308 | ### Traduções |
309 | As traduções são mantidas num simples dictionary map de chave-valor. | 309 | As traduções são mantidas num simples dictionary map de chave-valor. |
310 | Para adicionar traduções personalizadas, crie uma classe e estenda `Translations`. | 310 | Para adicionar traduções personalizadas, crie uma classe e estenda `Translations`. |
311 | + | ||
311 | ```dart | 312 | ```dart |
312 | import 'package:get/get.dart'; | 313 | import 'package:get/get.dart'; |
313 | 314 | ||
314 | class Messages extends Translations { | 315 | class Messages extends Translations { |
315 | @override | 316 | @override |
316 | Map<String, Map<String, String>> get keys => { | 317 | Map<String, Map<String, String>> get keys => { |
317 | - 'en_US': { | ||
318 | - 'hello': 'Hello World', | ||
319 | - }, | ||
320 | - 'de_DE': { | ||
321 | - 'hello': 'Hallo Welt', | ||
322 | - } | ||
323 | - }; | 318 | + 'en_US': { |
319 | + 'hello': 'Hello World', | ||
320 | + }, | ||
321 | + 'de_DE': { | ||
322 | + 'hello': 'Hallo Welt', | ||
323 | + } | ||
324 | + }; | ||
324 | } | 325 | } |
325 | ``` | 326 | ``` |
326 | 327 | ||
@@ -361,7 +362,7 @@ return GetMaterialApp( | @@ -361,7 +362,7 @@ return GetMaterialApp( | ||
361 | 362 | ||
362 | ## Mudar tema (changeTheme) | 363 | ## Mudar tema (changeTheme) |
363 | 364 | ||
364 | -Por favor não use widget acima do GetMaterialApp para atualizar o tema. Isso pode causar keys duplicadas. Várias pessoas estão acostumadas com o jeito normal de criar um Widget `ThemeProvider` só pra alterar o tema do app, mas isso definitivamente NÃO é necessário no Get. | 365 | +Por favor não use widget acima do GetMaterialApp para atualizar o tema. Isso pode causar keys duplicadas. Várias pessoas estão acostumadas com o jeito normal de criar um Widget `ThemeProvider` só pra alterar o tema do app, mas isso definitivamente NÃO é necessário com GetX. |
365 | 366 | ||
366 | Você pode criar seu tema customizado e simplesmente adicionar dentro do `Get.changeTheme` sem nenhum boilerplate para isso: | 367 | Você pode criar seu tema customizado e simplesmente adicionar dentro do `Get.changeTheme` sem nenhum boilerplate para isso: |
367 | 368 | ||
@@ -369,14 +370,12 @@ Você pode criar seu tema customizado e simplesmente adicionar dentro do `Get.ch | @@ -369,14 +370,12 @@ Você pode criar seu tema customizado e simplesmente adicionar dentro do `Get.ch | ||
369 | Get.changeTheme(ThemeData.light()) | 370 | Get.changeTheme(ThemeData.light()) |
370 | ``` | 371 | ``` |
371 | 372 | ||
372 | -Se você quer criar algo como um botão que muda o tema com o toque, você pode combinar duas APIs Get pra isso: a API que checa se o tema dark está sendo aplicado, e a API de mudar o tema, e colocar isso no `onPressed:` | 373 | +Se você quer criar algo como um botão que muda o tema com o toque, você pode combinar duas APIs GetX pra isso: |
374 | +- A API que checa se o tema dark está sendo aplicado; | ||
375 | +- A API de mudar o tema e colocar isso no `onPressed:` | ||
373 | 376 | ||
374 | ```dart | 377 | ```dart |
375 | -Get.changeTheme( | ||
376 | - Get.isDarkMode | ||
377 | - ? ThemeData.light() | ||
378 | - : ThemeData.dark() | ||
379 | -) | 378 | +Get.changeTheme(Get.isDarkMode ? ThemeData.light() : ThemeData.dark()) |
380 | ``` | 379 | ``` |
381 | 380 | ||
382 | Quando o modo Dark está ativado, ele vai trocar pro modo light e vice versa. | 381 | Quando o modo Dark está ativado, ele vai trocar pro modo light e vice versa. |
@@ -426,11 +425,22 @@ Get.offUntil() | @@ -426,11 +425,22 @@ Get.offUntil() | ||
426 | //rotas anteriores até que o predicate retorne true. | 425 | //rotas anteriores até que o predicate retorne true. |
427 | Get.offNamedUntil() | 426 | Get.offNamedUntil() |
428 | 427 | ||
429 | -// retorna qual é a plataforma | 428 | +// Verifica em que plataforma o app está sendo executado |
430 | //(Esse método é completamente compatível com o FlutterWeb, | 429 | //(Esse método é completamente compatível com o FlutterWeb, |
431 | //diferente do método do framework "Platform.isAndroid") | 430 | //diferente do método do framework "Platform.isAndroid") |
432 | GetPlatform.isAndroid | 431 | GetPlatform.isAndroid |
433 | GetPlatform.isIOS | 432 | GetPlatform.isIOS |
433 | +GetPlatform.isMacOS | ||
434 | +GetPlatform.isWindows | ||
435 | +GetPlatform.isLinux | ||
436 | +GetPlatform.isFuchsia | ||
437 | + | ||
438 | +//Verifica o tipo de dispositivo | ||
439 | +GetPlatform.isMobile | ||
440 | +GetPlatform.isDesktop | ||
441 | +//Todas as plataformas são suportadas de forma independente na web! | ||
442 | +//Você pode saber se está executando dentro de um navegador | ||
443 | +//no Windows, iOS, OSX, Android, etc. | ||
434 | GetPlatform.isWeb | 444 | GetPlatform.isWeb |
435 | 445 | ||
436 | // Equivalente ao método: MediaQuery.of(context).size.width ou height, mas é imutável. Significa que não irá atualizar mesmo que o tamanho da tela mude (como em navegadores ou app desktop) | 446 | // Equivalente ao método: MediaQuery.of(context).size.width ou height, mas é imutável. Significa que não irá atualizar mesmo que o tamanho da tela mude (como em navegadores ou app desktop) |
@@ -569,10 +579,10 @@ void localLogWriter(String text, {bool isError = false}) { | @@ -569,10 +579,10 @@ void localLogWriter(String text, {bool isError = false}) { | ||
569 | 579 | ||
570 | ### Widgets de Estado Local | 580 | ### Widgets de Estado Local |
571 | 581 | ||
572 | -Esses Widgets permitem que você gerencie um único valor e mantenha o estado efêmero e localmente. Temos versões para Reativo e Simples. Por exemplo, você pode usá-los para alternar obscureText em um TextField, talvez criar um painel expansível personalizado ou talvez modificar o índice atual em um BottomNavigationBar enquanto altera o conteúdo do corpo em um Scaffold. | 582 | +Esses Widgets permitem que você gerencie um único valor e mantenha o estado efêmero e localmente. Temos versões para Reativo e Simples. Por exemplo, você pode usá-los para alternar obscureText em um `TextField`, talvez criar um painel expansível personalizado ou talvez modificar o índice atual em um `BottomNavigationBar` enquanto altera o conteúdo do corpo em um `Scaffold`. |
573 | 583 | ||
574 | #### ValueBuilder | 584 | #### ValueBuilder |
575 | -Uma simplificação de StatefulWidget que funciona com um callback de "setState" que passa o valor atualizado. | 585 | +Uma simplificação de `StatefulWidget` que funciona com um callback de `setState` que passa o valor atualizado. |
576 | 586 | ||
577 | 587 | ||
578 | ```dart | 588 | ```dart |
@@ -583,8 +593,8 @@ ValueBuilder<bool>( | @@ -583,8 +593,8 @@ ValueBuilder<bool>( | ||
583 | onChanged: updateFn, // mesma assinatura! Você poderia usar ( newValue ) => updateFn( newValue ) | 593 | onChanged: updateFn, // mesma assinatura! Você poderia usar ( newValue ) => updateFn( newValue ) |
584 | ), | 594 | ), |
585 | // se você precisa chamar algo fora do método builder. | 595 | // se você precisa chamar algo fora do método builder. |
586 | - onUpdate: (value) => print("Value updated: $value"), | ||
587 | - onDispose: () => print("Widget unmounted"), | 596 | + onUpdate: (value) => print("Valor atualizado: $value"), |
597 | + onDispose: () => print("Widget desmontado"), | ||
588 | ), | 598 | ), |
589 | ``` | 599 | ``` |
590 | 600 | ||
@@ -604,9 +614,10 @@ ObxValue( | @@ -604,9 +614,10 @@ ObxValue( | ||
604 | 614 | ||
605 | ## Explicação em vídeo sobre Outras Features do GetX | 615 | ## Explicação em vídeo sobre Outras Features do GetX |
606 | 616 | ||
607 | - | ||
608 | Amateur Coder fez um vídeo incrível sobre utils, storage, bindings e outras features! Link: [GetX Other Features](https://youtu.be/ttQtlX_Q0eU) | 617 | Amateur Coder fez um vídeo incrível sobre utils, storage, bindings e outras features! Link: [GetX Other Features](https://youtu.be/ttQtlX_Q0eU) |
609 | 618 | ||
619 | + | ||
620 | + | ||
610 | # Breaking Changes da versão 2 para 3 | 621 | # Breaking Changes da versão 2 para 3 |
611 | 622 | ||
612 | ## Tipagem Rx | 623 | ## Tipagem Rx |
@@ -696,3 +707,15 @@ GetMaterialApp( | @@ -696,3 +707,15 @@ GetMaterialApp( | ||
696 | 707 | ||
697 | 4- Desacoplamento real. Você já deve ter ouvido o conceito "separar a view da lógica de negócios". Isso não é uma peculiaridade do BLoC, MVC ou MVVM, qualquer outro padrão existente no mercado tem esse conceito. No entanto, muitas vezes esse conceito pode ser mitigado no Flutter por conta do uso do context. | 708 | 4- Desacoplamento real. Você já deve ter ouvido o conceito "separar a view da lógica de negócios". Isso não é uma peculiaridade do BLoC, MVC ou MVVM, qualquer outro padrão existente no mercado tem esse conceito. No entanto, muitas vezes esse conceito pode ser mitigado no Flutter por conta do uso do context. |
698 | Se você precisa de context para localizar um InheritedWidget, você precisa disso na view ou passar o context por parâmetro. Eu particularmente acho essa solução muito feia e para trabalhar em equipes teremos sempre uma dependência da lógica de negócios da View. Getx é pouco ortodoxo com a abordagem padrão e apesar de não proibir totalmente o uso de StatefulWidgets, InitState e etc, ele tem sempre uma abordagem similar que pode ser mais limpa. Os controllers tem ciclos de vida e quando você precisa fazer uma solicitação APIREST por exemplo, você não depende de nada da view. Você pode usar onInit para iniciar a chamada http e quando os dados chegarem, as variáveis serão preenchidas. Como GetX é totalmente reativo (de verdade e trabalha sob streams), assim que os itens forem preenchidos, automaticamente será atualizado na view todos os widgets que usam aquela variável. Isso permite que as pessoas especialistas em UI trabalhem apenas com widgets e não precisem enviar nada para a lógica de negócio além de eventos do usuário (como clicar em um botão), enquanto as pessoas que trabalham com a lógica de negócio ficarão livres para criá-la e testá-la separadamente. | 709 | Se você precisa de context para localizar um InheritedWidget, você precisa disso na view ou passar o context por parâmetro. Eu particularmente acho essa solução muito feia e para trabalhar em equipes teremos sempre uma dependência da lógica de negócios da View. Getx é pouco ortodoxo com a abordagem padrão e apesar de não proibir totalmente o uso de StatefulWidgets, InitState e etc, ele tem sempre uma abordagem similar que pode ser mais limpa. Os controllers tem ciclos de vida e quando você precisa fazer uma solicitação APIREST por exemplo, você não depende de nada da view. Você pode usar onInit para iniciar a chamada http e quando os dados chegarem, as variáveis serão preenchidas. Como GetX é totalmente reativo (de verdade e trabalha sob streams), assim que os itens forem preenchidos, automaticamente será atualizado na view todos os widgets que usam aquela variável. Isso permite que as pessoas especialistas em UI trabalhem apenas com widgets e não precisem enviar nada para a lógica de negócio além de eventos do usuário (como clicar em um botão), enquanto as pessoas que trabalham com a lógica de negócio ficarão livres para criá-la e testá-la separadamente. |
710 | + | ||
711 | +# Como contribuir | ||
712 | + | ||
713 | +Quer contribuir no projeto? Nós ficaremos orgulhosos de ressaltar você como um dos colaboradores. Aqui vai algumas formas em que você pode contribuir e fazer Get (e Flutter) ainda melhores | ||
714 | + | ||
715 | +- Ajudando a traduzir o README para outras linguagens. | ||
716 | +- Adicionando mais documentação ao README (até o momento, várias das funcionalidades do Get não foram documentadas). | ||
717 | +- Fazendo artigos/vídeos ensinando a usar o Get (eles serão inseridos no README e no futuro na nossa Wiki). | ||
718 | +- Fazendo PR's (Pull-Requests) para código/testes. | ||
719 | +- Incluindo novas funcionalidades. | ||
720 | + | ||
721 | +Qualquer contribuição é bem-vinda! |
-
Please register or login to post a comment