bl3kunja/SDKmuta
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

emojis removed, updated headers, added spectate mode

Browse Source
This commit is contained in:
bl3kunja
2025-12-20 10:17:23 +01:00
parent 5ae91d70e6
commit 3d033817a5
11 changed files with 1506 additions and 348 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/screens/multi_camera_screen.dart
+248
View File
@@ -0,0 +1,248 @@
import 'package:flutter/material.dart';
import 'package:flutter_mjpeg/flutter_mjpeg.dart';
import '../utils/translations.dart';
class MultiCameraScreen extends StatefulWidget {
final List<Map<String, dynamic>> cameras;
final String selectedLanguage;
const MultiCameraScreen({
super.key,
required this.cameras,
required this.selectedLanguage,
});
@override
State<MultiCameraScreen> createState() => _MultiCameraScreenState();
}
class _MultiCameraScreenState extends State<MultiCameraScreen> {
int? _fullscreenIndex; // null = grid view, index = fullscreen camera
String _t(String key) {
return AppTranslations.translate(key, widget.selectedLanguage);
}
// Calculate grid columns based on camera count
int get _crossAxisCount {
final count = widget.cameras.length;
if (count == 1) return 1;
if (count <= 4) return 2;
return 3; // 5-6 cameras
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(
_fullscreenIndex == null
? _t('Multi-Camera View')
: "${_t('Camera')} ${widget.cameras[_fullscreenIndex!]['index']}",
),
backgroundColor: Colors.grey[900],
foregroundColor: Colors.white,
leading: IconButton(
icon: const Icon(Icons.arrow_back, color: Colors.white),
onPressed: () {
if (_fullscreenIndex != null) {
setState(() {
_fullscreenIndex = null; // Exit fullscreen first
});
} else {
Navigator.pop(context); // Exit screen
}
},
),
),
backgroundColor: Colors.black,
body: _fullscreenIndex == null
? _buildGridView()
: _buildFullscreenView(_fullscreenIndex!),
);
}
Widget _buildGridView() {
return GridView.builder(
padding: const EdgeInsets.all(8),
itemCount: widget.cameras.length,
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: _crossAxisCount,
mainAxisSpacing: 8,
crossAxisSpacing: 8,
childAspectRatio: 4 / 3, // 4:3 aspect ratio for camera feeds
),
itemBuilder: (context, index) {
return _buildCameraCell(index);
},
);
}
Widget _buildCameraCell(int index) {
final camera = widget.cameras[index];
final cameraIndex = camera['index'] as int;
final cameraIp = camera['ip'] as String;
final streamUrl = cameraIp.startsWith(RegExp(r"https?://"))
? cameraIp
: "http://$cameraIp";
return GestureDetector(
onTap: () {
setState(() {
_fullscreenIndex = index; // Enter fullscreen
});
},
child: Container(
decoration: BoxDecoration(
color: Colors.black,
borderRadius: BorderRadius.circular(8),
border: Border.all(color: Colors.grey[700]!, width: 1),
),
child: ClipRRect(
borderRadius: BorderRadius.circular(8),
child: Stack(
children: [
// MJPEG Stream
Mjpeg(
stream: streamUrl,
isLive: true,
fit: BoxFit.contain,
error: (context, error, stackTrace) {
return _buildErrorWidget(cameraIndex);
},
),
// Camera label overlay
Positioned(
top: 8,
left: 8,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
decoration: BoxDecoration(
color: Colors.black.withValues(alpha: 0.6),
borderRadius: BorderRadius.circular(4),
),
child: Text(
"${_t('Camera')} $cameraIndex",
style: const TextStyle(
color: Colors.white,
fontSize: 12,
fontWeight: FontWeight.w600,
),
),
),
),
],
),
),
),
);
}
Widget _buildFullscreenView(int index) {
final camera = widget.cameras[index];
final cameraIndex = camera['index'] as int;
final cameraIp = camera['ip'] as String;
final streamUrl = cameraIp.startsWith(RegExp(r"https?://"))
? cameraIp
: "http://$cameraIp";
return GestureDetector(
onTap: () {
setState(() {
_fullscreenIndex = null; // Exit fullscreen, return to grid
});
},
child: Container(
color: Colors.black,
child: Stack(
children: [
Center(
child: Mjpeg(
stream: streamUrl,
isLive: true,
fit: BoxFit.contain,
error: (context, error, stackTrace) {
return _buildErrorWidget(cameraIndex);
},
),
),
// Back indicator overlay
Positioned(
bottom: 16,
left: 0,
right: 0,
child: Center(
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
decoration: BoxDecoration(
color: Colors.black.withValues(alpha: 0.6),
borderRadius: BorderRadius.circular(20),
),
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
const Icon(Icons.touch_app, color: Colors.white, size: 16),
const SizedBox(width: 8),
Text(
_t('Tap to return to grid'),
style:
const TextStyle(color: Colors.white, fontSize: 14),
),
],
),
),
),
),
// Camera label
Positioned(
top: 16,
left: 16,
child: Container(
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
decoration: BoxDecoration(
color: Colors.black.withValues(alpha: 0.6),
borderRadius: BorderRadius.circular(6),
),
child: Text(
"${_t('Camera')} $cameraIndex",
style: const TextStyle(
color: Colors.white,
fontSize: 16,
fontWeight: FontWeight.w600,
),
),
),
),
],
),
),
);
}
Widget _buildErrorWidget(int cameraIndex) {
return Container(
color: Colors.black,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Icons.videocam_off, color: Colors.red, size: 32),
const SizedBox(height: 4),
Flexible(
child: Text(
"${_t('Camera')} $cameraIndex\n${_t('Stream unavailable')}",
style: const TextStyle(
color: Colors.white70,
fontSize: 11,
),
textAlign: TextAlign.center,
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
),
],
),
);
}
}