My app contains multiple cards with check box which makes wheather a work is done or not.
I want to create expansion panel list which contains multiple expansion panel. But when i want to give 16px spacing between each ExpansionPanels when it's not expanded but there is no option to do that. Can you please help.
If there is any other alternative to design this layout please help.
ExpansionPanelList(
// animationDuration: Duration(milliseconds: 10),
expandedHeaderPadding: EdgeInsets.only(top: 08),
elevation: 0,
children: [
ExpansionPanel(
isExpanded: _isOpen[0],
headerBuilder: (context, isOpen) {
return Padding(
padding: const EdgeInsets.symmetric(
vertical: 12, horizontal: 15),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"0 Month",
style: ThemeText.s18w500Black,
),
Visibility(
visible: toggele0[0] && toggele0[1] && toggele0[2],
child: Row(
children: [
SvgPicture.asset(
"assets/icons/icon-vaccination-check.svg"),
SizedBox(
width: 6.5,
),
Text(
"Done",
style: ThemeText.s12w400Green2,
),
],
),
)
],
),
);
},
body: Column(
children: [
CheckboxListTile(
controlAffinity: ListTileControlAffinity.leading,
activeColor: HexColor(HexColors.textColorGreen2),
title: Text(
"Oral Polio Vaccine (2nd dose)",
style: ThemeText.s16w400Black.copyWith(
decoration: toggele0[0]
? TextDecoration.lineThrough
: TextDecoration.none),
),
subtitle: Text("Protects against Poliomyelitis"),
value: toggele0[0],
onChanged: (value) {
setState(() {
toggele0[0] = !toggele0[0];
});
}),
CheckboxListTile(
controlAffinity: ListTileControlAffinity.leading,
activeColor: HexColor(HexColors.textColorGreen2),
title: Text(
"Oral Polio Vaccine (2nd dose)",
style: ThemeText.s16w400Black.copyWith(
decoration: toggele0[1]
? TextDecoration.lineThrough
: TextDecoration.none),
),
subtitle: Text("Protects against Poliomyelitis"),
value: toggele0[1],
onChanged: (value) {
setState(() {
toggele0[1] = !toggele0[1];
});
}),
CheckboxListTile(
controlAffinity: ListTileControlAffinity.leading,
activeColor: HexColor(HexColors.textColorGreen2),
title: Text(
"Oral Polio Vaccine (2nd dose)",
style: ThemeText.s16w400Black.copyWith(
decoration: toggele0[2]
? TextDecoration.lineThrough
: TextDecoration.none),
),
subtitle: Text("Protects against Poliomyelitis"),
value: toggele0[2],
onChanged: (value) {
setState(() {
toggele0[2] = !toggele0[2];
});
})
],
)),
ExpansionPanel(
isExpanded: _isOpen[1],
headerBuilder: (context, isOpen) {
return Padding(
padding: const EdgeInsets.symmetric(
vertical: 12, horizontal: 15),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"1 Month",
style: ThemeText.s18w500Black,
),
Visibility(
visible: toggele1[0] && toggele1[1] && toggele1[2],
child: Row(
children: [
SvgPicture.asset(
"assets/icons/icon-vaccination-check.svg"),
SizedBox(
width: 6.5,
),
Text(
"Done",
style: ThemeText.s12w400Green2,
),
],
),
)
],
),
);
},
body: Column(
children: [
CheckboxListTile(
controlAffinity: ListTileControlAffinity.leading,
activeColor: HexColor(HexColors.textColorGreen2),
title: Text(
"Oral Polio Vaccine (2nd dose)",
style: ThemeText.s16w400Black.copyWith(
decoration: toggele1[0]
? TextDecoration.lineThrough
: TextDecoration.none),
),
subtitle: Text("Protects against Poliomyelitis"),
value: toggele1[0],
onChanged: (value) {
setState(() {
toggele1[0] = !toggele1[0];
});
}),
CheckboxListTile(
controlAffinity: ListTileControlAffinity.leading,
activeColor: HexColor(HexColors.textColorGreen2),
title: Text(
"Oral Polio Vaccine (2nd dose)",
style: ThemeText.s16w400Black.copyWith(
decoration: toggele1[1]
? TextDecoration.lineThrough
: TextDecoration.none),
),
subtitle: Text("Protects against Poliomyelitis"),
value: toggele1[1],
onChanged: (value) {
setState(() {
toggele1[1] = !toggele1[1];
});
}),
CheckboxListTile(
controlAffinity: ListTileControlAffinity.leading,
activeColor: HexColor(HexColors.textColorGreen2),
title: Text(
"Oral Polio Vaccine (2nd dose)",
style: ThemeText.s16w400Black.copyWith(
decoration: toggele1[2]
? TextDecoration.lineThrough
: TextDecoration.none),
),
subtitle: Text("Protects against Poliomyelitis"),
value: toggele1[2],
onChanged: (value) {
setState(() {
toggele1[2] = !toggele1[2];
});
})
],
)),]),
I implemented a search bar in flutter with the below code and everything is working fine. I am able to get the search bar in the layout. Now, I want to add a dropdown button just below the searchbar.
return Scaffold(
body: SafeArea(
child: ListView (
children: [
SearchBar<Post>(
searchBarPadding: EdgeInsets.symmetric(horizontal: 10),
headerPadding: EdgeInsets.symmetric(horizontal: 10),
listPadding: EdgeInsets.symmetric(horizontal: 10),
onSearch: _getALlPosts,
searchBarController: _searchBarController,
hintText: "What do you want to search?",
hintStyle: TextStyle(
color: Colors.blueGrey,
),
textStyle: TextStyle(
color: Colors.black,
fontWeight: FontWeight.bold,
),
mainAxisSpacing: 10,
crossAxisSpacing: 10,
cancellationWidget: Text("Cancel"),
emptyWidget: Text("empty"),
indexedScaledTileBuilder: (int index) => ScaledTile.count(1, 1),
onCancelled: () {
print("Cancelled triggered");
},
onItemFound: (Post post, int index) {
return Center(
child: Card(
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
const ListTile(
leading: Icon(Icons.album),
title: Text('Item 1'),
subtitle: Text('Item subtitle 1.'),
),
ButtonBar(
children: <Widget>[
FlatButton(
child: const Text('Find item'),
onPressed: () {
Navigator.of(context).push(MaterialPageRoute(
builder: (context) => DetailMedicine()));
},
),
],
),
Container(
color: Colors.amber[600],
child: const Center(child: Text('Entry A')),
),
],
),
),
);
DropdownButton<String>(
value: dropdownValue,
icon: Icon(Icons.arrow_downward),
iconSize: 24,
elevation: 16,
style: TextStyle(color: Colors.deepPurple),
underline: Container(
height: 2,
color: Colors.deepPurpleAccent,
),
onChanged: (String newValue) {
setState(() {
dropdownValue = newValue;
});
},
items: <String>['One', 'Two', 'Free', 'Four']
.map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
);
]
},
),
),
);
I want to put the search bar inside a listview. I tried making a listview and placing the searchbar and other widgets inside the widget list but it is showing blank screen as output. I wonder I am missing something here.
I am new to flutter and this is my first application. I have been trying to create a form modal with dropdown select would receive its data from the server. but for now I am using the values in array I created but it not setting the value after I select an item. I tried to add a setState() but is showing error. Please can someone help me?
Here is my code blow
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:erg_app/ProfilePage.dart';
void main() => runApp(
MaterialApp(
debugShowCheckedModeBanner: false,
home: StockPage(),
)
);
class StockPage extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Inventory Data',
theme: ThemeData(
primarySwatch: Colors.green,
),
home: StockInventory(),
);
}
}
class StockInventory extends StatefulWidget {
StockInventory({Key key}) : super(key: key); //Find out meaning
#override
_StockInventoryState createState() => _StockInventoryState();
}
class _StockInventoryState extends State<StockInventory> {
List<Products> products;
List<Products> selectedProducts;
bool sort;
#override
void initState() {
sort = false;
selectedProducts = [];
products = Products.getProducts();
super.initState();
}
onSortColum(int columnIndex, bool ascending) {
if (columnIndex == 0) {
if (ascending) {
products.sort((a, b) => a.name.compareTo(b.name));
} else {
products.sort((a, b) => b.name.compareTo(a.name));
}
}
}
#override
Widget build(BuildContext context){
return Scaffold(
appBar: AppBar(
title: new Center(child: new Text('Daily Stock Taking', textAlign: TextAlign.center)),
automaticallyImplyLeading: false,
iconTheme: IconThemeData(color: Colors.white),
backgroundColor: Colors.green,),
body: Container(
child: ListView(
children: <Widget>[
Container(
margin: const EdgeInsets.only(right: 20, top: 20),
child: Align(
alignment: Alignment.bottomRight,
child: RaisedButton(
padding: EdgeInsets.fromLTRB(14, 10, 14, 10),
color: Colors.green,
child: Text("Take Inventory", style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 14), ),
onPressed: () {
// Navigator.of(context).push(MaterialPageRoute(builder: (context) => ProfilePage()));
showSimpleCustomDialog(context);
},
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(50),
),
),
),
),
Container(
padding: EdgeInsets.only(top: 30, bottom: 30),
child: DataTable(
sortAscending: sort,
sortColumnIndex: 0,
columns: [
DataColumn(
label: Text("S/No", style: TextStyle(fontSize: 16)),
numeric: false,
),
DataColumn(
label: Text("Item", style: TextStyle(fontSize: 16)),
numeric: false,
onSort: (columnIndex, ascending) {
setState(() {
sort = !sort;
});
onSortColum(columnIndex, ascending);
}),
DataColumn(
label: Text("QtyInStock", style: TextStyle(fontSize: 16)),
numeric: false,
),
DataColumn(
label: Text("Unit", style: TextStyle(fontSize: 16)),
numeric: false,
),
],
rows: products
.map(
(product) => DataRow(
selected: selectedProducts.contains(product),
cells: [
DataCell(
Text(product.count),
onTap: () {
print('Selected ${product.count}');
},
),
DataCell(
Text(product.name),
onTap: () {
print('Selected ${product.name}');
},
),
DataCell(
Text(product.itemqty),
onTap: () {
print('Selected ${product.itemqty}');
},
),
DataCell(
Text(product.itemqty),
onTap: () {
print('Selected ${product.itemqty}');
},
),
]),
).toList(),
),
),
Container(
child: Center(
child: RaisedButton(
padding: EdgeInsets.fromLTRB(80, 10, 80, 10),
color: Colors.green,
child: Text("Post Inventory", style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 14), ),
onPressed: () {
Navigator.of(context).push(MaterialPageRoute(builder: (context) => ProfilePage()));
},
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(50),
),
),
),
),
],
),
),
);
}
}
class Products {
String count;
String name;
String measuringunit;
String itemqty;
Products({this.count, this.name, this.itemqty, this.measuringunit});
static List<Products> getProducts() {
return <Products>[
Products(count:"1", name: "NPK Fertilizer", itemqty: "50", measuringunit: "bag",),
Products(count:"2", name: "Urea Fertilizer", itemqty: "560", measuringunit: "bag",),
Products(count:"3", name: "Spray", itemqty: "150", measuringunit: "bottles",),
];
}
}
void showSimpleCustomDialog(BuildContext context) {
String dropdownValue = 'SelectItem';
// TextEditingController _controller = TextEditingController(text: dropdownValue);
Dialog simpleDialog = Dialog(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12.0),
),
child: Container(
height: 300.0,
width: 300.0,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding: EdgeInsets.only(top:20, bottom: 20, left: 30, right: 10),
child: Row(
children: <Widget>[
Expanded(child:
Text(
'Item',
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold, ),
),
),
Container(width: 2,),
Container(
child:DropdownButton<String>(
value: dropdownValue,
onChanged: (String newValue) {
// This set state is trowing an error
setState((){
dropdownValue = newValue;
});
},
items: <String>['Fertilizers', 'Bags', 'Spray', 'Equipments']
.map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: new Text(value),
);
})
.toList(),
),
),
],
)),
Padding(
padding: EdgeInsets.only(top:5, bottom: 5, left: 30, right: 10),
child: Row(
children: <Widget>[
Expanded(child:
Text(
'Quantity',
style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold, ),
),
),
Container(width: 2,),
Expanded(child: TextField(
keyboardType: TextInputType.number,
decoration: InputDecoration(
labelText: 'Quantity',
hintText: 'Enter Cost Quantity',
border:OutlineInputBorder(borderRadius: BorderRadius.circular(5.0))
),
)),
],
)),
Padding(
padding: const EdgeInsets.only(left: 10, right: 10, top: 10),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
RaisedButton(
color: Colors.blue,
onPressed: () {
Navigator.of(context).pop();
},
child: Text(
'Add',
style: TextStyle(fontSize: 18.0, color: Colors.white),
),
),
SizedBox(
width: 20,
),
RaisedButton(
color: Colors.red,
onPressed: () {
Navigator.pop(context);
// Navigator.of(context).push(MaterialPageRoute(builder: (context) => StockPage()));
},
child: Text(
'Cancel!',
style: TextStyle(fontSize: 18.0, color: Colors.white),
),
)
],
),
),
],
),
),
);
showDialog(context: context, builder: (BuildContext context) => simpleDialog);
}
// Dropdown Menu Class below
Maybe I think that using the Statefulbuilder for the dialog. So you can change the state there just check the sample example.
Change as per you needs :
import 'package:flutter/material.dart';
void main() => runApp(MaterialApp(
debugShowCheckedModeBanner: false,
home: StockPage(),
));
class StockPage extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Inventory Data',
theme: ThemeData(
primarySwatch: Colors.green,
),
home: StockInventory(),
);
}
}
class StockInventory extends StatefulWidget {
StockInventory({Key key}) : super(key: key); //Find out meaning
#override
_StockInventoryState createState() => _StockInventoryState();
}
class _StockInventoryState extends State<StockInventory> {
List<Products> products;
List<Products> selectedProducts;
bool sort;
#override
void initState() {
super.initState();
sort = false;
selectedProducts = [];
products = Products.getProducts();
}
onSortColum(int columnIndex, bool ascending) {
if (columnIndex == 0) {
if (ascending) {
products.sort((a, b) => a.name.compareTo(b.name));
} else {
products.sort((a, b) => b.name.compareTo(a.name));
}
}
}
void showSimpleCustomDialog(BuildContext context) {
String dropdownValue ;
// TextEditingController _controller = TextEditingController(text: dropdownValue);
AlertDialog simpleDialog1 = AlertDialog(
shape: RoundedRectangleBorder(borderRadius: BorderRadius.all(Radius.circular(10.0))),
content: StatefulBuilder(
builder :(BuildContext context, StateSetter setState) {
return Container(
height: 300.0,
width: 300.0,
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Padding(
padding:
EdgeInsets.only(top: 20, bottom: 20, left: 30, right: 10),
child: Row(
children: <Widget>[
Expanded(
child: Text(
'Item',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
),
),
),
Container(
width: 2,
),
Container(
child: DropdownButton<String>(
hint: Text('Enter value'),
value: dropdownValue,
onChanged: (String newValue) {
// This set state is trowing an error
setState(() {
dropdownValue = newValue;
});
},
items: <String>[
'Fertilizers',
'Bags',
'Spray',
'Equipments'
].map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: new Text(value),
);
}).toList(),
),
),
],
)),
Padding(
padding:
EdgeInsets.only(top: 5, bottom: 5, left: 30, right: 10),
child: Row(
children: <Widget>[
Expanded(
child: Text(
'Quantity',
style: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
),
),
),
Container(
width: 2,
),
Expanded(
child: TextField(
keyboardType: TextInputType.number,
decoration: InputDecoration(
labelText: 'Quantity',
hintText: 'Enter Cost Quantity',
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(5.0))),
)),
],
)),
Padding(
padding: const EdgeInsets.only(left: 10, right: 10, top: 10),
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
crossAxisAlignment: CrossAxisAlignment.end,
children: <Widget>[
RaisedButton(
color: Colors.blue,
onPressed: () {
Navigator.of(context).pop();
},
child: Text(
'Add',
style: TextStyle(fontSize: 18.0, color: Colors.white),
),
),
SizedBox(
width: 20,
),
RaisedButton(
color: Colors.red,
onPressed: () {
Navigator.pop(context);
// Navigator.of(context).push(MaterialPageRoute(builder: (context) => StockPage()));
},
child: Text(
'Cancel!',
style: TextStyle(fontSize: 18.0, color: Colors.white),
),
)
],
),
),
],
),
);
}
),
);
/* Dialog simpleDialog = Dialog(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(12.0),
),
child:
); */
showDialog(
context: context, builder: (BuildContext context) => simpleDialog1);
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: new Center(
child: new Text('Daily Stock Taking', textAlign: TextAlign.center)),
automaticallyImplyLeading: false,
iconTheme: IconThemeData(color: Colors.white),
backgroundColor: Colors.green,
),
body: Container(
child: ListView(
children: <Widget>[
Container(
margin: const EdgeInsets.only(right: 20, top: 20),
child: Align(
alignment: Alignment.bottomRight,
child: RaisedButton(
padding: EdgeInsets.fromLTRB(14, 10, 14, 10),
color: Colors.green,
child: Text(
"Take Inventory",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 14),
),
onPressed: () {
// Navigator.of(context).push(MaterialPageRoute(builder: (context) => ProfilePage()));
showSimpleCustomDialog(context);
},
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(50),
),
),
),
),
Container(
padding: EdgeInsets.only(top: 30, bottom: 30),
child: DataTable(
sortAscending: sort,
sortColumnIndex: 0,
columns: [
DataColumn(
label: Text("S/No", style: TextStyle(fontSize: 16)),
numeric: false,
),
DataColumn(
label: Text("Item", style: TextStyle(fontSize: 16)),
numeric: false,
onSort: (columnIndex, ascending) {
setState(() {
sort = !sort;
});
onSortColum(columnIndex, ascending);
}),
DataColumn(
label: Text("QtyInStock", style: TextStyle(fontSize: 16)),
numeric: false,
),
DataColumn(
label: Text("Unit", style: TextStyle(fontSize: 16)),
numeric: false,
),
],
rows: products
.map(
(product) => DataRow(
selected: selectedProducts.contains(product),
cells: [
DataCell(
Text(product.count),
onTap: () {
print('Selected ${product.count}');
},
),
DataCell(
Text(product.name),
onTap: () {
print('Selected ${product.name}');
},
),
DataCell(
Text(product.itemqty),
onTap: () {
print('Selected ${product.itemqty}');
},
),
DataCell(
Text(product.itemqty),
onTap: () {
print('Selected ${product.itemqty}');
},
),
]),
)
.toList(),
),
),
Container(
child: Center(
child: RaisedButton(
padding: EdgeInsets.fromLTRB(80, 10, 80, 10),
color: Colors.green,
child: Text(
"Post Inventory",
style: TextStyle(
color: Colors.white,
fontWeight: FontWeight.bold,
fontSize: 14),
),
onPressed: () {
Navigator.of(context).push(
MaterialPageRoute(builder: (context) => ProfilePage()));
},
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(50),
),
),
),
),
],
),
),
);
}
}
class Products {
String count;
String name;
String measuringunit;
String itemqty;
Products({this.count, this.name, this.itemqty, this.measuringunit});
static List<Products> getProducts() {
return <Products>[
Products(
count: "1",
name: "NPK Fertilizer",
itemqty: "50",
measuringunit: "bag",
),
Products(
count: "2",
name: "Urea Fertilizer",
itemqty: "560",
measuringunit: "bag",
),
Products(
count: "3",
name: "Spray",
itemqty: "150",
measuringunit: "bottles",
),
];
}
}
class ProfilePage extends StatelessWidget {
#override
Widget build(BuildContext context) {
return Container();
}
}
Just check the code.
Let me know if it works
I am Vaibhav Pathak. I have a a problem in using RadioListTile. I created two RadioListTile where on onChnaged property to call a function in which in call setState to set the value of selectedRadio variable to that value which I got from the function and It changed the variable value but does not reflect changes to the Ui means it does not select the pressed radio button.
My code is here :
showPaymentOptions() {
showModalBottomSheet(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.only(
topLeft: Radius.circular(25.0),
topRight: Radius.circular(25.0))),
elevation: 8.0,
context: context,
builder: (context) {
return Padding(
padding: const EdgeInsets.all(15.0),
child: Container(
height: 240,
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Column(
children: <Widget>[
Align(
alignment: Alignment.topLeft,
child: Text(
"Select Payment Method : ",
style: TextStyle(
color: Colors.black54,
fontSize: 16.0,
fontWeight: FontWeight.bold),
),
),
SizedBox(
height: 7.0,
),
Card(
elevation: 8.0,
child: Padding(
padding: const EdgeInsets.all(10.0),
child: Column(
children: <Widget>[
RadioListTile(
activeColor: myTheme.primaryColor,
title: Text("COD"),
value: 1,
groupValue: selectedPaymentMethod,
onChanged: (value) =>
_changePayment(value)),
SizedBox(
height: 5.0,
),
RadioListTile(
activeColor: myTheme.primaryColor,
title: Text("Paytm"),
value: 2,
groupValue: selectedPaymentMethod,
onChanged: (value) =>
_changePayment(value)),
],
),
),
),
],
),
Padding(
padding: const EdgeInsets.all(10.0),
child: Stack(
alignment: Alignment.bottomCenter,
children: <Widget>[
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(
"Pay ₹499",
style: TextStyle(
fontSize: 16.0,
fontWeight: FontWeight.bold),
),
isOrderSuccessful
? RaisedButton(
onPressed: () =>
placeOrder(selectedPaymentMethod),
color: myTheme.primaryColor,
textColor: Colors.white,
child: Text(
"Place Order",
style: TextStyle(
fontWeight: FontWeight.bold,
fontSize: 16.0),
))
: CircularProgressIndicator(
valueColor: AlwaysStoppedAnimation<Color>(
myTheme.primaryColor))
],
),
],
),
)
],
)),
);
});
}
Code of setState function :
_changePayment(int value) {
print(value);
print(selectedPaymentMethod);
setState(() {
selectedPaymentMethod = value;
});
}
friends I have done it by myself. I used the StatefulBuilder widget and wrap the Column inside the column children I put my two ReadioListTile and in the onChanged property I put the _setStatewhich I got from the builder of StatefulBuilder and set the value of payment method variable to its value and then it works properly in which way I want it.
Answer Code :
StatefulBuilder(
builder: (context, _setState) {
return Column(
children: <Widget>[
RadioListTile(
activeColor: myTheme.primaryColor,
title: Text("Cash on Delivery"),
value: 1,
groupValue: selectedPaymentMethod,
onChanged: (value) => _setState(() {
selectedPaymentMethod = value;
})),
RadioListTile(
activeColor: myTheme.primaryColor,
title: Text("Paytm"),
value: 2,
groupValue: selectedPaymentMethod,
onChanged: (value) => _setState(() {
selectedPaymentMethod = value;
})),
],
);
},
),