Showing
1 changed file
with
176 additions
and
28 deletions
1 |  | 1 |  |
2 | 2 | ||
3 | -*Idiomas: [Inglês](README.md), Português Brasileiro (este arquivo), [Spanish](README-es.md).* | 3 | +*Idiomas: [Inglês](README.md), Português Brasileiro (este arquivo), [Espanhol](README-es.md).* |
4 | 4 | ||
5 | [](https://pub.dev/packages/get) | 5 | [](https://pub.dev/packages/get) |
6 |  | 6 |  |
@@ -12,7 +12,7 @@ | @@ -12,7 +12,7 @@ | ||
12 | <a href="https://www.buymeacoffee.com/jonataslaw" target="_blank"><img src="https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png" alt="Me compre um café" style="height: 41px !important;width: 174px !important; box-shadow: 0px 3px 2px 0px rgba(190, 190, 190, 0.5) !important;-webkit-box-shadow: 0px 3px 2px 0px rgba(190, 190, 190, 0.5) !important;" > </a> | 12 | <a href="https://www.buymeacoffee.com/jonataslaw" target="_blank"><img src="https://www.buymeacoffee.com/assets/img/custom_images/orange_img.png" alt="Me compre um café" style="height: 41px !important;width: 174px !important; box-shadow: 0px 3px 2px 0px rgba(190, 190, 190, 0.5) !important;-webkit-box-shadow: 0px 3px 2px 0px rgba(190, 190, 190, 0.5) !important;" > </a> |
13 | 13 | ||
14 | - [Sobre Get](#sobre-get) | 14 | - [Sobre Get](#sobre-get) |
15 | - - [Instalando e iniciando](#instalando-e-iniciando) | 15 | +- [Instalando e iniciando](#instalando-e-iniciando) |
16 | - [Os três pilares](#os-três-pilares) | 16 | - [Os três pilares](#os-três-pilares) |
17 | - [Gerenciamento de estado](#gerenciamento-de-estado) | 17 | - [Gerenciamento de estado](#gerenciamento-de-estado) |
18 | - [Explicação completa](#explicação-completa) | 18 | - [Explicação completa](#explicação-completa) |
@@ -21,12 +21,20 @@ | @@ -21,12 +21,20 @@ | ||
21 | - [Gerenciamento de Dependência](#gerenciamento-de-dependência) | 21 | - [Gerenciamento de Dependência](#gerenciamento-de-dependência) |
22 | - [Explicação completa](#explicação-completa-2) | 22 | - [Explicação completa](#explicação-completa-2) |
23 | - [Utilidades](#utilidades) | 23 | - [Utilidades](#utilidades) |
24 | - - [Outras APIs avançadas e Configurações Manuais](#outras-apis-avançadas-e-configurações-manuais) | 24 | + - [Mudar tema (changeTheme)](#mudar-tema-changetheme) |
25 | + - [Outras APIs avançadas](#outras-apis-avançadas) | ||
26 | + - [Configurações Globais opcionais e configurações manuais](#configurações-globais-opcionais-e-configurações-manuais) | ||
27 | +- [Breaking Changes da versão 2 para 3](#breaking-changes-da-versão-2-para-3) | ||
28 | + - [Tipagem Rx](#tipagem-rx) | ||
29 | + - [RxController e GetBuilder se uniram](#rxcontroller-e-getbuilder-se-uniram) | ||
30 | + - [Rotas nomeadas](#rotas-nomeadas) | ||
31 | + - [Porque essa mudança](#porque-essa-mudança) | ||
32 | +- [Porque eu fiz esse package](#porque-eu-fiz-esse-package) | ||
25 | 33 | ||
26 | # Sobre Get | 34 | # Sobre Get |
27 | 35 | ||
28 | - Get é uma biblioteca poderosa e extra-leve para Flutter. Ela combina um gerenciador de estado de alta performance, injeção de dependência inteligente e gerenciamento de rotas de uma forma rápida e prática. | 36 | - Get é uma biblioteca poderosa e extra-leve para Flutter. Ela combina um gerenciador de estado de alta performance, injeção de dependência inteligente e gerenciamento de rotas de uma forma rápida e prática. |
29 | -- Get não é para todos, seu foco é | 37 | +- Get não é para todos, seu foco é: |
30 | - **Performance**: Já que gasta o mínimo de recursos | 38 | - **Performance**: Já que gasta o mínimo de recursos |
31 | - **Produtividade**: Usando uma sintaxe fácil e agradável | 39 | - **Produtividade**: Usando uma sintaxe fácil e agradável |
32 | - **Organização**: Que permite o total desacoplamento da View e da lógica de negócio. | 40 | - **Organização**: Que permite o total desacoplamento da View e da lógica de negócio. |
@@ -35,7 +43,7 @@ | @@ -35,7 +43,7 @@ | ||
35 | - Get é seguro, estável, atualizado e oferece uma enorme gama de APIs que não estão presentes no framework padrão. | 43 | - Get é seguro, estável, atualizado e oferece uma enorme gama de APIs que não estão presentes no framework padrão. |
36 | - GetX não é um `bloc` da vida. Ele tem uma variedade de recursos que te permite começar a programar sem se preocupar com nada, mas cada um desses recursos estão em um container separado, ou seja, nenhuma depende da outra para funcionar. Elas só são inicializadas após o uso. Se você usa apenas o gerenciador de estado, apenas ele será compilado. Teste você mesmo, vá no repositório de benchmark do getX e perceberá: usando somente o gerenciador de estado do Get, a aplicação ficou mais leve do que outros projetos que também estão usando só o gerenciador de estado, porque nada que não seja usado será compilado no seu código, e cada recuro do GetX foi feito para ser muito leve. O mérito vem também do AOT do próprio Flutter que é incrível, e consegue eliminar recursos não utilizados de uma forma que nenhum outro framework consegue. | 44 | - GetX não é um `bloc` da vida. Ele tem uma variedade de recursos que te permite começar a programar sem se preocupar com nada, mas cada um desses recursos estão em um container separado, ou seja, nenhuma depende da outra para funcionar. Elas só são inicializadas após o uso. Se você usa apenas o gerenciador de estado, apenas ele será compilado. Teste você mesmo, vá no repositório de benchmark do getX e perceberá: usando somente o gerenciador de estado do Get, a aplicação ficou mais leve do que outros projetos que também estão usando só o gerenciador de estado, porque nada que não seja usado será compilado no seu código, e cada recuro do GetX foi feito para ser muito leve. O mérito vem também do AOT do próprio Flutter que é incrível, e consegue eliminar recursos não utilizados de uma forma que nenhum outro framework consegue. |
37 | 45 | ||
38 | -**GetX faz seu desenvolvimento mais produtivo, mas quer deixá-lo mais produtivo ainda? Adicione a extensão [GetX extension to VSCode](https://marketplace.visualstudio.com/items?itemName=get-snippets.get-snippets) no seu VSCode**. Não disponível para outras IDEs por enquanto. | 46 | +**GetX faz seu desenvolvimento mais produtivo, mas quer deixá-lo mais produtivo ainda? Adicione a extensão [GetX extension](https://marketplace.visualstudio.com/items?itemName=get-snippets.get-snippets) no seu VSCode**. Não disponível para outras IDEs por enquanto. |
39 | 47 | ||
40 | 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 | 48 | 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 |
41 | 49 | ||
@@ -47,11 +55,7 @@ Quer contribuir no projeto? Nós ficaremos orgulhosos de ressaltar você como um | @@ -47,11 +55,7 @@ Quer contribuir no projeto? Nós ficaremos orgulhosos de ressaltar você como um | ||
47 | 55 | ||
48 | Qualquer contribuição é bem-vinda! | 56 | Qualquer contribuição é bem-vinda! |
49 | 57 | ||
50 | -## Instalando e iniciando | ||
51 | - | ||
52 | -<!-- - Flutter Master/Dev/Beta: version 2.0.x-dev | ||
53 | -- Flutter Stable branch: version 2.0.x | ||
54 | -(procure pela versão mais recente em pub.dev) --> | 58 | +# Instalando e iniciando |
55 | 59 | ||
56 | Adicione Get ao seu arquivo pubspec.yaml | 60 | Adicione Get ao seu arquivo pubspec.yaml |
57 | 61 | ||
@@ -60,14 +64,10 @@ dependencies: | @@ -60,14 +64,10 @@ dependencies: | ||
60 | get: | 64 | get: |
61 | ``` | 65 | ``` |
62 | 66 | ||
63 | -Troque seu `MaterialApp()` por `GetMaterialApp()` e aproveite! | 67 | +Importe o get nos arquivos que ele for usado: |
64 | 68 | ||
65 | ```dart | 69 | ```dart |
66 | import 'package:get/get.dart'; | 70 | import 'package:get/get.dart'; |
67 | - | ||
68 | -GetMaterialApp( // Antes: MaterialApp( | ||
69 | - home: HomePage(), | ||
70 | -) | ||
71 | ``` | 71 | ``` |
72 | 72 | ||
73 | # Os três pilares | 73 | # Os três pilares |
@@ -85,10 +85,11 @@ Troque `MaterialApp` para `GetMaterialApp` | @@ -85,10 +85,11 @@ Troque `MaterialApp` para `GetMaterialApp` | ||
85 | void main() => runApp(GetMaterialApp(home: Home())); | 85 | void main() => runApp(GetMaterialApp(home: Home())); |
86 | ``` | 86 | ``` |
87 | 87 | ||
88 | -- **Obs:** Isso não modifica o `MaterialApp` do Flutter, GetMaterialApp não é uma versão modificada do MaterialApp, é só um Widget pré-configurado, que tem como child o MaterialApp padrão. Você pode configurar isso manualmente, mas definitivamente não é necessário. GetMaterialApp vai criar rotas, injetá-las, injetar traduções, injetar tudo que você precisa para navegação por rotas (gerenciamento de rotas). Se você quer somente usar o gerenciado de estado ou somente o gerenciador de dependências, não é necessário usar o GetMaterialApp. Ele somente é necessário para: | 88 | +- **Obs:** Isso não modifica o `MaterialApp` do Flutter, GetMaterialApp não é uma versão modificada do MaterialApp, é só um Widget pré-configurado, que tem como child o MaterialApp padrão. Você pode configurar isso manualmente, mas definitivamente não é necessário. GetMaterialApp vai criar rotas, injetá-las, injetar traduções, injetar tudo que você precisa para navegação por rotas (gerenciamento de rotas). Se você quer somente usar o gerenciadro de estado ou somente o gerenciador de dependências, não é necessário usar o GetMaterialApp. Ele somente é necessário para: |
89 | - Rotas | 89 | - Rotas |
90 | - Snackbars/bottomsheets/dialogs | 90 | - Snackbars/bottomsheets/dialogs |
91 | - apis relacionadas a rotas e a ausência de `context` | 91 | - apis relacionadas a rotas e a ausência de `context` |
92 | + - Internacionalização | ||
92 | 93 | ||
93 | - Passo 2: | 94 | - Passo 2: |
94 | Cria a sua classe de regra de negócio e coloque todas as variáveis, métodos e controllers dentro dela. | 95 | Cria a sua classe de regra de negócio e coloque todas as variáveis, métodos e controllers dentro dela. |
@@ -140,7 +141,7 @@ Melhore seus prazos, entregue tudo a tempo sem perder performance. Get não é p | @@ -140,7 +141,7 @@ Melhore seus prazos, entregue tudo a tempo sem perder performance. Get não é p | ||
140 | 141 | ||
141 | ## Gerenciamento de rotas | 142 | ## Gerenciamento de rotas |
142 | 143 | ||
143 | -Veja uma explicação mais completa do gerenciamento de estado [aqui](./docs/pt_BR/route_management.md) | 144 | +Veja uma explicação mais completa do gerenciamento de rotas [aqui](./docs/pt_BR/route_management.md) |
144 | 145 | ||
145 | Para navegar para uma próxima tela: | 146 | Para navegar para uma próxima tela: |
146 | 147 | ||
@@ -172,6 +173,8 @@ Para navegar para a próxima rota, e receber ou atualizar dados assim que retorn | @@ -172,6 +173,8 @@ Para navegar para a próxima rota, e receber ou atualizar dados assim que retorn | ||
172 | var dados = await Get.to(Pagamento()); | 173 | var dados = await Get.to(Pagamento()); |
173 | ``` | 174 | ``` |
174 | 175 | ||
176 | +Notou que você não precisou usar `context` para fazer nenhuma dessas coisas? Essa é uma das maiores vantagens de usar o gerenciamento de rotas do GetX. Com isso, você pode executar todos esse métodos de dentro da classe Controller, sem preocupações. | ||
177 | + | ||
175 | ### Explicação completa | 178 | ### Explicação completa |
176 | 179 | ||
177 | **GetX funciona com rotas nomeadas também! Veja uma explicação mais completa do gerenciamento de rotas [aqui](./docs/pt_BR/route_management.md)** | 180 | **GetX funciona com rotas nomeadas também! Veja uma explicação mais completa do gerenciamento de rotas [aqui](./docs/pt_BR/route_management.md)** |
@@ -224,26 +227,34 @@ Get.lazyPut<Service>(()=> ApiMock()); | @@ -224,26 +227,34 @@ Get.lazyPut<Service>(()=> ApiMock()); | ||
224 | 227 | ||
225 | # Utilidades | 228 | # Utilidades |
226 | 229 | ||
227 | -## Outras APIs avançadas e Configurações Manuais | 230 | +## Mudar tema (changeTheme) |
231 | + | ||
232 | +Por favor não use widget acima do GetMaterialApp para atualizar o tome. Isso pode causar keys duplicadas. Várias pessoas estão acostumadas com o jeito normal de criar um Widget `ThemeProvider` só pra alterar o thema do app, mas isso definitivamente NÃO é necessário no Get. | ||
228 | 233 | ||
229 | -GetMaterialApp configura tudo para você, mas se quiser configurar Get manualmente, você pode usando APIs avançadas. | 234 | +Você pode criar seu tema customizado e simplesmente adicionar dentro do `Get.changeTheme` sem nenhum boilerplate para isso: |
230 | 235 | ||
231 | ```dart | 236 | ```dart |
232 | -MaterialApp( | ||
233 | - navigatorKey: Get.key, | ||
234 | - navigatorObservers: [GetObserver()], | ||
235 | -); | 237 | +Get.changeTheme(ThemeData.light()) |
236 | ``` | 238 | ``` |
237 | 239 | ||
238 | -Você também será capaz de usar seu próprio Middleware dentro do GetObserver, isso não irá influenciar em nada. | 240 | +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:` |
239 | 241 | ||
240 | ```dart | 242 | ```dart |
241 | -MaterialApp( | ||
242 | - navigatorKey: Get.key, | ||
243 | - navigatorObservers: [GetObserver(MiddleWare.observer)], // Aqui | ||
244 | -); | 243 | +Get.changeTheme( |
244 | + Get.isDarkMode | ||
245 | + ? ThemeData.light() | ||
246 | + : ThemeData.dark() | ||
247 | +) | ||
245 | ``` | 248 | ``` |
246 | 249 | ||
250 | +Quando o modo Dark está ativado, ele vai trocar pro modo light, e vice versa. | ||
251 | + | ||
252 | +Se você quiser saber mais como trocar o tema, você pode seguir esse tutorial no Medium que até ensina persistência do tema usando Get (e SharedPreferences): | ||
253 | + | ||
254 | +- [Dynamic Themes in 3 lines using Get](https://medium.com/swlh/flutter-dynamic-themes-in-3-lines-c3b375f292e3) - Tutorial by [Rod Brown](https://github.com/RodBr). | ||
255 | + | ||
256 | +## Outras APIs avançadas | ||
257 | + | ||
247 | ```dart | 258 | ```dart |
248 | // fornece os arguments da tela atual | 259 | // fornece os arguments da tela atual |
249 | Get.arguments | 260 | Get.arguments |
@@ -306,4 +317,141 @@ Get.contextOverlay | @@ -306,4 +317,141 @@ Get.contextOverlay | ||
306 | 317 | ||
307 | ``` | 318 | ``` |
308 | 319 | ||
320 | +### Configurações Globais opcionais e configurações manuais | ||
321 | + | ||
322 | +GetMaterialApp configura tudo para você, mas se quiser configurar Get manualmente, você pode. | ||
323 | + | ||
324 | +```dart | ||
325 | +MaterialApp( | ||
326 | + navigatorKey: Get.key, | ||
327 | + navigatorObservers: [GetObserver()], | ||
328 | +); | ||
329 | +``` | ||
330 | + | ||
331 | +Você também será capaz de usar seu próprio Middleware dentro do GetObserver, isso não irá influenciar em nada. | ||
332 | + | ||
333 | +```dart | ||
334 | +MaterialApp( | ||
335 | + navigatorKey: Get.key, | ||
336 | + navigatorObservers: [ | ||
337 | + GetObserver(MiddleWare.observer) // Aqui | ||
338 | + ], | ||
339 | +); | ||
340 | +``` | ||
341 | + | ||
342 | +Você pode criar Configurações Globais para o Get. Apenas adicione `Get.config` ao seu código antes de usar qualquer rota ou faça diretamente no seu GetMaterialApp | ||
343 | + | ||
344 | +```dart | ||
345 | +GetMaterialApp( | ||
346 | + enableLog: true, | ||
347 | + defaultTransition: Transition.fade, | ||
348 | + opaqueRoute: Get.isOpaqueRouteDefault, | ||
349 | + popGesture: Get.isPopGestureEnable, | ||
350 | + transitionDuration: Get.defaultDurationTransition, | ||
351 | + defaultGlobalState: Get.defaultGlobalState, | ||
352 | +); | ||
353 | +Get.config( | ||
354 | + enableLog = true, | ||
355 | + defaultPopGesture = true, | ||
356 | + defaultTransition = Transitions.cupertino | ||
357 | +) | ||
358 | +``` | ||
359 | + | ||
360 | +# Breaking Changes da versão 2 para 3 | ||
361 | + | ||
362 | +## Tipagem Rx | ||
363 | + | ||
364 | +| Antes | Depois | | ||
365 | +| -------- | ---------- | | ||
366 | +| StringX | `RxString` | | ||
367 | +| IntX | `RxInt` | | ||
368 | +| MapX | `RxMax` | | ||
369 | +| ListX | `RxList` | | ||
370 | +| NumX | `RxNum` | | ||
371 | +| RxDouble | `RxDouble` | | ||
372 | + | ||
373 | +## RxController e GetBuilder se uniram | ||
374 | + | ||
375 | +RxController e GetBuilder agora viraram um só, você não precisa mais memorizar qual controller quer usar, apenas coloque `GetxController`, vai funcionar para os dois gerenciamento de estados | ||
376 | + | ||
377 | +```dart | ||
378 | +//Gerenciador de estado simples | ||
379 | +class Controller extends GetXController { | ||
380 | + String nome = ''; | ||
381 | + | ||
382 | + void atualizarNome(String novoNome) { | ||
383 | + nome = novoNome; | ||
384 | + update() | ||
385 | + } | ||
386 | +} | ||
387 | +``` | ||
388 | + | ||
389 | +```dart | ||
390 | +class Controller extends GetXController { | ||
391 | + final nome = ''.obs; | ||
392 | + | ||
393 | + // não precisa de um método direto pra atualizar o nome | ||
394 | + // só usar o nome.value | ||
395 | +} | ||
396 | +``` | ||
397 | + | ||
398 | +## Rotas nomeadas | ||
399 | + | ||
400 | +Antes: | ||
401 | + | ||
402 | +```dart | ||
403 | +GetMaterialApp( | ||
404 | + namedRoutes: { | ||
405 | + '/': GetRoute(page: Home()), | ||
406 | + } | ||
407 | +) | ||
408 | +``` | ||
409 | + | ||
410 | +Agora: | ||
411 | + | ||
412 | +```dart | ||
413 | +GetMaterialApp( | ||
414 | + getPages: [ | ||
415 | + GetPage(name: '/', page:()=> Home()), | ||
416 | + ] | ||
417 | +) | ||
418 | +``` | ||
419 | + | ||
420 | +### Porque essa mudança | ||
421 | + | ||
422 | +Frequentemente, pode ser necessário decidir qual pagina vai ser mostrada ao usuário a partir de um parâmetro, como um token de login. A forma abordada anteriormente não era flexível, já que não permitia isso. | ||
423 | + | ||
424 | +Inserir a página numa função reduziu significativamente o consumo de RAM, já que as rotas não são alocadas na memória desde o app inicia, e também permite fazer esse tipo de abordagem: | ||
425 | + | ||
426 | +```dart | ||
427 | + | ||
428 | +GetStorage box = GetStorage(); | ||
429 | + | ||
430 | +GetMaterialApp( | ||
431 | + getPages: [ | ||
432 | + GetPage(name: '/', page:(){ | ||
433 | + return box.hasData('token') ? Home() : Login(); | ||
434 | + }) | ||
435 | + ] | ||
436 | +) | ||
437 | +``` | ||
438 | + | ||
439 | +# Porque eu fiz esse package | ||
440 | + | ||
441 | +O problema que esse package tenta resolver é possuir a maioria das funções que preciso num package só. | ||
442 | + | ||
443 | +Um dia, quando eu atualizei um dos meus apps no trabalho para o Flutter 1.9, algo ruim aconteceu: Tudo quebrou. | ||
444 | + | ||
445 | +Todas as bibliotecas pararam de funcionar, na atualização foi bloqueado o uso do hifen "-". Alguns atualizaram seus packages, outros não. Outros eu tive que olhar o porque do projeto não compilar. Outros simplesmente se tornaram incompatíveis com a versão atual, como o `image_extended` que eu até ofereci um PR lá pra conseguir corrigir, e tudo isso por causa de um simples update. | ||
446 | + | ||
447 | +Eu perdi 2 dias de trabalho só procurando por erros pra saber de onde eles vieram. | ||
448 | + | ||
449 | +Eu confesso que foi uma das situações mais estressantes que eu já passei na vida. Foi exatamente nesse dia que eu decidi colocar tudo num package. | ||
450 | + | ||
451 | +Eu sei que parece que esse package é feito só pra sanar minha experiência pessoal, mas eu sou um programador, e eu tento resolver problemas sempre da perspectiva do programador. Eu não me importo em nada mais que fazer a minha vida e de outros programadores mais fácil com esse package. | ||
452 | + | ||
453 | +Sempre que eu passo por uma experiência frustrante, eu escrevo no meu caleundário, e tento resolver depois de completar o projeto. | ||
454 | + | ||
455 | +E então eu decidi fazer um package que tenha três coisas que eu sempre uso: Gerenciamento de Estado, de rotas e de dependências. Depois eu fiz também internacionalização, e persistênsia de dados (estilo Hive) | ||
456 | + | ||
309 | Essa biblioteca sempre será atualizada e terá sempre nova features sendo implementadas. Sinta-se livre para oferecer PRs e contribuir com o package. | 457 | Essa biblioteca sempre será atualizada e terá sempre nova features sendo implementadas. Sinta-se livre para oferecer PRs e contribuir com o package. |
-
Please register or login to post a comment