i cant change a text value when using dropdown menu - flutter - flutter

Question

i'm pretty much new at flutter , and recently i started to work with PopupMenuButton which i'm using to allow the user to select which language they wish to use and then renders the selected language in a container (using it as it to make it look like a textfield dropdown menu) ,
so basically when the user selects the language the selectedlanguage value actually do change and the app's language also changes but the text inside the container never changes
import 'package:Terzi/main.dart';
import 'package:flutter/material.dart';
class Testable extends StatefulWidget {
#override
_TestableState createState() => _TestableState();
}
class _TestableState extends State<Testable> {
#override
Widget build(BuildContext context) {
final TextEditingController _controller = new TextEditingController();
var languages = ['English','اللغة العربية','Türkçe'];
String slectedLanguage="English";
return new Scaffold(
body: new Center(
child: new Container(
child: new Column(
children: [
new Padding(
padding: const EdgeInsets.all(24.0),
child: new Row(
children: <Widget>[
new Expanded(
child: Container(
decoration: BoxDecoration(
color: Colors.blue
),
height: 65, width: double.infinity,
alignment: Alignment.center,
child: Text(slectedLanguage,style: TextStyle(color: Colors.white,fontSize: 16),),
),
),
new PopupMenuButton<String>(
icon: const Icon(Icons.arrow_drop_down),
onSelected: (String value) {
setState(() {
slectedLanguage= value;
switch( slectedLanguage)
{
case "English" :
MyApp.setLocale(context, Locale('en','US'));
break;
case "اللغة العربية" :
MyApp.setLocale(context, Locale('ar','SA'));
break;
case "Türkçe" :
MyApp.setLocale(context, Locale('tr','TR'));
break;
}
print(slectedLanguage);
});
},
itemBuilder: (BuildContext context) {
return languages.map<PopupMenuItem<String>>((String value) {
return new PopupMenuItem(child: new Text(value), value: value);
}).toList();
},
),
],
),
),
],
),
),
),
);
}
}

Answer 1

Your selectedLanguage will always be 'English' because it is a local variable initialized at the beginning of your build method. Instead, initialize selectedLanguage as an instance variable of your State class _TestableState:
class Testable extends StatefulWidget {
#override
_TestableState createState() => _TestableState();
}
class _TestableState extends State<Testable> {
String selectedLanguage = 'English';
#override
Widget build(BuildContext context) {
final TextEditingController _controller = new TextEditingController();
var languages = ['English', 'اللغة العربية', 'Türkçe'];
return new Scaffold(
body: new Center(
child: new Container(
child: new Column(
children: [
new Padding(
padding: const EdgeInsets.all(24.0),
child: new Row(
children: <Widget>[
new Expanded(
child: Container(
decoration: BoxDecoration(color: Colors.blue),
height: 65,
width: double.infinity,
alignment: Alignment.center,
child: Text(
selectedLanguage,
style: TextStyle(color: Colors.white, fontSize: 16),
),
),
),
new PopupMenuButton<String>(
icon: const Icon(Icons.arrow_drop_down),
onSelected: (String value) {
setState(() {
selectedLanguage = value;
switch (selectedLanguage) {
case "English":
MyApp.setLocale(context, Locale('en', 'US'));
break;
case "اللغة العربية":
MyApp.setLocale(context, Locale('ar', 'SA'));
break;
case "Türkçe":
MyApp.setLocale(context, Locale('tr', 'TR'));
break;
}
print(selectedLanguage);
});
},
itemBuilder: (BuildContext context) {
return languages
.map<PopupMenuItem<String>>((String value) {
return new PopupMenuItem(
child: new Text(value), value: value);
}).toList();
},
),
],
),
),
],
),
),
),
);
}
}