From 5fd68d489d778d2bf40c2db60f5293edf72101c7 Mon Sep 17 00:00:00 2001
From: Christian Pauly <christian-pauly@posteo.de>
Date: Sat, 1 Jan 2022 16:23:17 +0100
Subject: [PATCH] chore: Waveform follow up

---
 lib/pages/chat/events/audio_player.dart | 10 +++++-
 lib/pages/chat/recording_dialog.dart    | 42 +++++++++++++------------
 2 files changed, 31 insertions(+), 21 deletions(-)

diff --git a/lib/pages/chat/events/audio_player.dart b/lib/pages/chat/events/audio_player.dart
index 2c116764..3df47d72 100644
--- a/lib/pages/chat/events/audio_player.dart
+++ b/lib/pages/chat/events/audio_player.dart
@@ -142,7 +142,7 @@ class _AudioPlayerState extends State<AudioPlayerWidget> {
     return '${duration.inMinutes.toString().padLeft(2, '0')}:${(duration.inSeconds % 60).toString().padLeft(2, '0')}';
   }
 
-  List<int> get waveform {
+  List<int> _getWaveform() {
     final eventWaveForm = widget.event.content
         .tryGetMap<String, dynamic>('org.matrix.msc1767.audio')
         ?.tryGetList<int>('waveform');
@@ -163,6 +163,14 @@ class _AudioPlayerState extends State<AudioPlayerWidget> {
     return eventWaveForm;
   }
 
+  late final List<int> waveform;
+
+  @override
+  void initState() {
+    super.initState();
+    waveform = _getWaveform();
+  }
+
   @override
   Widget build(BuildContext context) {
     final statusText = this.statusText ??= _durationString ?? '00:00';
diff --git a/lib/pages/chat/recording_dialog.dart b/lib/pages/chat/recording_dialog.dart
index 5be96fbb..10965e1c 100644
--- a/lib/pages/chat/recording_dialog.dart
+++ b/lib/pages/chat/recording_dialog.dart
@@ -125,28 +125,30 @@ class _RecordingDialogState extends State<RecordingDialog> {
                 ),
               ),
               Expanded(
-                child: Center(
-                  child: Row(
-                    mainAxisSize: MainAxisSize.min,
-                    mainAxisAlignment: MainAxisAlignment.end,
-                    children: amplitudeTimeline.reversed
-                        .take(26)
-                        .toList()
-                        .reversed
-                        .map((amplitude) => Container(
-                            margin: const EdgeInsets.only(left: 2),
-                            width: 4,
-                            decoration: BoxDecoration(
-                              color: Theme.of(context).colorScheme.primary,
-                              borderRadius:
-                                  BorderRadius.circular(AppConfig.borderRadius),
-                            ),
-                            height: maxDecibalWidth * (amplitude / 100)))
-                        .toList(),
-                  ),
+                child: Row(
+                  mainAxisSize: MainAxisSize.min,
+                  mainAxisAlignment: MainAxisAlignment.end,
+                  children: amplitudeTimeline.reversed
+                      .take(26)
+                      .toList()
+                      .reversed
+                      .map((amplitude) => Container(
+                          margin: const EdgeInsets.only(left: 2),
+                          width: 4,
+                          decoration: BoxDecoration(
+                            color: Theme.of(context).colorScheme.primary,
+                            borderRadius:
+                                BorderRadius.circular(AppConfig.borderRadius),
+                          ),
+                          height: maxDecibalWidth * (amplitude / 100)))
+                      .toList(),
                 ),
               ),
-              Text(time),
+              const SizedBox(width: 8),
+              SizedBox(
+                width: 48,
+                child: Text(time),
+              ),
             ],
           );
     if (PlatformInfos.isCupertinoStyle) {