Niklas
/
Prototype_Learn
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Waiting time for the upload is now displayed as a circular moving circle

This commit is contained in:
Niklas 2024-11-29 18:26:31 +01:00
parent 72e42a1f47
commit 79378be1f8
1 changed files with 169 additions and 140 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

309
lib/screens/missing_event.dart
View File

@ -20,6 +20,7 @@ class MissingEvent extends StatefulWidget {
}
class _MissingEvent extends State<MissingEvent> {
bool isUploading = false;
@override
Widget build(BuildContext context) {
var size = MediaQuery.of(context).size;
@ -74,6 +75,7 @@ class _MissingEvent extends State<MissingEvent> {
setState(() {
imageFile = File(image.path);
isloaded = true;
isUploading = true;
setState(() {});
});
// Use the image file
@ -92,7 +94,9 @@ class _MissingEvent extends State<MissingEvent> {
fileName,
fileBytes,
);
setState(() {});
setState(() {
isUploading = false;
});
} catch (e) {
print(e);
ScaffoldMessenger.of(context).showSnackBar(
@ -115,6 +119,9 @@ class _MissingEvent extends State<MissingEvent> {
);
if (image != null) {
setState(() {
isUploading = true;
});
final String imagePath = image.path;
try {
final fileBytes = await image.readAsBytes();
@ -123,7 +130,9 @@ class _MissingEvent extends State<MissingEvent> {
fileName,
fileBytes,
);
setState(() {});
setState(() {
isUploading = false;
});
} catch (e) {
print(e);
ScaffoldMessenger.of(context).showSnackBar(
@ -205,90 +214,91 @@ class _MissingEvent extends State<MissingEvent> {
),
flexibleSpace: Container(),
);
var body = Container(
padding: EdgeInsets.all(22.0),
width: double.infinity,
//height: 952,
//clipBehavior: Clip.antiAlias,
child: Column(
children: [
const SizedBox(height: 10),
Align(
alignment: Alignment.centerLeft,
child: Text(
'Fehlendes Event bei uns?',
style: TextStyle(
color: Colors.black,
fontSize: 24,
fontFamily: 'Inter',
fontWeight: FontWeight.w800,
height: 0,
),
),
),
const SizedBox(height: 10),
Align(
alignment: Alignment.centerLeft,
child: SizedBox(
width: double.infinity,
height: 144,
child: RichText(
text: TextSpan(
text:
'Du hast unterwegs ein Event gesehen, welches noch nicht bei uns in der Liste steht? Schicke uns das Foto von dem Event zu. Wir werden diese, wenn nicht schon geschehen den Events hinzufügen. Danke für deine Unterstützung!',
style: TextStyle(
color: Colors.black,
fontSize: 16,
fontFamily: 'Inter',
fontWeight: FontWeight.w400,
height: 1.5, // Ein vernünftigerer Zeilenabstand
),
var body = Stack(children: [
Container(
padding: EdgeInsets.all(22.0),
width: double.infinity,
//height: 952,
//clipBehavior: Clip.antiAlias,
child: Column(
children: [
const SizedBox(height: 10),
Align(
alignment: Alignment.centerLeft,
child: Text(
'Fehlendes Event bei uns?',
style: TextStyle(
color: Colors.black,
fontSize: 24,
fontFamily: 'Inter',
fontWeight: FontWeight.w800,
height: 0,
),
),
),
),
const SizedBox(height: 10),
Container(
width: 300,
height: 200,
padding: const EdgeInsets.symmetric(horizontal: 70, vertical: 85),
decoration: ShapeDecoration(
color: Color(0xFFEDEDED),
shape: RoundedRectangleBorder(
side: BorderSide(
width: 1,
strokeAlign: BorderSide.strokeAlignOutside,
),
borderRadius: BorderRadius.circular(10),
),
),
child: SizedBox(
width: 200, // Breite des Buttons
height: 50,
child: OutlinedButton.icon(
icon: const Icon(
Icons.image,
size: 10,
),
onPressed: () {
pickImage();
},
style: ButtonStyle(
side: WidgetStateProperty.all(
const BorderSide(
color: Colors.red,
width: 1,
const SizedBox(height: 10),
Align(
alignment: Alignment.centerLeft,
child: SizedBox(
width: double.infinity,
height: 144,
child: RichText(
text: TextSpan(
text:
'Du hast unterwegs ein Event gesehen, welches noch nicht bei uns in der Liste steht? Schicke uns das Foto von dem Event zu. Wir werden diese, wenn nicht schon geschehen den Events hinzufügen. Danke für deine Unterstützung!',
style: TextStyle(
color: Colors.black,
fontSize: 16,
fontFamily: 'Inter',
fontWeight: FontWeight.w400,
height: 1.5, // Ein vernünftigerer Zeilenabstand
),
),
),
label: const Text(
'Bild hochladen',
),
),
const SizedBox(height: 10),
Container(
width: 300,
height: 200,
padding: const EdgeInsets.symmetric(horizontal: 70, vertical: 85),
decoration: ShapeDecoration(
color: Color(0xFFEDEDED),
shape: RoundedRectangleBorder(
side: BorderSide(
width: 1,
strokeAlign: BorderSide.strokeAlignOutside,
),
borderRadius: BorderRadius.circular(10),
),
),
child: SizedBox(
width: 200, // Breite des Buttons
height: 50,
child: OutlinedButton.icon(
icon: const Icon(
Icons.image,
size: 10,
),
onPressed: () {
pickImage();
},
style: ButtonStyle(
side: WidgetStateProperty.all(
const BorderSide(
color: Colors.red,
width: 1,
),
),
),
label: const Text(
'Bild hochladen',
),
),
),
),
),
/* Padding(
/* Padding(
padding: const EdgeInsets.all(8.0),
child: !isloaded
? Image.network(
@ -298,68 +308,68 @@ class _MissingEvent extends State<MissingEvent> {
fit: BoxFit.contain,
)
: Image.file(imageFile)), */
const SizedBox(height: 10),
Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
child: Text(
'Bild aufnehmen',
style: TextStyle(
color: Colors.black,
fontSize: 18,
fontFamily: 'Inter',
fontWeight: FontWeight.w500,
height: 0,
),
),
),
SizedBox(
width: 10,
),
Container(
width: 85,
height: 37,
padding:
const EdgeInsets.symmetric(horizontal: 15, vertical: 5),
clipBehavior: Clip.antiAlias,
decoration: ShapeDecoration(
shape: RoundedRectangleBorder(
side: BorderSide(width: 2),
borderRadius: BorderRadius.circular(10),
),
),
child: Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
width: 23,
height: 20.70,
child: IconButton(
icon: FaIcon(FontAwesomeIcons.camera, size: 20),
onPressed: () {
// Füge hier die YouTube-Aktion hinzu
captureImage();
},
padding: EdgeInsets
.zero, // Entfernt das Padding des IconButton
constraints:
BoxConstraints(), // Entfernt die Standardbeschränkungen
),
const SizedBox(height: 10),
Row(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.end,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
child: Text(
'Bild aufnehmen',
style: TextStyle(
color: Colors.black,
fontSize: 18,
fontFamily: 'Inter',
fontWeight: FontWeight.w500,
height: 0,
),
],
),
),
),
],
),
const SizedBox(height: 10),
Row(
children: [
/* Container(
SizedBox(
width: 10,
),
Container(
width: 85,
height: 37,
padding:
const EdgeInsets.symmetric(horizontal: 15, vertical: 5),
clipBehavior: Clip.antiAlias,
decoration: ShapeDecoration(
shape: RoundedRectangleBorder(
side: BorderSide(width: 2),
borderRadius: BorderRadius.circular(10),
),
),
child: Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.center,
children: [
Container(
width: 23,
height: 20.70,
child: IconButton(
icon: FaIcon(FontAwesomeIcons.camera, size: 20),
onPressed: () {
// Füge hier die YouTube-Aktion hinzu
captureImage();
},
padding: EdgeInsets
.zero, // Entfernt das Padding des IconButton
constraints:
BoxConstraints(), // Entfernt die Standardbeschränkungen
),
),
],
),
),
],
),
const SizedBox(height: 10),
Row(
children: [
/* Container(
width: 160,
height: 44,
padding: const EdgeInsets.all(10),
@ -418,8 +428,8 @@ class _MissingEvent extends State<MissingEvent> {
],
),
),*/
],
),
],
),
/* const SizedBox(height: 10),
Text(
'Bock dein Event bei uns zu \npräsentieren? ',
@ -463,9 +473,28 @@ class _MissingEvent extends State<MissingEvent> {
),
),
), */
],
],
),
),
);
// AnimatedOpacity für das Overlay
AnimatedOpacity(
opacity: isUploading ? 1.0 : 0.0, // Sichtbarkeit steuern
duration: Duration(milliseconds: 300), // Dauer der Animation
curve: Curves.easeInOut, // Animationskurve
child: isUploading
? Container(
width: MediaQuery.of(context).size.width, // Volle Breite
height: MediaQuery.of(context).size.height, // Volle Höhe
color: Colors.black.withOpacity(0.5), // Halbtransparentes Grau
child: Center(
child: CircularProgressIndicator(
color: Colors.white,
),
),
)
: SizedBox.shrink(), // Nichts anzeigen, wenn nicht sichtbar
),
]);
return Scaffold(
backgroundColor: Colors.white,