# Connective
## Giriş
Nylo, 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:
``` dart
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
| Özellik | Açıklama |
|----------|-------------|
| `onWifi` | WiFi ile bağlandığında gösterilen widget |
| `onMobile` | Mobil veri ile bağlandığında gösterilen widget |
| `onEthernet` | Ethernet ile bağlandığında gösterilen widget |
| `onVpn` | VPN ile bağlandığında gösterilen widget |
| `onBluetooth` | Bluetooth ile bağlandığında gösterilen widget |
| `onOther` | Diğer bağlantı türleri için widget |
| `onNone` | Çevrimdışıyken gösterilen widget |
| `child` | Belirli bir işleyici yoksa varsayılan widget |
### Özel Oluşturucu
Arayüz üzerinde tam kontrol için `Connective.builder` kullanın:
``` dart
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`
### Değişiklikleri Dinleme
Bağlantı değiştiğinde tepki vermek için `onConnectivityChanged` kullanın:
``` dart
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:
``` dart
Scaffold(
body: Stack(
children: [
// Your main content
MyPageContent(),
// Offline banner (auto-hides when online)
OfflineBanner(),
],
),
)
```
### Banner'ı Özelleştirme
``` dart
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ü
``` dart
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
``` dart
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
``` dart
// Get all active connection types
List 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
``` dart
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
``` dart
// 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
``` dart
// Show a different widget when offline
MyContent().connectiveOr(
offline: Text('Content unavailable offline'),
)
```
### Yalnızca Çevrimiçinde Gösterme
``` dart
// Hide completely when offline
SyncButton().onlyOnline()
```
### Yalnızca Çevrimdışında Gösterme
``` dart
// Show only when offline
OfflineMessage().onlyOffline()
```
## Parametreler
### Connective
| Parametre | Tür | Varsayılan | Açıklama |
|-----------|------|---------|-------------|
| `onWifi` | `Widget?` | - | WiFi'deyken widget |
| `onMobile` | `Widget?` | - | Mobil verideyken widget |
| `onEthernet` | `Widget?` | - | Ethernet'teyken widget |
| `onVpn` | `Widget?` | - | VPN'deyken widget |
| `onBluetooth` | `Widget?` | - | Bluetooth'tayken widget |
| `onOther` | `Widget?` | - | Diğer bağlantılar için widget |
| `onNone` | `Widget?` | - | Çevrimdışıyken widget |
| `child` | `Widget?` | - | Varsayılan widget |
| `showLoadingOnInit` | `bool` | `false` | Kontrol sırasında yükleme göster |
| `loadingWidget` | `Widget?` | - | Özel yükleme widget'ı |
| `onConnectivityChanged` | `Function?` | - | Değişiklikte callback |
### OfflineBanner
| Parametre | Tür | Varsayılan | Açıklama |
|-----------|------|---------|-------------|
| `message` | `String` | `'No internet connection'` | Banner metni |
| `backgroundColor` | `Color?` | `Colors.red.shade700` | Banner arka planı |
| `textColor` | `Color?` | `Colors.white` | Metin rengi |
| `icon` | `IconData?` | `Icons.wifi_off` | Banner simgesi |
| `height` | `double` | `40` | Banner yüksekliği |
| `animate` | `bool` | `true` | Kaydırma animasyonu etkinleştir |
| `animationDuration` | `Duration` | `300ms` | Animasyon süresi |
### NyConnectivityState Enum
| Değer | Açıklama |
|-------|-------------|
| `wifi` | WiFi ile bağlı |
| `mobile` | Mobil veri ile bağlı |
| `ethernet` | Ethernet ile bağlı |
| `vpn` | VPN ile bağlı |
| `bluetooth` | Bluetooth ile bağlı |
| `other` | Diğer bağlantı türü |
| `none` | Bağlantı yok |