Update position in relatime of map in flutter - google-maps

Question

Hello the code below displays a map with the user's position using the google_maps_flutter and location package, the code below correctly displays the map with the initial position of latitude and longitude but when the user starts the app from the device the position does not it becomes the actual one of the user but remains on the initial position, how do I solve this?
Flutter Code:
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:location/location.dart';
import 'package:MyApp/View/Cantieri/mediterranesn_diet_view.dart'
show MediterranesnDietView;
import 'package:MyApp/View/Cantieri/title_view.dart' show TitleView;
import 'package:MyApp/View/Home_theme.dart';
import 'package:MyApp/View/MarcaTempo/FunzioneMarcatempoView.dart'
show MarcaTempoListView;
//Valori longitudine e latitudine
double longitudine = 12.4818, latitudine = 41.9109;
LatLng _center = LatLng(latitudine, longitudine);
//Recupero e salvataggio dei valori del gps di longitudine e latitudine
Future<void> _getGpsValue() async {
//Instanzio l'oggetto che si occupa di recuperare i dati per la marcatura
var location = new Location();
location.onLocationChanged().listen((LocationData currentLocation) async {
longitudine = currentLocation.longitude;
latitudine = currentLocation.latitude;
_center = LatLng(latitudine, longitudine);
});
Timer(Duration(seconds: 1), () {
print("E' passato 1 secondo");
print("Latitudine: " +
latitudine.toString() +
"\n Longitudine: " +
longitudine.toString());
});
}
class MyDiaryScreen extends StatefulWidget {
const MyDiaryScreen({Key key, this.animationController}) : super(key: key);
final AnimationController animationController;
#override
_MyDiaryScreenState createState() => _MyDiaryScreenState();
}
class _MyDiaryScreenState extends State<MyDiaryScreen>
with TickerProviderStateMixin {
GoogleMapController mapController;
var width;
void _onMapCreated(GoogleMapController controller) {
mapController = controller;
}
List<Widget> listViews = <Widget>[];
final ScrollController scrollController = ScrollController();
Animation<double> topBarAnimation;
double topBarOpacity = 0.0;
#override
void initState() {
_getGpsValue();
topBarAnimation = Tween<double>(begin: 0.0, end: 1.0).animate(
CurvedAnimation(
parent: widget.animationController,
curve: Interval(0, 0.5, curve: Curves.fastOutSlowIn)));
addAllListData();
scrollController.addListener(() {
if (scrollController.offset >= 24) {
if (topBarOpacity != 1.0) {
setState(() {
topBarOpacity = 1.0;
});
}
} else if (scrollController.offset <= 24 &&
scrollController.offset >= 0) {
if (topBarOpacity != scrollController.offset / 24) {
setState(() {
topBarOpacity = scrollController.offset / 24;
});
}
} else if (scrollController.offset <= 0) {
if (topBarOpacity != 0.0) {
setState(() {
topBarOpacity = 0.0;
});
}
}
});
super.initState();
}
void addAllListData() {
_getGpsValue();
const int count = 9;
//Prima view che comprende il titolo della Posizione
listViews.add(
TitleView(
titleTxt: 'Posizione',
subTxt: '',
animation: Tween<double>(begin: 0.0, end: 1.0).animate(CurvedAnimation(
parent: widget.animationController,
curve:
Interval((1 / count) * 0, 1.0, curve: Curves.fastOutSlowIn))),
animationController: widget.animationController,
),
);
//Inserimento del modulo con le informazioni sulla posizione
listViews.add(
MediterranesnDietView(
animation: Tween<double>(begin: 0.0, end: 1.0).animate(CurvedAnimation(
parent: widget.animationController,
curve:
Interval((1 / count) * 1, 1.0, curve: Curves.fastOutSlowIn))),
animationController: widget.animationController,
),
);
//Inserimento del titolo di registrazione
listViews.add(
TitleView(
titleTxt: 'Registrazione',
subTxt: '',
animation: Tween<double>(begin: 0.0, end: 1.0).animate(CurvedAnimation(
parent: widget.animationController,
curve:
Interval((1 / count) * 2, 1.0, curve: Curves.fastOutSlowIn))),
animationController: widget.animationController,
),
);
//Inserimento dei button per il marcatempo
listViews.add(
MarcaTempoListView(
mainScreenAnimation: Tween<double>(begin: 0.0, end: 1.0).animate(
CurvedAnimation(
parent: widget.animationController,
curve: Interval((1 / count) * 3, 1.0,
curve: Curves.fastOutSlowIn))),
mainScreenAnimationController: widget.animationController,
),
);
//Inserimento del titolo di registrazione
listViews.add(
TitleView(
titleTxt: 'Mappa',
subTxt: '',
animation: Tween<double>(begin: 0.0, end: 1.0).animate(CurvedAnimation(
parent: widget.animationController,
curve:
Interval((1 / count) * 2, 1.0, curve: Curves.fastOutSlowIn))),
animationController: widget.animationController,
),
);
listViews.add(new Container(
width: width,
height: 400.0,
child: GoogleMap(
onMapCreated: _onMapCreated,
initialCameraPosition: CameraPosition(
target: _center,
zoom: 6.0,
))));
}
Future<bool> getData(BuildContext context) async {
await Future<dynamic>.delayed(const Duration(milliseconds: 50));
width = MediaQuery.of(context).size.width;
return true;
}
Widget getMainListViewUI() {
return FutureBuilder<bool>(
future: getData(context),
builder: (BuildContext context, AsyncSnapshot<bool> snapshot) {
if (!snapshot.hasData) {
return const SizedBox();
} else {
return ListView.builder(
shrinkWrap: true,
controller: scrollController,
padding: EdgeInsets.only(
top: AppBar().preferredSize.height +
MediaQuery.of(context).padding.top +
24,
bottom: 62 + MediaQuery.of(context).padding.bottom,
),
itemCount: listViews.length,
scrollDirection: Axis.vertical,
itemBuilder: (BuildContext context, int index) {
widget.animationController.forward();
return listViews[index];
},
);
}
},
);
}
//Recupero della barra per la UI
Widget getAppBarUI() {
return Column(
children: <Widget>[
AnimatedBuilder(
animation: widget.animationController,
builder: (BuildContext context, Widget child) {
return FadeTransition(
opacity: topBarAnimation,
child: Transform(
transform: Matrix4.translationValues(
0.0, 30 * (1.0 - topBarAnimation.value), 0.0),
child: Container(
decoration: BoxDecoration(
color: TemaApp.white.withOpacity(topBarOpacity),
borderRadius: const BorderRadius.only(
bottomLeft: Radius.circular(32.0),
),
boxShadow: <BoxShadow>[
BoxShadow(
color: TemaApp.grey.withOpacity(0.4 * topBarOpacity),
offset: const Offset(1.1, 1.1),
blurRadius: 10.0),
],
),
child: Column(
children: <Widget>[
SizedBox(
height: MediaQuery.of(context).padding.top,
),
Padding(
padding: EdgeInsets.only(
left: 16,
right: 16,
top: 16 - 8.0 * topBarOpacity,
bottom: 12 - 8.0 * topBarOpacity),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Expanded(
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Text(
'Marcatempo',
textAlign: TextAlign.left,
style: TextStyle(
fontFamily: TemaApp.fontName,
fontWeight: FontWeight.w700,
fontSize: 22 + 6 - 6 * topBarOpacity,
letterSpacing: 1.2,
color: TemaApp.darkerText,
),
),
),
),
],
),
)
],
),
),
),
);
},
)
],
);
}
#override
Widget build(BuildContext context) {
return Container(
color: TemaApp.background,
child: Scaffold(
backgroundColor: Colors.transparent,
resizeToAvoidBottomPadding: true,
body: Stack(
children: <Widget>[
//getMap(),
getMainListViewUI(),
getAppBarUI(),
SizedBox(
height: MediaQuery.of(context).padding.bottom,
)
],
),
),
);
}
}

Answer 1

You need to call setState() inside the _getGpsValue() to update the user's location.
setState(() {
longitudine = currentLocation.longitude;
latitudine = currentLocation.latitude;
_center = LatLng(latitudine, longitudine);
})
As per the documentation:
Calling setState notifies the framework that the internal state of
this object has changed in a way that might impact the user interface
in this subtree, which causes the framework to schedule a build for
this State object.