Die untere Navigationsleiste überlappt den Bildschirminhalt in Jetpack Compose
Lesezeit: 2 Minuten
Gianluca Veschi
Ich habe ein BottomNavBar die innerhalb der aufgerufen wird bottomBar von a Scaffold.
Jeder Bildschirm enthält eine LazyColumn die eine Reihe von Bildern anzeigt.
Aus irgendeinem Grund, wenn ich mit dem Scrollen fertig bin, die BottomNavBar überlappt den unteren Teil der Artikelliste.
Wie kann ich das beheben?
Gemäß der API-Definition für Scaffolddein innerer Inhalt (das nachlaufende Lambda, das du hast BottomNavScreensController in), ist gegeben a PaddingValues Objekt, das Ihnen die richtige Menge an Polsterung für Ihre obere App-Leiste, untere Leiste usw. gibt.
Im Moment beziehen Sie sich überhaupt nicht auf diese Polsterung und daher auf Ihren Inhalt nicht aufgefüllt. Dies verursacht Ihre Überlappung.
Sie können eine hinzufügen Box um deine BottomNavScreensController um die Polsterung anzubringen, oder führen Sie die Polsterung direkt in Ihren Körper BottomNavScreensController damit jeder einzelne Bildschirm die Polsterung korrekt aufbringen kann; beide Lösungen funktionieren.
In der neuesten Version hat dies für mich funktioniert: innerPadding.calculateBottomPadding()
– Jerry Okafor
26. Juni 2021 um 8:41 Uhr
@ianhanniballake Ich habe vergessen, wie oft mir deine Antworten geholfen haben
– Vahid
14. August 2021 um 10:49 Uhr
zuvor haben wir die fest codierten Werte eingefügt, z. B.: 76.dpaber damit müssen Sie nicht jedes andere Element manuell berechnen, das verwendet wird Scaffold mehr. Vielen Dank!
– mochadwi
6. September 2021 um 0:13 Uhr
Folgen Sie der Antwort von ianhanniballake und seinen Kommentaren, um Ihnen nur ein paar Minuten zu sparen. Der Code wäre ungefähr so: