繁体   English   中英

我想在单击扩展磁贴时填充此单选按钮,并且当我单击一个扩展磁贴时,我希望另一个关闭

[英]I want to make this radio button filled when clicked on the expansion tile and also when i click on one expansion tile i want the other to close

我在这里面临的问题是我希望在单击扩展磁贴时填充单选图标,并且在打开一个扩展磁贴时我希望关闭另一个扩展磁贴。

我什至尝试向扩展块添加一个单选按钮,但是当我这样做时,它只会填充按钮,但从不扩展扩展块。 我被困在这里没有任何帮助。

有人可以帮我解决这个问题吗?

 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';

void main() {
  SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
    statusBarColor: Colors.transparent,
    statusBarIconBrightness: Brightness.light,
  ));
  runApp(MaterialApp(
    home: MyApp(),
  ));
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {

  bool debitStatus = false;
  bool paytmStatus = false;
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        appBar: AppBar(
          elevation: 0,
          backgroundColor: Color.fromRGBO(38, 70, 83, 1),
          title: Text('Appointment Booking'),
          centerTitle: true,
          leading: IconButton(
            icon: Icon(Icons.arrow_forward),
            onPressed: () {
              Navigator.pop(context);
            },
          ),
        ),
        body: SingleChildScrollView(
          child: Container(
            child: Column(
              children: [
                Container(
                  color: Colors.white,
                  child: Column(
                    children: [
                      Container(
                        color: Color(0xffEBEBEB),
                        child: ExpansionTile(
                          initiallyExpanded: debitStatus,
                          title: Text(
                            "Debit / Credit Card",
                            style: TextStyle(
                              fontSize: 15.0,
                              color: Color(0xff205072),
                            ),
                          ),
                          trailing: Icon(Icons.radio_button_unchecked_sharp),
                          onExpansionChanged: (value) {
                            setState(() {
                              paytmStatus = false;
                            });
                          },
                          children: <Widget>[
                            Container(
                              color: Colors.white,
                              height: 80,
                              width: MediaQuery.of(context).size.width,
                              child: Padding(
                                padding: const EdgeInsets.all(8.0),
                                child: Column(
                                  children: [
                                    Align(
                                      alignment: Alignment.topLeft,
                                      child: Text(
                                        'It will Redirect to Card details page',
                                        style: TextStyle(
                                          color: Color(0xff205072),
                                        ),
                                      ),
                                    ),
                                    Padding(
                                      padding: const EdgeInsets.only(left: 8.0),
                                      child: Align(
                                        alignment: Alignment.topLeft,
                                        child: ElevatedButton(
                                          style: ElevatedButton.styleFrom(
                                            shape: RoundedRectangleBorder(
                                              borderRadius:
                                              BorderRadius.circular(18.0),
                                            ),
                                            primary:
                                            Color.fromRGBO(38, 70, 83, 1),
                                          ),
                                          child: Text(
                                            'Continue',
                                            style: TextStyle(
                                              fontSize: 12.0,
                                              color: Color(0xffFFFFFF),
                                            ),
                                          ),
                                          onPressed: () {
                                            print('Takes to card payment');
                                          },
                                        ),
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(height: 8.0),
                      Container(
                        color: Color(0xffEBEBEB),
                        child: ExpansionTile(
                          initiallyExpanded: false,
                          backgroundColor: Color(0xffEBEBEB),
                          title: Text(
                            "PayTM",
                            style: TextStyle(
                              fontSize: 15.0,
                              color: Color(0xff205072),
                            ),
                          ),
                          trailing: Icon(Icons.radio_button_unchecked_sharp),
                          children: <Widget>[
                            Container(
                              color: Colors.white,
                              height: 80,
                              width: MediaQuery.of(context).size.width,
                              child: Padding(
                                padding: const EdgeInsets.all(8.0),
                                child: Column(
                                  children: [
                                    Text(
                                      'Link your Paytm wallet associated with the number',
                                      style: TextStyle(
                                        color: Color(0xff205072),
                                      ),
                                    ),
                                    Padding(
                                      padding: const EdgeInsets.only(left: 8.0),
                                      child: Align(
                                        alignment: Alignment.topLeft,
                                        child: ElevatedButton(
                                          style: ElevatedButton.styleFrom(
                                            shape: RoundedRectangleBorder(
                                              borderRadius:
                                              BorderRadius.circular(18.0),
                                            ),
                                            primary:
                                            Color.fromRGBO(38, 70, 83, 1),
                                          ),
                                          child: Text(
                                            'Send OTP',
                                            style: TextStyle(
                                              fontSize: 12.0,
                                              color: Color(0xffFFFFFF),
                                            ),
                                          ),
                                          onPressed: () {},
                                        ),
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ),
                          ],
                          onExpansionChanged: (value) {
                            setState(() {
                              debitStatus = false;
                            });
                          },
                        ),
                      ),
                    ],
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM