Committed by
GitHub
Merge pull request #559 from eduardoflorence/documentation-improvements
Documentation improvements
Showing
1 changed file
with
146 additions
and
37 deletions
@@ -30,10 +30,11 @@ | @@ -30,10 +30,11 @@ | ||
30 | - [Mais detalhes sobre gerenciamento de dependências](#mais-detalhes-sobre-gerenciamento-de-dependências) | 30 | - [Mais detalhes sobre gerenciamento de dependências](#mais-detalhes-sobre-gerenciamento-de-dependências) |
31 | - [Como contribuir](#como-contribuir) | 31 | - [Como contribuir](#como-contribuir) |
32 | - [Utilidades](#utilidades) | 32 | - [Utilidades](#utilidades) |
33 | + - [Internacionalização](#internacionalização) | ||
33 | - [Mudar tema (changeTheme)](#mudar-tema-changetheme) | 34 | - [Mudar tema (changeTheme)](#mudar-tema-changetheme) |
34 | - [Outras APIs avançadas](#outras-apis-avançadas) | 35 | - [Outras APIs avançadas](#outras-apis-avançadas) |
35 | - [Configurações Globais opcionais e configurações manuais](#configurações-globais-opcionais-e-configurações-manuais) | 36 | - [Configurações Globais opcionais e configurações manuais](#configurações-globais-opcionais-e-configurações-manuais) |
36 | - - [Video explanation of Other GetX Features](#video-explanation-of-other-getx-features) | 37 | + - [Video explanation of Other GetX Features](#explicação-em-vídeo-sobre-outras-features-do-getx) |
37 | - [Breaking Changes da versão 2 para 3](#breaking-changes-da-versão-2-para-3) | 38 | - [Breaking Changes da versão 2 para 3](#breaking-changes-da-versão-2-para-3) |
38 | - [Tipagem Rx](#tipagem-rx) | 39 | - [Tipagem Rx](#tipagem-rx) |
39 | - [RxController e GetBuilder se uniram](#rxcontroller-e-getbuilder-se-uniram) | 40 | - [RxController e GetBuilder se uniram](#rxcontroller-e-getbuilder-se-uniram) |
@@ -45,21 +46,21 @@ | @@ -45,21 +46,21 @@ | ||
45 | 46 | ||
46 | [**Slack (Inglês)**](https://communityinviter.com/apps/getxworkspace/getx) | 47 | [**Slack (Inglês)**](https://communityinviter.com/apps/getxworkspace/getx) |
47 | 48 | ||
48 | -[**Discord (Inglês e Português)**](https://discord.com/invite/9Y3wK9) | 49 | +[**Discord (Inglês e Português)**](https://discord.com/invite/9Hpt99N) |
49 | 50 | ||
50 | [**Telegram (Português)**](https://t.me/joinchat/PhdbJRmsZNpAqSLJL6bH7g) | 51 | [**Telegram (Português)**](https://t.me/joinchat/PhdbJRmsZNpAqSLJL6bH7g) |
51 | 52 | ||
52 | # Sobre Get | 53 | # Sobre Get |
53 | 54 | ||
54 | -- 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. | 55 | +- Get é uma biblioteca poderosa e extraleve 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. |
55 | - Get não é para todos, seu foco é: | 56 | - Get não é para todos, seu foco é: |
56 | - **Performance**: Já que gasta o mínimo de recursos | 57 | - **Performance**: Já que gasta o mínimo de recursos |
57 | - **Produtividade**: Usando uma sintaxe fácil e agradável | 58 | - **Produtividade**: Usando uma sintaxe fácil e agradável |
58 | - **Organização**: Que permite o total desacoplamento da View e da lógica de negócio. | 59 | - **Organização**: Que permite o total desacoplamento da View e da lógica de negócio. |
59 | -- Get vai economizar horas de desenvolvimento, e vai extrair a performance máxima que sua aplicação pode entregar, enquanto é fácil para iniciantes e preciso para experts. | 60 | +- Get vai economizar horas de desenvolvimento e vai extrair a performance máxima que sua aplicação pode entregar, enquanto é fácil para iniciantes e preciso para experts. |
60 | - Navegue por rotas sem `context`, abra `Dialog`s, `Snackbar`s ou `BottomSheet`s de qualquer lugar no código, gerencie estados e injete dependências de uma forma simples e prática. | 61 | - Navegue por rotas sem `context`, abra `Dialog`s, `Snackbar`s ou `BottomSheet`s de qualquer lugar no código, gerencie estados e injete dependências de uma forma simples e prática. |
61 | - Get é seguro, estável, atualizado e oferece uma enorme gama de APIs que não estão presentes no framework padrão. | 62 | - Get é seguro, estável, atualizado e oferece uma enorme gama de APIs que não estão presentes no framework padrão. |
62 | -- GetX é desacoplado. 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. | 63 | +- GetX é desacoplado. 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. |
63 | 64 | ||
64 | **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. | 65 | **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. |
65 | 66 | ||
@@ -89,12 +90,12 @@ Troque `MaterialApp` para `GetMaterialApp` | @@ -89,12 +90,12 @@ Troque `MaterialApp` para `GetMaterialApp` | ||
89 | void main() => runApp(GetMaterialApp(home: Home())); | 90 | void main() => runApp(GetMaterialApp(home: Home())); |
90 | ``` | 91 | ``` |
91 | 92 | ||
92 | -- **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: | 93 | +- **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 gerenciador de estado ou somente o gerenciador de dependências, não é necessário usar o GetMaterialApp. Ele somente é necessário para: |
93 | - Rotas | 94 | - Rotas |
94 | - Snackbars/bottomsheets/dialogs | 95 | - Snackbars/bottomsheets/dialogs |
95 | - apis relacionadas a rotas e a ausência de `context` | 96 | - apis relacionadas a rotas e a ausência de `context` |
96 | - Internacionalização | 97 | - Internacionalização |
97 | -- **Obs²:** Esse passo só é necessário se você for usar o gerenciamento de rotas (`Get,to()`, `Get.back()` e assim por diante), Se você não vai usar isso então não é necessário seguir o passo 1 | 98 | +- **Obs²:** Esse passo só é necessário se você for usar o gerenciamento de rotas (`Get.to()`, `Get.back()` e assim por diante), Se você não vai usar isso então não é necessário seguir o passo 1 |
98 | 99 | ||
99 | - Passo 2: | 100 | - Passo 2: |
100 | Cria a sua classe de regra de negócio e coloque todas as variáveis, métodos e controllers dentro dela. | 101 | Cria a sua classe de regra de negócio e coloque todas as variáveis, métodos e controllers dentro dela. |
@@ -159,7 +160,7 @@ Definitivamente, Get não é o inimigo de nenhum gerenciador, porque Get é um m | @@ -159,7 +160,7 @@ Definitivamente, Get não é o inimigo de nenhum gerenciador, porque Get é um m | ||
159 | 160 | ||
160 | Programação reativa pode alienar muitas pessoas porque é dito que é complicado. GetX transforma a programação reativa em algo bem simples: | 161 | Programação reativa pode alienar muitas pessoas porque é dito que é complicado. GetX transforma a programação reativa em algo bem simples: |
161 | 162 | ||
162 | -* Você não precisa de criar StreamControllers | 163 | +* Você não precisa criar StreamControllers |
163 | * Você não precisa criar um StreamBuilder para cada variável | 164 | * Você não precisa criar um StreamBuilder para cada variável |
164 | * Você não precisa criar uma classe para cada estado | 165 | * Você não precisa criar uma classe para cada estado |
165 | * Você não precisa criar um get para o valor inicial | 166 | * Você não precisa criar um get para o valor inicial |
@@ -225,7 +226,7 @@ Para ir para a próxima tela e cancelar todas as rotas anteriores (útil em tela | @@ -225,7 +226,7 @@ Para ir para a próxima tela e cancelar todas as rotas anteriores (útil em tela | ||
225 | Get.offAll(ProximaTela()); | 226 | Get.offAll(ProximaTela()); |
226 | ``` | 227 | ``` |
227 | 228 | ||
228 | -Para navegar para a próxima rota, e receber ou atualizar dados assim que retornar da rota: | 229 | +Para navegar para a próxima rota e receber ou atualizar dados assim que retornar da rota: |
229 | 230 | ||
230 | ```dart | 231 | ```dart |
231 | var dados = await Get.to(Pagamento()); | 232 | var dados = await Get.to(Pagamento()); |
@@ -263,7 +264,7 @@ Agora, imagine que você navegou por inúmeras rotas e precisa de dados que fora | @@ -263,7 +264,7 @@ Agora, imagine que você navegou por inúmeras rotas e precisa de dados que fora | ||
263 | 264 | ||
264 | ```dart | 265 | ```dart |
265 | Controller controller = Get.find(); | 266 | Controller controller = Get.find(); |
266 | -// Sim, parece Magia, o Get irá descobrir qual é seu controller, e irá te entregar. | 267 | +// Sim, parece Magia, o Get irá descobrir qual é seu controller e irá te entregar. |
267 | // Você pode ter 1 milhão de controllers instanciados, o Get sempre te entregará o controller correto. | 268 | // Você pode ter 1 milhão de controllers instanciados, o Get sempre te entregará o controller correto. |
268 | // Apenas se lembre de Tipar seu controller, final controller = Get.find(); por exemplo, não irá funcionar. | 269 | // Apenas se lembre de Tipar seu controller, final controller = Get.find(); por exemplo, não irá funcionar. |
269 | ``` | 270 | ``` |
@@ -274,7 +275,7 @@ E então você será capaz de recuperar os dados do seu controller que foram obt | @@ -274,7 +275,7 @@ E então você será capaz de recuperar os dados do seu controller que foram obt | ||
274 | Text(controller.textFromApi); | 275 | Text(controller.textFromApi); |
275 | ``` | 276 | ``` |
276 | 277 | ||
277 | -Procurando por `lazyLoading`?(carregar somente quando for usar) Você pode declarar todos os seus controllers, e eles só vão ser inicializados e chamados quando alguém precisar. Você pode fazer isso | 278 | +Procurando por `lazyLoading` (carregar somente quando for usar)? Você pode declarar todos os seus controllers e eles só vão ser inicializados e chamados quando alguém precisar. Você pode fazer isso |
278 | 279 | ||
279 | ```dart | 280 | ```dart |
280 | Get.lazyPut<Service>(()=> ApiMock()); | 281 | Get.lazyPut<Service>(()=> ApiMock()); |
@@ -291,7 +292,7 @@ Quer contribuir no projeto? Nós ficaremos orgulhosos de ressaltar você como um | @@ -291,7 +292,7 @@ Quer contribuir no projeto? Nós ficaremos orgulhosos de ressaltar você como um | ||
291 | 292 | ||
292 | - Ajudando a traduzir o README para outras linguagens. | 293 | - Ajudando a traduzir o README para outras linguagens. |
293 | - Adicionando mais documentação ao README (até o momento, várias das funcionalidades do Get não foram documentadas). | 294 | - Adicionando mais documentação ao README (até o momento, várias das funcionalidades do Get não foram documentadas). |
294 | -- Fazendo artigos/vídeos ensinando a usar o Get (eles serão inseridos no README, e no futuro na nossa Wiki). | 295 | +- Fazendo artigos/vídeos ensinando a usar o Get (eles serão inseridos no README e no futuro na nossa Wiki). |
295 | - Fazendo PR's (Pull-Requests) para código/testes. | 296 | - Fazendo PR's (Pull-Requests) para código/testes. |
296 | - Incluindo novas funcionalidades. | 297 | - Incluindo novas funcionalidades. |
297 | 298 | ||
@@ -299,9 +300,64 @@ Qualquer contribuição é bem-vinda! | @@ -299,9 +300,64 @@ Qualquer contribuição é bem-vinda! | ||
299 | 300 | ||
300 | # Utilidades | 301 | # Utilidades |
301 | 302 | ||
303 | +## Internacionalização | ||
304 | +### Traduções | ||
305 | +As traduções são mantidas num simples dictionary map de chave-valor. | ||
306 | +Para adicionar traduções personalizadas, crie uma classe e estenda `Translations`. | ||
307 | +```dart | ||
308 | +import 'package:get/get.dart'; | ||
309 | + | ||
310 | +class Messages extends Translations { | ||
311 | + @override | ||
312 | + Map<String, Map<String, String>> get keys => { | ||
313 | + 'en_US': { | ||
314 | + 'hello': 'Hello World', | ||
315 | + }, | ||
316 | + 'de_DE': { | ||
317 | + 'hello': 'Hallo Welt', | ||
318 | + } | ||
319 | + }; | ||
320 | +} | ||
321 | +``` | ||
322 | + | ||
323 | +#### Usando traduções | ||
324 | +Basta anexar `.tr` a chave especificada e ela será traduzida, usando o valor atual de `Get.locale` e `Get.fallbackLocale`. | ||
325 | +```dart | ||
326 | +Text('hello'.tr); | ||
327 | +``` | ||
328 | + | ||
329 | +### Localidade | ||
330 | +Passe parâmetros para `GetMaterialApp` definir a localidade e as traduções. | ||
331 | + | ||
332 | +```dart | ||
333 | +return GetMaterialApp( | ||
334 | + translations: Messages(), // suas traduções | ||
335 | + locale: Locale('en', 'US'), // as traduções serão exibidas para esta localidade | ||
336 | + fallbackLocale: Locale('en', 'UK'), // especifica uma localidade em caso de falha na localidade definida | ||
337 | + supportedLocales: <Locale>[Locale('en', 'UK'), Locale('en', 'US'), Locale('de','DE')] // especifica as localidades suportados | ||
338 | +); | ||
339 | +``` | ||
340 | + | ||
341 | +#### Alterar local | ||
342 | +Use `Get.updateLocale(locale)` para atualizar a localidade. As traduções usarão automaticamente a nova localidade. | ||
343 | +```dart | ||
344 | +var locale = Locale('en', 'US'); | ||
345 | +Get.updateLocale(locale); | ||
346 | +``` | ||
347 | + | ||
348 | +#### Localidade do sistema operacional | ||
349 | +Para ler a localidade do sistema operacional, você pode usar `window.locale`. | ||
350 | +```dart | ||
351 | +import 'dart:ui' as ui; | ||
352 | + | ||
353 | +return GetMaterialApp( | ||
354 | + locale: ui.window.locale, | ||
355 | +); | ||
356 | +``` | ||
357 | + | ||
302 | ## Mudar tema (changeTheme) | 358 | ## Mudar tema (changeTheme) |
303 | 359 | ||
304 | -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. | 360 | +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. |
305 | 361 | ||
306 | Você pode criar seu tema customizado e simplesmente adicionar dentro do `Get.changeTheme` sem nenhum boilerplate para isso: | 362 | Você pode criar seu tema customizado e simplesmente adicionar dentro do `Get.changeTheme` sem nenhum boilerplate para isso: |
307 | 363 | ||
@@ -319,7 +375,7 @@ Get.changeTheme( | @@ -319,7 +375,7 @@ Get.changeTheme( | ||
319 | ) | 375 | ) |
320 | ``` | 376 | ``` |
321 | 377 | ||
322 | -Quando o modo Dark está ativado, ele vai trocar pro modo light, e vice versa. | 378 | +Quando o modo Dark está ativado, ele vai trocar pro modo light e vice versa. |
323 | 379 | ||
324 | 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): | 380 | 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): |
325 | 381 | ||
@@ -390,47 +446,65 @@ Get.contextOverlay | @@ -390,47 +446,65 @@ Get.contextOverlay | ||
390 | context.width | 446 | context.width |
391 | context.height | 447 | context.height |
392 | 448 | ||
393 | -/// similar to MediaQuery.of(this).padding | 449 | +// Dá a você agora o poder de definir metade da tela, um terço da dela e assim por diante. |
450 | +// Útil para aplicativos responsivos. | ||
451 | +// param dividedBy (double) opcional - default: 1 | ||
452 | +// param reducedBy (double) opcional - default: 0 | ||
453 | +context.heightTransformer() | ||
454 | +context.widthTransformer() | ||
455 | + | ||
456 | +/// similar a MediaQuery.of(context).size | ||
457 | +context.mediaQuerySize() | ||
458 | + | ||
459 | +/// similar a MediaQuery.of(this).padding | ||
394 | context.mediaQueryPadding() | 460 | context.mediaQueryPadding() |
395 | 461 | ||
396 | -/// similar to MediaQuery.of(this).viewPadding | 462 | +/// similar a MediaQuery.of(this).viewPadding |
397 | context.mediaQueryViewPadding() | 463 | context.mediaQueryViewPadding() |
398 | 464 | ||
399 | -/// similar to MediaQuery.of(this).viewInsets; | 465 | +/// similar a MediaQuery.of(this).viewInsets; |
400 | context.mediaQueryViewInsets() | 466 | context.mediaQueryViewInsets() |
401 | 467 | ||
402 | -/// similar to MediaQuery.of(this).orientation; | 468 | +/// similar a MediaQuery.of(this).orientation; |
403 | context.orientation() | 469 | context.orientation() |
404 | 470 | ||
405 | -/// check if device is on landscape mode | 471 | +/// verifica se o dispositivo está no modo paisagem |
406 | context.isLandscape() | 472 | context.isLandscape() |
407 | 473 | ||
408 | -/// check if device is on portrait mode | 474 | +/// verifica se o dispositivo está no modo retrato |
409 | context.isPortrait() | 475 | context.isPortrait() |
410 | 476 | ||
411 | -/// similar to MediaQuery.of(this).devicePixelRatio; | 477 | +/// similar a MediaQuery.of(this).devicePixelRatio; |
412 | context.devicePixelRatio() | 478 | context.devicePixelRatio() |
413 | 479 | ||
414 | -/// similar to MediaQuery.of(this).textScaleFactor; | 480 | +/// similar a MediaQuery.of(this).textScaleFactor; |
415 | context.textScaleFactor() | 481 | context.textScaleFactor() |
416 | 482 | ||
417 | -/// get the shortestSide from screen | 483 | +/// obtém a menor dimensão (largura ou altura) da tela |
418 | context.mediaQueryShortestSide() | 484 | context.mediaQueryShortestSide() |
419 | 485 | ||
420 | -/// True if width be larger than 800 | 486 | +/// retorna True se a largura da tela for maior que 800px |
421 | context.showNavbar() | 487 | context.showNavbar() |
422 | 488 | ||
423 | -/// True if the shortestSide is smaller than 600p | 489 | +/// retorna True se a menor dimensão (largura ou altura) da tela for menor que 600px |
424 | context.isPhone() | 490 | context.isPhone() |
425 | 491 | ||
426 | -/// True if the shortestSide is largest than 600p | 492 | +/// retorna True se a menor dimensão (largura ou altura) da tela for maior ou igual a 600px |
427 | context.isSmallTablet() | 493 | context.isSmallTablet() |
428 | 494 | ||
429 | -/// True if the shortestSide is largest than 720p | 495 | +/// retorna True se a menor dimensão (largura ou altura) da tela for maior ou igual a 720px |
430 | context.isLargeTablet() | 496 | context.isLargeTablet() |
431 | 497 | ||
432 | -/// True if the current device is Tablet | 498 | +/// retorna True se o dispositivo é um Tablet |
433 | context.isTablet() | 499 | context.isTablet() |
500 | + | ||
501 | +/// Retorna um valor de acordo com o tamanho da tela | ||
502 | +/// Os valores possíveis são: | ||
503 | +/// swatch: se a menor dimensão (largura ou altura) da tela for menor que 300px | ||
504 | +/// mobile: se a menor dimensão (largura ou altura) da tela for menor que 600px | ||
505 | +/// tablet: se a menor dimensão (largura ou altura) da tela for menor que 1200px | ||
506 | +/// desktop: se a largura da tela é maior ou iguial a 1200px | ||
507 | +context.responsiveValue<T>() | ||
434 | ``` | 508 | ``` |
435 | 509 | ||
436 | ### Configurações Globais opcionais e configurações manuais | 510 | ### Configurações Globais opcionais e configurações manuais |
@@ -489,10 +563,45 @@ void localLogWriter(String text, {bool isError = false}) { | @@ -489,10 +563,45 @@ void localLogWriter(String text, {bool isError = false}) { | ||
489 | } | 563 | } |
490 | ``` | 564 | ``` |
491 | 565 | ||
492 | -## Video explanation of Other GetX Features | 566 | +### Widgets de Estado Local |
567 | + | ||
568 | +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. | ||
569 | + | ||
570 | +#### ValueBuilder | ||
571 | +Uma simplificação de StatefulWidget que funciona com um callback de "setState" que passa o valor atualizado. | ||
572 | + | ||
573 | + | ||
574 | +```dart | ||
575 | +ValueBuilder<bool>( | ||
576 | + initialValue: false, | ||
577 | + builder: (value, updateFn) => Switch( | ||
578 | + value: value, | ||
579 | + onChanged: updateFn, // mesma assinatura! Você poderia usar ( newValue ) => updateFn( newValue ) | ||
580 | + ), | ||
581 | + // se você precisa chamar algo fora do método builder. | ||
582 | + onUpdate: (value) => print("Value updated: $value"), | ||
583 | + onDispose: () => print("Widget unmounted"), | ||
584 | +), | ||
585 | +``` | ||
586 | + | ||
587 | +#### ObxValue | ||
588 | +Similar a ValueBuilder, mas esta é a versão Reativa, você passa uma instância Rx (lembra do .obs mágico?) e | ||
589 | +atualiza automaticamente... não é incrível? | ||
590 | + | ||
591 | +```dart | ||
592 | +ObxValue( | ||
593 | + (data) => Switch( | ||
594 | + value: data.value, | ||
595 | + onChanged: data, // Rx tem uma função _callable_! Você poderia usar (flag) => data.value = flag, | ||
596 | + ), | ||
597 | + false.obs, | ||
598 | +), | ||
599 | +``` | ||
600 | + | ||
601 | +## Explicação em vídeo sobre Outras Features do GetX | ||
493 | 602 | ||
494 | 603 | ||
495 | -Amateur Coder did an awesome video about utils, storage, bindings and other features! Link: [GetX Other Features](https://youtu.be/ttQtlX_Q0eU) | 604 | +Amateur Coder fez um vídeo incrível sobre utils, storage, bindings e outras features! Link: [GetX Other Features](https://youtu.be/ttQtlX_Q0eU) |
496 | 605 | ||
497 | # Breaking Changes da versão 2 para 3 | 606 | # Breaking Changes da versão 2 para 3 |
498 | 607 | ||
@@ -502,7 +611,7 @@ Amateur Coder did an awesome video about utils, storage, bindings and other feat | @@ -502,7 +611,7 @@ Amateur Coder did an awesome video about utils, storage, bindings and other feat | ||
502 | | -------- | ---------- | | 611 | | -------- | ---------- | |
503 | | StringX | `RxString` | | 612 | | StringX | `RxString` | |
504 | | IntX | `RxInt` | | 613 | | IntX | `RxInt` | |
505 | -| MapX | `RxMax` | | 614 | +| MapX | `RxMap` | |
506 | | ListX | `RxList` | | 615 | | ListX | `RxList` | |
507 | | NumX | `RxNum` | | 616 | | NumX | `RxNum` | |
508 | | RxDouble | `RxDouble` | | 617 | | RxDouble | `RxDouble` | |
@@ -558,7 +667,7 @@ GetMaterialApp( | @@ -558,7 +667,7 @@ GetMaterialApp( | ||
558 | 667 | ||
559 | 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. | 668 | 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. |
560 | 669 | ||
561 | -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: | 670 | +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 no momento que o app é iniciado e também permite fazer esse tipo de abordagem: |
562 | 671 | ||
563 | ```dart | 672 | ```dart |
564 | 673 | ||
@@ -575,11 +684,11 @@ GetMaterialApp( | @@ -575,11 +684,11 @@ GetMaterialApp( | ||
575 | 684 | ||
576 | # Por que GetX? | 685 | # Por que GetX? |
577 | 686 | ||
578 | -1- Muitas vezes após uma atualização do Flutter, muitos dos seus packages irão quebrar. As vezes acontecem erros de compilação, muitas vezes aparecem erros que ainda não existem respostas sobre, e o desenvolvedor necessita saber de onde o erro veio, rastrear o erro, para só então tentar abrir uma issue no repositório correspondente, e ver seu problema resolvido. Get centraliza os principais recursos para o desenvolvimento (Gerencia de estado, de dependencias e de rotas), permitindo você adicionar um único package em seu pubspec, e começar a trabalhar. Após uma atualização do Flutter, a única coisa que você precisa fazer é atualizar a dependencia do Get, e começar a trabalhar. Get também resolve problemas de compatibilidade. Quantas vezes uma versão de um package não é compatível com a versão de outro, porque um utiliza uma dependencia em uma versão, e o outro em outra versão? Essa também não é uma preocupação usando Get, já que tudo está no mesmo package e é totalmente compatível. | 687 | +1- Muitas vezes após uma atualização do Flutter, muitos dos seus packages irão quebrar. As vezes acontecem erros de compilação, muitas vezes aparecem erros que ainda não existem respostas sobre e o desenvolvedor necessita saber de onde o erro veio, rastreá-lo, para só então tentar abrir uma issue no repositório correspondente e ver seu problema resolvido. Get centraliza os principais recursos para o desenvolvimento (Gerência de estado, de dependências e de rotas), permitindo você adicionar um único package em seu pubspec e começar a trabalhar. Após uma atualização do Flutter, a única coisa que você precisa fazer é atualizar a dependencia do Get e começar a trabalhar. Get também resolve problemas de compatibilidade. Quantas vezes uma versão de um package não é compatível com a versão de outro, porque um utiliza uma dependência em uma versão e o outro em outra versão? Essa também não é uma preocupação usando Get, já que tudo está no mesmo package e é totalmente compatível. |
579 | 688 | ||
580 | -2- Flutter é fácil, Flutter é incrível, mas Flutter ainda tem algum boilerplate que pode ser indesejado para maioria dos desenvolvedores, como o Navigator.of(context).push(context, builder[...]. Get simplifica o desenvolvimento. Em vez de escrever 8 linhas de código para apenas chamar uma rota, você pode simplesmente fazer: Get.to(Home()) e pronto, você irá para a próxima página. Urls dinamicas da web é algo realmente doloroso de fazer com o Flutter atualmente, e isso com o GetX é estupidamente simples. Gerenciar estados no Flutter, e gerenciar dependencias também é algo que gera muita discussão, por haver centenas de padrões na pub. Mas não há nada que seja tão fácil quanto adicionar um ".obs" no final de sua variável, e colocar o seu widget dentro de um Obx, e pronto, todas atualizações daquela variável será automaticamente atualizado na tela. | 689 | +2- Flutter é fácil, Flutter é incrível, mas Flutter ainda tem algum boilerplate que pode ser indesejado para maioria dos desenvolvedores, como o Navigator.of(context).push(context, builder[...]. Get simplifica o desenvolvimento. Em vez de escrever 8 linhas de código para apenas chamar uma rota, você pode simplesmente fazer: Get.to(Home()) e pronto, você irá para a próxima página. Urls dinâmicas da web é algo realmente doloroso de fazer com o Flutter atualmente e isso com o GetX é estupidamente simples. Gerenciar estados no Flutter e gerenciar dependências também é algo que gera muita discussão, por haver centenas de padrões na pub. Mas não há nada que seja tão fácil quanto adicionar um ".obs" no final de sua variável, colocar o seu widget dentro de um Obx e pronto, todas atualizações daquela variável serão automaticamente atualizadas na tela. |
581 | 690 | ||
582 | -3- Facilidade sem se preocupar com desempenho. O desempenho do Flutter já é incrível, mas imagine que você use um gerenciador de estados, e um locator para distribuir suas classes blocs/stores/controllers/ etc. Você deverá chamar manualmente a exclusão daquela dependencia quando não precisar dela. Mas já pensou em simplesmente usar seu controlador, e quando ele não tivesse mais sendo usado por ninguém, ele simplesmente fosse excluído da memória? É isso que GetX faz. Com o SmartManagement, tudo que não está sendo usado é excluído da memória, e você não deve se preocupar em nada além de programar. Você terá garantia que está consumindo o mínimo de recursos necessários, sem ao menos ter criado uma lógica para isso. | 691 | +3- Facilidade sem se preocupar com desempenho. O desempenho do Flutter já é incrível, mas imagine que você use um gerenciador de estados e um locator para distribuir suas classes blocs/stores/controllers/ etc. Você deverá chamar manualmente a exclusão daquela dependência quando não precisar dela. Mas já pensou em simplesmente usar seu controlador e quando ele não tivesse mais sendo usado por ninguém, ele simplesmente fosse excluído da memória? É isso que GetX faz. Com o SmartManagement, tudo que não está sendo usado é excluído da memória e você não deve se preocupar em nada além de programar. Você terá garantia que está consumindo o mínimo de recursos necessários, sem ao menos ter criado uma lógica para isso. |
583 | 692 | ||
584 | -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, MVVM, e 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. | ||
585 | -Se você precisa de context para localizar um InheritedWidget, você precisa disso na view, ou passar o context por parametro. Eu particularmente acho essa solução muito feia, e para trabalhar em equipes teremos sempre uma dependencia 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ócios ficarão livres para criar e testar a lógica de negócios separadamente. | 693 | +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. |
694 | +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. |
-
Please register or login to post a comment