📉Wrapper de Conectividade

Connectivity_wrapper é um plugin para Flutter que permite verificar a conectividade de rede do dispositivo em que o aplicativo está sendo executado. Ele é usado para verificar se o dispositivo está conectado à internet, se há conexão móvel ou Wi-Fi e se há problemas de conexão. O plugin oferece uma maneira fácil e rápida de verificar o status de conectividade do dispositivo, o que é essencial para aplicativos que dependem da internet para funcionar corretamente.

O principal objetivo do connectivity_wrapper é fornecer uma maneira simples de detectar o status da conectividade de rede do dispositivo. Ele é útil para aplicativos que precisam enviar ou receber dados da internet, pois permite que o aplicativo verifique rapidamente se a conexão está disponível. Além disso, o plugin também fornece uma maneira de lidar com situações em que a conexão é interrompida, o que pode ser útil para aplicativos que precisam lidar com interrupções de conexão.

Para utilizar o connectivity_wrapper, você precisa adicioná-lo ao seu arquivo pubspec.yaml. Após isso, você pode importá-lo em seu código usando a seguinte linha:

import 'package:connectivity_wrapper/connectivity_wrapper.dart';

Para utilizar o plugin, basta criar uma instância do widget ConnectivityWidgetWrapper. Este widget envolverá o conteúdo do seu aplicativo e fornecerá um feedback visual sobre o estado de conexão da rede. Você pode personalizar o widget de várias maneiras, incluindo a exibição de um ícone ou mensagem de erro personalizado quando a conexão estiver indisponível.

Exemplo de configuração:

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'My App',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Connectivity Wrapper'),
        ),
        body: ConnectivityWidgetWrapper(
          child: Container(
            child: Text('Meu aplicativo'),
          ),
          offlineWidget: Container(
            child: Text('Sem conexão'),
          ),
        ),
      ),
    );
  }
}

Exemplo de customização:

return ConnectivityAppWrapper(
      app: MaterialApp(
        navigatorKey: GetIt.I.get<NavigationService>().navigatorKey,
        title: 'TUYYO',
        debugShowCheckedModeBanner: false,
        themeMode: ThemeMode.light,
        theme: ThemeData(
          primaryColor: CustomColors.primary,
          fontFamily: "Avenir",
        ),
        home: const SplashScreen(),
        routes: routes,
        builder: (buildContext, widget) {
          return ConnectivityWidgetWrapper(
            child: widget!,
            disableInteraction: false,
            color: CustomColors.secondary,
            alignment: Alignment.bottomCenter,
            offlineWidget: IgnorePointer(
              ignoring: true,
              child: SizedBox(
                height: 75,
                child: Scaffold(
                  backgroundColor: Colors.transparent,
                  body: Padding(
                    padding: const EdgeInsets.fromLTRB(20, 0, 20, 0),
                    child: Container(
                      decoration: BoxDecoration(
                        color: CustomColors.black.withOpacity(0.75),
                        borderRadius: BorderRadius.circular(8),
                      ),
                      child: Padding(
                        padding: const EdgeInsets.all(16),
                        child: Row(
                          crossAxisAlignment: CrossAxisAlignment.center,
                          children: [
                            Icon(
                              Icons.error_outline,
                              color: CustomColors.white,
                            ),
                            const SizedBox(
                              width: 20,
                            ),
                            Text(
                              "Sem conexão com a internet",
                              style: Fonts.headline5.copyWith(
                                color: CustomColors.white,
                              ),
                            ),
                          ],
                        ),
                      ),
                    ),
                  ),
                ),
              ),
            ),
          );
        },
      ),
    );

Como utilizar o plugin para lidar com interrupções de conexão:

O connectivity_wrapper oferece a possibilidade de lidar com interrupções de conexão de forma simples e eficaz. Uma das maneiras de fazer isso é através do uso do método ConnectivityWrapper.of(context).onDisconnect, que recebe como parâmetro uma função que será chamada quando a conexão for interrompida. Por exemplo:

ConnectivityWrapper.of(context).onDisconnect(() {
  print("Conexão interrompida");
});

Realizar ação quando a internet conecta no app:

_connectivitySubscription = Connectivity()
        .onConnectivityChanged
        .listen((ConnectivityResult result) {
      if (result == ConnectivityResult.wifi ||
          result == ConnectivityResult.mobile) {
        store.reloadAppFunctions(); //Aqui é um exemplo de chamada minha, pra buscar de novo algumas funções pro app funcionar
      }
    });

Last updated