Flutter:-ListTile不显示单选按钮 [英] Flutter :- ListTile does not show radio buttons

问题描述

我想在ListTile的字幕上水平显示2个单选按钮. 我只能看到一个单选按钮

I want to display 2 radio buttons horizontally on the subtitle of the ListTile. I can see only one Radio Button

List<QuestionsOptions> optionsList = [
QuestionsOptions(
  index: 1,
  name: "Yes",
),
QuestionsOptions(
  index: 0,
  name: "No",
),
];

推荐答案

您需要在ListView.builder的帮助下使用颤振的水平列表视图，并为水平滚动和复选框设置scrollDirection: Axis.horizontal需要使用具有文本功能的单选按钮使用RadioListTile.请检查我下面的代码.

You need to use the Horizontal listview of the flutter by the help of the ListView.builder and set the scrollDirection: Axis.horizontal for the horizontal scroll and for the checkbox we need to use the RadioListTile for the radio button with text functionality.Please check my below code for it.

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
import 'package:flutterlearningapp/colors.dart';

class HomeScreen extends StatefulWidget {

  @override
  State<StatefulWidget> createState() {
    // TODO: implement createState
    return _HomeScreen();
  }
}

class _HomeScreen extends State<HomeScreen> {
  List<String> selectedList = new List<String>();

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    selectedList.add("");
    selectedList.add("");
    selectedList.add("");
    selectedList.add("");
    selectedList.add("");
    selectedList.add("");
    selectedList.add("");
    selectedList.add("");

  }

  @override
  Widget build(BuildContext context) {
    // TODO: implement build

    return Scaffold(
      appBar: AppBar(
        title: Text("Home"),
      ),
      body: Container(
        padding: EdgeInsets.symmetric(horizontal: 16.0, vertical: 24.0),
        height: MediaQuery.of(context).size.height * 0.29,
        child: ListView.builder(
            scrollDirection: Axis.horizontal,
            itemCount: selectedList.length,
            itemBuilder: (context, index) {
              return Row(
                children: <Widget>[
                  Container(
                    width: MediaQuery.of(context).size.width * 0.4,
                    color: Colors.greenAccent,
                    child: Column(
                      children: <Widget>[
                        SizedBox(
                          height: 10.0,
                        ),
                        Container(
                          margin: EdgeInsets.only(left: 10.0),
                          child:Align(

                            alignment: Alignment.topLeft,
                            child: Text("Question ${index}"),
                          ) ,
                        )
                        ,
                        RadioListTile(
                          groupValue: selectedList[index]==""?0:
                          selectedList[index]=="0"?false:true,
                          title: Text('Yes'),
                          value: true,
                          onChanged: (val) {
                            setState(() {
                              selectedList[index] = "1";

                            });

                          },
                        ),
                        RadioListTile(
                          groupValue: selectedList[index]==""?0:
                          selectedList[index]=="0"?false:true,
                          title: Text('No'),
                          value: false,
                          onChanged: (val) {
                            setState(() {
                              selectedList[index] = "0";
                            });

                          },
                        ),
                      ],
                    ),
                  ),
                  SizedBox(
                    width: 10.0,
                  )
                ],
              );
            }),
      ),
    );
  }

    checkValue(int index, var selectedVale) {
    setState(() {
      if (selectedList[index] == "1") {
        selectedList[index] = "1";
      }
      else  if (selectedList[index] == "2") {
        selectedList[index] = "2";

      }
      else{
        selectedList[index] = "0";

      }
    });

  }
}

从上面的代码输出将是

这篇关于Flutter:-ListTile不显示单选按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！