fix: safe area bottom spacing for buttons above Android nav bar

src/screens/DashboardScreen.tsx

@@ -1,6 +1,7 @@
 import React, { useCallback, useState } from 'react'
 import { View, ScrollView, TouchableOpacity, Text, StyleSheet } from 'react-native'
 import { useFocusEffect } from '@react-navigation/native'
+import { useSafeAreaInsets } from 'react-native-safe-area-context'
 import { initDatabase, getAllMeasurements, getLatestMeasurement } from '../database/db'
 import { Measurement } from '../types'
 import LatestMeasurementCard from '../components/LatestMeasurementCard'
@@ -9,6 +10,7 @@ import WeightChart from '../components/WeightChart'
 type Props = { navigation: any }
 
 export default function DashboardScreen({ navigation }: Props) {
+  const insets = useSafeAreaInsets()
   const [latest, setLatest] = useState<Measurement | null>(null)
   const [all, setAll] = useState<Measurement[]>([])
 
@@ -38,11 +40,14 @@ export default function DashboardScreen({ navigation }: Props) {
       <ScrollView style={styles.container}>
         <LatestMeasurementCard measurement={latest} />
         <WeightChart measurements={all} />
-
-        <TouchableOpacity style={styles.fab} onPress={() => navigation.navigate('NewMeasurement')}>
-          <Text style={styles.fabText}>+ Nieuwe meting</Text>
-        </TouchableOpacity>
       </ScrollView>
+
+      <TouchableOpacity
+        style={[styles.fab, { marginBottom: insets.bottom + 16 }]}
+        onPress={() => navigation.navigate('NewMeasurement')}
+      >
+        <Text style={styles.fabText}>+ Nieuwe meting</Text>
+      </TouchableOpacity>
     </View>
   )
 }