[FLUTTER] O básico sobre Inherited Widget.
O Flutter oferece uma variedade de pacotes para injeção de dependência e gerenciamento de estado. Um dos pacotes mais amplamente utilizados por um longo período foi o Provider, conhecido por sua solução de injeção de dependências que se baseava no uso de InheritedWidgets. Essa abordagem fornecia uma abstração eficiente para o sistema de injeção de dependências, que muitas vezes é considerado complexo e pouco escalável em outras estruturas de desenvolvimento de aplicativos.
A base de tudo os InheritedWidgets, são em sua essência, um meio de passar dados para baixo da árvore de widgets no Flutter, permitindo que widgets filhos tenham acesso direto aos dados fornecidos pelo seus pais. Isso proporciona uma maneira eficaz de compartilhar informações relevantes em toda a hierarquia de widgets, sem a necessidade de passar manualmente os dados através do construtor de cada classe Widget.
Aprender como funciona os InheritedWidgets tornará lógico compreender todos as suas abstrações.
A seguir o exemplo de implementação do código.
class CounterInherited extends InheritedWidget {
const CounterInherited({
super.key,
required this.counter,
required super.child,
});
final int counter;
static CounterInherited of(BuildContext context) {
final CounterInherited? result =
context.dependOnInheritedWidgetOfExactType<CounterInherited>();
if (result == null) {
throw Exception('No CounterInherited found in context');
}
return result;
}
@override
bool updateShouldNotify(CounterInherited oldWidget) {
return counter != oldWidget.counter;
}
}
`
Nessa implementação é construído o InheritedWidget, que recebe o dado a ser transmitido, e os filhos que poderão acessar esses dados.
É utilizado uma função of() para acessar, para ter uma chamada e tratamento próprio dos acessos por meio desse contexto.
E updateShouldNotify() decidirá se vai ocorrer o rebuild ou não na mudança dos valores.
Assim poderemos acessar o valor de qualquer widget filho do inherited.
`class UseCounter extends StatelessWidget {
const UseCounter({super.key});
@override
Widget build(BuildContext context) {
final counterInherited = CounterInherited.of(context);
return Center(
child: Text('${counterInherited.counter}'),
);
}
}`
**Uma forma simples né? assim ficaria o widget do Inherited
**
`class App extends StatefulWidget {
const App({super.key});
@override
State<App> createState() => _AppState();
}
class _AppState extends State<App> {
int counter = 0;
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: CounterInherited(
counter: counter,
child: const UseCounter(),
),
floatingActionButton:
Row(mainAxisAlignment: MainAxisAlignment.center, children: [
FloatingActionButton(
onPressed: () {
setState(() {
counter++;
});
},
child: const Icon(Icons.add),
),
const SizedBox(width: 8),
FloatingActionButton(
onPressed: () {
setState(() {
counter--;
});
},
child: const Icon(Icons.remove),
),
]),
),
);
}
}`
Embora InheritedWidget seja uma ferramenta poderosa, também possui algumas limitações. Por exemplo, pode se tornar complicado gerenciar grandes árvores de widgets com muitos dados compartilhados. Então cada caso um caso.