Skip to content

Instantly share code, notes, and snippets.

@yusufpats
Last active November 24, 2020 04:03
Show Gist options
  • Save yusufpats/5e1f5df75ab12ff3377f026fffc55df1 to your computer and use it in GitHub Desktop.
Save yusufpats/5e1f5df75ab12ff3377f026fffc55df1 to your computer and use it in GitHub Desktop.
Picker Widget using `setState` - This PickerWidget can be used to create any type of selector
import 'package:flutter/material.dart';
final Color darkBlue = Color.fromARGB(255, 18, 32, 47);
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
final List<PickerItem> paymentModes = [
PickerItem("Cash On Delivery", ""),
PickerItem("Visa Card", ""),
];
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: ThemeData.dark().copyWith(scaffoldBackgroundColor: darkBlue),
debugShowCheckedModeBanner: false,
home: Scaffold(
backgroundColor: Colors.white,
body: Center(
child: PickerWidget(pickerItems: paymentModes),
),
),
);
}
}
class PickerItem {
String label;
String icon;
PickerItem(this.label, this.icon);
}
class PickerWidget extends StatefulWidget {
final List<PickerItem> pickerItems;
const PickerWidget({
Key key,
this.pickerItems,
}) : super(key: key);
@override
_PickerWidgetState createState() => _PickerWidgetState();
}
class _PickerWidgetState extends State<PickerWidget> {
int selectedIndex = -1;
@override
Widget build(BuildContext context) {
return ListView.builder(
itemBuilder: (context, index) {
PickerItem pickerItem = widget.pickerItems[index];
bool isItemSelected = index == selectedIndex;
return InkWell(
onTap: (){
selectedIndex = index;
setState(() {});
},
child: Container(
alignment: Alignment.center,
margin: const EdgeInsets.symmetric(horizontal:16.0, vertical: 4),
decoration: BoxDecoration(
// color: Color(0xff04385f),
border: Border.all(color: Colors.grey[400]),
borderRadius: BorderRadius.all(Radius.circular(12)),
),
child: Padding(
padding: const EdgeInsets.all(8.0),
child: Row(
children: [
Container(
height: 24,
child: Image.asset('images/cod.png'),
),
SizedBox(width: 4),
Expanded(
child: Text(
pickerItem.label,
style: TextStyle(
color: Color(0xff04385f),
fontFamily: 'UbuntuMedium',
),
),
),
isItemSelected
? Icon(Icons.check_circle, size: 16, color: Colors.green,)
: Container(),
],
),
),
),
);
},
itemCount: widget.pickerItems.length,
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment