akshathjain / sliding_up_panel

A draggable Flutter widget that makes implementing a SlidingUpPanel much easier!
https://pub.dartlang.org/packages/sliding_up_panel
Other
1.36k stars 379 forks source link

Body offsets down for the AppBar's height #248

Closed cream-cheeze closed 3 years ago

cream-cheeze commented 3 years ago

Describe the bug

When I use the panel with Scaffold and AppBar the panel's body position offsets down for the AppBar's height and it goes beyond the boundaries of the screen. If I set extendBodyBehindAppBar= true body position looks OK, but in this case an extra space appears at the top of the panel.

To Reproduce

See the code sample below.

The result with extendBodyBehindAppBar: false and extendBodyBehindAppBar: true is shown on the screenshots.

Expected behavior

The panel's content is placed in the area between AppBar and bottom of the screen and does not go beyond.

Screenshots

Simulator Screen Shot - iPhone 12 mini - 2021-05-05 at 20 29 34

Simulator Screen Shot - iPhone 12 mini - 2021-05-05 at 20 29 47

Additional context Add any other context about the problem here.

Smartphone (please complete the following information):

Sample main.dart

This is my code:

`

import 'package:flutter/material.dart'; import 'package:sliding_up_panel/sliding_up_panel.dart';

void main() { runApp(MyApp()); }

class MyApp extends StatefulWidget { @override _MyAppState createState() => _MyAppState(); }

class _MyAppState extends State {

PanelController _pc = new PanelController();

@override Widget build(BuildContext context) { return MaterialApp( title: 'Работа рядом', theme: ThemeData( primaryColor: Color(0xFFF5F5F5), appBarTheme: AppBarTheme( elevation: 0, ) ), home: Scaffold( extendBodyBehindAppBar: true, backgroundColor: Colors.white, appBar: AppBar( title: Text("Test"), ), body: SlidingUpPanel( minHeight: 200, maxHeight: 200, defaultPanelState: PanelState.OPEN, controller: _pc, panelBuilder: (ScrollController sc) => _scrollingList(sc), body: Center(child: Text("Center")), ) ) ); }

Widget _scrollingList(ScrollController sc) { return Container( padding: const EdgeInsets.only( left: 0.0, top: 30.0, right: 0.0, bottom: 0.0), margin: const EdgeInsets.all(0.0), child: ListView.builder( controller: sc, itemCount: 50, itemBuilder: (BuildContext context, int i) { return Container( padding: const EdgeInsets.all(16.0), child: Text("$i"), ); }, ), ); }

} `

cream-cheeze commented 3 years ago

Solved myself by adding padding: const EdgeInsets.only(left: 0.0, top: 0.0, right: 0.0, bottom: 0.0) to the ListView.builder.