mcq_radio 1.0.2
mcq_radio: ^1.0.2 copied to clipboard
MCQRadio is a customizable Flutter package that provides a Radio widget for multiple-choice questions with an alphabet in the center.
MCQRadio #
MCQRadio is a Flutter package that provides a customizable Radio widget for multiple-choice questions (MCQs) based on the Flutter Radio widget. It enables developers to create a Radio button with an alphabet in the center, as well as to customize the color, size, and style of the button and its text.
Features #
- Create a Radio button with an alphabet in the center
- Customize the color, size, and style of the button and its text
- Support for both dark and light themes
- Works seamlessly with Flutter's Material Design
Getting started #
To use MCQRadio, add the package to your dependencies in the pubspec.yaml file:
dependencies:
mcq_radio: ^1.0.0
Then run flutter pub get in the terminal to download and install the package.
In your Dart code, import the package:
import 'package:mcq_radio/mcq_radio.dart';
Usage #
Use the MCQRadio widget to create a Radio button for MCQs. Here is an example of how to use it:
const one = "ক";
const two = "খ";
const three = "গ";
const four = "ঘ";
const five = "ঙ";
const unanswered = "";
enum OptionTitles { one, two, three, four, five, unanswered }
OptionTitles _optionTitle = OptionTitles.unanswered;
MCQRadio<OptionTitles>(
fillColor: MaterialStateColor.resolveWith(
(states) => Colors.black), // color of the radio button
value: OptionTitles
.one, // value of the radio button (enum) ক, খ, গ, ঘ, ঙ etc
groupValue: _optionTitle, // value of the selected radio button
mcqOptionAlphabetStyle: const TextStyle(
fontSize: 20,
fontFamily: "SolaimanLipi",
color: Colors.black, // color of the radio button Alphabet
), // style of the radio button text
circleRadius: 20, // radius of the radio button
mcqOptionAlphabet: one,
onChanged: (OptionTitles? value) {
setState(() {
_optionTitle = value!;
});
},
);
Screenshots #
[screenshoot/ss.jpeg]Additional information #
- The
fillColorparameter is used to set the color of the Radio button when it is selected. It uses aMaterialStateColorobject to change the color based on the state of the button. - The
valueparameter is used to set the value of the Radio button. It should be anenumvalue that corresponds to the letter displayed in the button. - The
groupValueparameter is used to determine which Radio button in a group is selected. It should be a variable that holds the currently selectedenumvalue. - The
mcqOptionAlphabetStyleparameter is used to set the style of the letter displayed in the Radio button. - The
circleRadiusparameter is used to set the size of the Radio button. - The
mcqOptionAlphabetparameter is used to set the letter displayed in the Radio button. - Use the
onChangedparameter to update the selectedenumvalue when the Radio button is selected.