Flutter基本组件Radio(单选按钮)
1.话不多说,直接上代码
import 'package:flutter/material.dart';
class RadioView extends StatefulWidget {
@override
_RadioViewState createState() => _RadioViewState();
}
class _RadioViewState extends State<RadioView> {
int groupValue = 1;
onChange(value){
if(mounted)
setState(() {
groupValue = value;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
leading: Icon(
Icons.arrow_back,
size: 20,
color: Colors.yellow,
),
actions: <Widget>[
Container(
margin: EdgeInsets.only(right: 10),
child: Icon(Icons.android),
)
],
centerTitle: true,
title: Text(
"Hello world!",
style: TextStyle(
color: Colors.white,
fontSize: 14,
fontWeight: FontWeight.w500,
fontStyle: FontStyle.italic),
),
),
body: Container(
child: Center(
child:Column(
children: <Widget>[
Row(
///主轴(x)
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Radio(
///给单选按钮设置一个标签(名字),方便知道选中是哪一个
value: 1,
///当前选中的按钮的标签
groupValue: groupValue,
///监听用户操作事件,选中了哪一个,T就是value标签值
onChanged: (T) => onChange(T),
),
Radio(
value: 2,
groupValue: groupValue,
onChanged: (T) => onChange(T),
),
Radio(
value: 3,
groupValue: groupValue,
onChanged: (T) => onChange(T),
),
],
),
Text(
"当前选中的radio的value==>$groupValue"
),
],
),
),
),
);
}
}