Connective

Giriş

Nylo Website, ağ değişikliklerine yanıt veren uygulamalar oluşturmanıza yardımcı olmak için bağlantı farkındalığına sahip widget'lar ve yardımcı araçlar sağlar. Connective widget'ı, bağlantı değiştiğinde otomatik olarak yeniden oluşturulurken, NyConnectivity yardımcısı bağlantı durumunu kontrol etmek için statik metotlar sağlar.

Connective Widget

Connective widget'ı, bağlantı değişikliklerini dinler ve mevcut ağ durumuna göre yeniden oluşturulur.

Duruma Dayalı Oluşturucular

Her bağlantı türü için farklı widget'lar sağlayın:

Connective(
  onWifi: Text('Connected via WiFi'),
  onMobile: Text('Connected via Mobile Data'),
  onNone: Column(
    mainAxisAlignment: MainAxisAlignment.center,
    children: [
      Icon(Icons.wifi_off, size: 64),
      Text('No internet connection'),
    ],
  ),
  child: Text('Connected'), // Default for unspecified states
)

Mevcut Durumlar

Özel Oluşturucu

Arayüz üzerinde tam kontrol için Connective.builder kullanın:

Connective.builder(
  builder: (context, state, results) {
    if (state == NyConnectivityState.none) {
      return Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Icon(Icons.cloud_off, size: 64, color: Colors.grey),
            SizedBox(height: 16),
            Text('You are offline'),
            ElevatedButton(
              onPressed: () => Navigator.pop(context),
              child: Text('Go Back'),
            ),
          ],
        ),
      );
    }

    // Show connection type
    return Text('Connected via: ${state.name}');
  },
)

Oluşturucu şunları alır:

• context - BuildContext
• state - NyConnectivityState enum (wifi, mobile, ethernet, vpn, bluetooth, other, none)
• results - Birden fazla bağlantıyı kontrol etmek için List<ConnectivityResult>

Değişiklikleri Dinleme

Bağlantı değiştiğinde tepki vermek için onConnectivityChanged kullanın:

Connective(
  onConnectivityChanged: (state, results) {
    if (state == NyConnectivityState.none) {
      showSnackbar('You went offline');
    } else {
      showSnackbar('Back online!');
    }
  },
  child: MyContent(),
)

OfflineBanner Widget

Çevrimdışıyken ekranın üstünde bir banner görüntüleyin:

Scaffold(
  body: Stack(
    children: [
      // Your main content
      MyPageContent(),

      // Offline banner (auto-hides when online)
      OfflineBanner(),
    ],
  ),
)

Banner'ı Özelleştirme

OfflineBanner(
  message: 'Check your connection',
  backgroundColor: Colors.orange,
  textColor: Colors.white,
  icon: Icons.signal_wifi_off,
  height: 50,
  animate: true, // Slide in/out animation
  animationDuration: Duration(milliseconds: 200),
)

NyConnectivity Yardımcısı

NyConnectivity sınıfı, bağlantıyı kontrol etmek için statik metotlar sağlar:

Çevrimİçi/Çevrimdışı Kontrolü

if (await NyConnectivity.isOnline()) {
  // Make API request
  final data = await api.fetchData();
} else {
  // Load from cache
  final data = await cache.getData();
}

// Or check if offline
if (await NyConnectivity.isOffline()) {
  showOfflineMessage();
}

Belirli Bağlantı Türlerini Kontrol Etme

if (await NyConnectivity.isWifi()) {
  // Download large files on WiFi
  await downloadLargeFile();
}

if (await NyConnectivity.isMobile()) {
  // Warn about data usage
  showDataWarning();
}

// Other methods:
await NyConnectivity.isEthernet();
await NyConnectivity.isVpn();
await NyConnectivity.isBluetooth();

Mevcut Durumu Alma

// Get all active connection types
List<ConnectivityResult> results = await NyConnectivity.status();

if (results.contains(ConnectivityResult.wifi)) {
  print('WiFi is active');
}

// Get human-readable string
String type = await NyConnectivity.connectionTypeString();
print('Connected via: $type'); // "WiFi", "Mobile", "None", etc.

Değişiklikleri Dinleme

StreamSubscription subscription = NyConnectivity.stream().listen((results) {
  if (results.contains(ConnectivityResult.none)) {
    showOfflineUI();
  } else {
    showOnlineUI();
  }
});

// Don't forget to cancel when done
@override
void dispose() {
  subscription.cancel();
  super.dispose();
}

Koşullu Yürütme

// Execute only when online (returns null if offline)
final data = await NyConnectivity.whenOnline(() async {
  return await api.fetchData();
});

if (data == null) {
  showOfflineMessage();
}

// Execute different callbacks based on status
final result = await NyConnectivity.when(
  online: () async => await api.fetchData(),
  offline: () async => await cache.getData(),
);

Widget Uzantıları

Herhangi bir widget'a hızla bağlantı farkındalığı ekleyin:

Çevrimdışı Alternatif Gösterme

// Show a different widget when offline
MyContent().connectiveOr(
  offline: Text('Content unavailable offline'),
)

Yalnızca Çevrimiçinde Gösterme

// Hide completely when offline
SyncButton().onlyOnline()

Yalnızca Çevrimdışında Gösterme

// Show only when offline
OfflineMessage().onlyOffline()

Parametreler

Connective

OfflineBanner

NyConnectivityState Enum