You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Android can let app draw behind the navigation pill. The small indicator at the bottom of the screen if you use gesture based navigation.
Most apps use this space either as additional screen space, drawing their app contents behind it as well, causing a scrolling list for instance to draw from the edge of your screen. Some also just put a placeholder there in a fitting color. Finamp currently does neither. Leaving the space black. Also there's rumors that the EdgeToEdge mode will be forced by Android in Android 15.
Note the black bar at the bottom:
Album view
Player screen
Song detail bottom sheet
Possible solutions
In Flutter this can be changed with SystemChrome similar to how Findroid already fixes the status bar on iOS by making the space transparent. This causes the SafeArea from Scaffold to be visible, creating a more coherent(imo) appearance.
I am not entirely sure if these system chrome changes stick around during the entire app lifetime. So there might be a need for supplying a WidgetsBindingObserver. I use these solutions in conjunction in my private projects without issues(though I only have an Android phone):
import'package:flutter/material.dart';
import'package:flutter/services.dart';
/// Class to set the system UI overlay style to edge to edge.classUIOverlaySetterObserverextendsWidgetsBindingObserver {
@overridevoiddidChangeAppLifecycleState(AppLifecycleState state) async {
switch (state) {
caseAppLifecycleState.resumed:SystemChrome.setSystemUIOverlayStyle(
constSystemUiOverlayStyle(
systemNavigationBarColor:Colors.transparent,
),
);
awaitSystemChrome.setEnabledSystemUIMode(SystemUiMode.edgeToEdge);
break;
default:break;
}
}
}
which would be used in main.dart
final binding =WidgetsFlutterBinding.ensureInitialized();
binding.addObserver(UIOverlaySetterObserver());
The text was updated successfully, but these errors were encountered:
I would like to make PR but right now my Flutter installation is FUBAR and my internet too slow to reinstall the entire toolchain. So that would have to wait a bit
Android can let app draw behind the navigation pill. The small indicator at the bottom of the screen if you use gesture based navigation.
Most apps use this space either as additional screen space, drawing their app contents behind it as well, causing a scrolling list for instance to draw from the edge of your screen. Some also just put a placeholder there in a fitting color. Finamp currently does neither. Leaving the space black. Also there's rumors that the EdgeToEdge mode will be forced by Android in Android 15.
Note the black bar at the bottom:
Possible solutions
In Flutter this can be changed with
SystemChrome
similar to how Findroid already fixes the status bar on iOS by making the space transparent. This causes theSafeArea
fromScaffold
to be visible, creating a more coherent(imo) appearance.I am not entirely sure if these system chrome changes stick around during the entire app lifetime. So there might be a need for supplying a
WidgetsBindingObserver
. I use these solutions in conjunction in my private projects without issues(though I only have an Android phone):which would be used in main.dart
The text was updated successfully, but these errors were encountered: