BottomModalSheet 中的单选按钮

问题描述

我是扑扑和飞镖的新手。我试图在 ModalBottomSheet 中插入几个单选按钮和一个凸起的按钮。 预期的输出是，按钮应该被禁用，直到从单选按钮中选择任何选项，一旦选择了任何选项，按钮应该被启用。 在我尝试过的代码中，存在一个问题，即单选按钮在我单击它们时没有被选中，而是在我关闭并重新打开底部弹出屏幕后被选中。此外，我无法编写用于禁用和启用按钮的代码，因为我不知道它。 任何建议都会非常有帮助，提前致谢！

class ReturnReason extends StatefulWidget {
  @override
  _ReturnReasonState createState() => _ReturnReasonState();
}

class _ReturnReasonState extends State<ReturnReason> {
  int selectedRadio;
  @override
 void initSate() {
    super.initState();
    selectedRadio = 0;
  }
  setSelectedRadio(int val) {
    setState(() {
      selectedRadio = val;
    });
  }
@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(
          'Flutter Project',style: TextStyle(
            fontSize: 18.0,color: Colors.blue,fontWeight: FontWeight.bold,),backgroundColor: Colors.black12,iconTheme: IconThemeData(color: Colors.black),body: Center(
        child: RaisedButton(
          onpressed: () {
            _bottomSheet(context);
          },color: Colors.deepPurple,padding: EdgeInsets.all(10.0),child: Text(
            'Click me',style: TextStyle(color: Colors.white,fontSize: 18.0),);
  }

  _bottomSheet(context) {
    showModalBottomSheet(
        context: context,builder: (BuildContext bc) {
          return SingleChildScrollView(
              child: Container(
            height: MediaQuery.of(context).size.height * .80,decoration: Boxdecoration(
                color: Colors.white,borderRadius: BorderRadius.only(
                  topLeft: Radius.circular(30),topRight: Radius.circular(30),)),child: Padding(
              padding: const EdgeInsets.all(8.0),child: Column(
                children: <Widget>[
                  Container(
                    width: 0.8 * MediaQuery.of(context).size.height,child: Row(
                      mainAxisAlignment: MainAxisAlignment.spaceBetween,crossAxisAlignment: CrossAxisAlignment.start,children: [
                        Text('Select Return Reason'),],Container(
                    width: 0.8 * MediaQuery.of(context).size.width,children: [
                        Text('Improper description'),Radio(
                          value: 1,groupValue: selectedRadio,onChanged: (val) {
                            setSelectedRadio(val);
                          },Divider(),children: [
                        Text('Size issue'),Radio(
                         value: 2,onChanged: (val) {
                          setSelectedRadio(val);
                          },children: [
                        Text('Other'),Radio(
                          value: 3,onChanged: (val) {
                           setSelectedRadio(val);
                          },Row(
                    mainAxisAlignment: MainAxisAlignment.center,children: [
                      Container(
                        width: 0.9 * MediaQuery.of(context).size.width,height: 0.075 * MediaQuery.of(context).size.height,child: RaisedButton(
                          onpressed: () => {
                            _bottomSheet2(context)
                          },shape: RoundedRectangleBorder(
                              borderRadius: BorderRadius.circular(10.0)),padding: EdgeInsets.all(0.0),child: Ink(
                            decoration: Boxdecoration(
                                gradient: LinearGradient(
                                  begin: Alignment.bottomCenter,end: Alignment.topCenter,borderRadius: BorderRadius.circular(10.0)),child: GestureDetector(
                              onTap: () {
                                _bottomSheet2(context);
                              },child: Container(
                                constraints: BoxConstraints(
                                    maxWidth: MediaQuery.of(context).size.width,minHeight: 0.075 *
                                        MediaQuery.of(context).size.height),alignment: Alignment.center,child: Text('Continue'),));
        });
  }

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）