how can i achieve this kind of RadioButton
CodePudding user response:
Completely custom
import 'package:flutter/material.dart';
class CustomRadioBtn extends StatefulWidget {
const CustomRadioBtn({Key? key}) : super(key: key);
@override
State<CustomRadioBtn> createState() => _CustomRadioBtnState();
}
class _CustomRadioBtnState extends State<CustomRadioBtn> {
int selectedIndex = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
anyItem(0),
const SizedBox(height: 10.0),
anyItem(1),
],
),
);
}
Widget anyItem(int index) => GestureDetector(
onTap: () {
setState(() {
selectedIndex = index;
});
},
child: Container(
width: 20.0,
height: 20.0,
padding: EdgeInsets.all(4.0),
decoration: BoxDecoration(
border: Border.all(),
borderRadius: BorderRadius.circular(25.0),
color: selectedIndex == index ? Colors.blue : Colors.white,
),
child: Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10.0), color: Colors.white),
),
),
);
}
CodePudding user response:
In material design, there is a built in radio class. https://api.flutter.dev/flutter/material/Radio-class.html