Widget inside the Panel is not centred when there is an AppBar in widget tree

When AppBar with extendBodyBehindAppBar=false is added to the example app, then the map moves lower and is not centred correctly (see attached screenshots) - it can be seen by the marker in the center of the map.

Is this a bug or am I missing something? I don't want the map to be behind the AppBar and I want it to be in the center of body at the same time.

Here is the modified code of the original example:

// @dart=2.9

/ Name: Akshath Jain Date: 3/18/2019 - 4/26/2021 Purpose: Example app that implements the package: sliding_up_panel Copyright: © 2021, Akshath Jain. All rights reserved. Licensing: More information can be found here: https://github.com/akshathjain/sliding_up_panel/blob/master/LICENSE /

import 'dart:ui';

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

import 'package:flutter_map/flutter_map.dart'; import 'package:latlong/latlong.dart'; import 'package:cached_network_image/cached_network_image.dart';

void main() => runApp(SlidingUpPanelExample());

class SlidingUpPanelExample extends StatelessWidget { @override Widget build(BuildContext context) { SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle( systemNavigationBarColor: Colors.grey[200], systemNavigationBarIconBrightness: Brightness.dark, systemNavigationBarDividerColor: Colors.black, ));

return MaterialApp(
  debugShowCheckedModeBanner: false,
  title: 'SlidingUpPanel Example',
  theme: ThemeData(
    primarySwatch: Colors.blue,
  ),
  home: HomePage(),
);

} }

class HomePage extends StatefulWidget { @override _HomePageState createState() => _HomePageState(); }

class _HomePageState extends State {

final double _initFabHeight = 120.0; double _fabHeight = 0; double _panelHeightOpen = 0; double _panelHeightClosed = 95.0;

@override void initState() { super.initState();

_fabHeight = _initFabHeight;

}

@override Widget build(BuildContext context) { _panelHeightOpen = MediaQuery.of(context).size.height * .80;

return Scaffold(
  extendBodyBehindAppBar: true,
  extendBody: false,
  backgroundColor: Colors.white,
  appBar: AppBar(
    title: Text("AppBar"),
    backgroundColor: Colors.white54,
  ),
  body: _map(),
);

}

Widget _panel(ScrollController sc) { return MediaQuery.removePadding( context: context, removeTop: true, child: ListView( controller: sc, children: [ SizedBox( height: 12.0, ), Row( mainAxisAlignment: MainAxisAlignment.center, children: [ Container( width: 30, height: 5, decoration: BoxDecoration( color: Colors.grey[300], borderRadius: BorderRadius.all(Radius.circular(12.0))), ), ], ), SizedBox( height: 18.0, ), Row( mainAxisAlignment: MainAxisAlignment.center, children: [ Text( "Explore Pittsburgh", style: TextStyle( fontWeight: FontWeight.normal, fontSize: 24.0, ), ), ], ), SizedBox( height: 36.0, ), Row( mainAxisAlignment: MainAxisAlignment.spaceEvenly, children: [ _button("Popular", Icons.favorite, Colors.blue), _button("Food", Icons.restaurant, Colors.red), _button("Events", Icons.event, Colors.amber), _button("More", Icons.more_horiz, Colors.green), ], ), SizedBox( height: 36.0, ), Container( padding: const EdgeInsets.only(left: 24.0, right: 24.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text("Images", style: TextStyle( fontWeight: FontWeight.w600, )), SizedBox( height: 12.0, ), Row( mainAxisAlignment: MainAxisAlignment.spaceBetween, children: [ CachedNetworkImage( imageUrl: "https://images.fineartamerica.com/images-medium-large-5/new-pittsburgh-emmanuel-panagiotakis.jpg", height: 120.0, width: (MediaQuery.of(context).size.width - 48) / 2 - 2, fit: BoxFit.cover, ), CachedNetworkImage( imageUrl: "https://cdn.pixabay.com/photo/2016/08/11/23/48/pnc-park-1587285_1280.jpg", width: (MediaQuery.of(context).size.width - 48) / 2 - 2, height: 120.0, fit: BoxFit.cover, ), ], ), ], ), ), SizedBox( height: 36.0, ), Container( padding: const EdgeInsets.only(left: 24.0, right: 24.0), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text("About", style: TextStyle( fontWeight: FontWeight.w600, )), SizedBox( height: 12.0, ), Text( "Pittsburgh is a city in the state of Pennsylvania in the United States...", softWrap: true, ), ], ), ), SizedBox( height: 24, ), ], )); }

Widget _button(String label, IconData icon, Color color) { return Column( children: [ Container( padding: const EdgeInsets.all(16.0), child: Icon( icon, color: Colors.white, ), decoration: BoxDecoration(color: color, shape: BoxShape.circle, boxShadow: [ BoxShadow( color: Color.fromRGBO(0, 0, 0, 0.15), blurRadius: 8.0, ) ]), ), SizedBox( height: 12.0, ), Text(label), ], ); }

Widget _body() { return FlutterMap( options: MapOptions( center: LatLng(40.441589, -80.010948), zoom: 13, maxZoom: 15, ), layers: [ TileLayerOptions( urlTemplate: "https://maps.wikimedia.org/osm-intl/{z}/{x}/{y}.png"), MarkerLayerOptions(markers: [ Marker( point: LatLng(40.441753, -80.011476), builder: (ctx) => Icon( Icons.location_on, color: Colors.blue, size: 48.0, ), height: 60), ]), ], ); }

Widget _map() { return Material( child: Stack( alignment: Alignment.topCenter, children: [ SlidingUpPanel( maxHeight: _panelHeightOpen, minHeight: _panelHeightClosed, parallaxEnabled: true, parallaxOffset: .5, body: _body(), panelBuilder: (sc) => _panel(sc), borderRadius: BorderRadius.only( topLeft: Radius.circular(18.0), topRight: Radius.circular(18.0)), onPanelSlide: (double pos) => setState(() { _fabHeight = pos * (_panelHeightOpen - _panelHeightClosed) + _initFabHeight; }), ), Positioned( right: 20.0, bottom: _fabHeight, child: FloatingActionButton( child: Icon( Icons.gps_fixed, color: Theme.of(context).primaryColor, ), onPressed: () {}, backgroundColor: Colors.white, ), ), ], ), ); } }

akshathjain / sliding_up_panel

Widget inside the Panel is not centred when there is an AppBar in widget tree #258