1

当从黑色选择为白色时,我想更改提升按钮中文本的颜色。现在,如果我从这些提升的按钮中选择任何选项,背景颜色会发生变化,但文本颜色不会发生变化。但我也想更改文本颜色。这是我当前代码的示例图像。有人可以帮我解决这个问题吗?

图片示例

这是我当前的这部分代码-

class property_selection extends StatefulWidget {
  const property_selection({Key? key}) : super(key: key);

  @override
  _property_selectionState createState() => _property_selectionState();
}

int index = -1;
Color enableColor = Colors.red; //your color
Color disableColor = Colors.white; //your color

class _property_selectionState extends State<property_selection> {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        body: Center(
          child: ListView(
            shrinkWrap: true,
            children: <Widget>[
              Container(
                margin: EdgeInsets.fromLTRB(0, 0, 0, 0),
                child: Text(
                  'Select your class',
                  textAlign: TextAlign.center,
                  style: TextStyle(
                      color: Colors.red,
                      fontWeight: FontWeight.w500,
                      fontSize: 30),
                ),
              ),
              SizedBox(
                height: 15.0,
              ),
              Container(
                margin: EdgeInsets.fromLTRB(75, 0, 75, 0),
                padding: EdgeInsets.fromLTRB(0, 0, 0, 0),
                height: 60.0,
                child: ElevatedButton(
                  onPressed: () {
                    setState(() {
                      index = 0;
                    });
                  },
                  child: SizedBox(
                    width: double.infinity,
                    child: Text(
                      'Clas 01',
                      textAlign: TextAlign.left,
                    ),
                  ),
                  style: ElevatedButton.styleFrom(
                      side: BorderSide(width: 2.5, color: Colors.grey),
                      primary: index == 0 ? Colors.red : Colors.white,
                      onPrimary: Colors.black,
                      textStyle: const TextStyle(
                        fontSize: 15,
                      )),
                ),
              ),
              SizedBox(
                height: 10.0,
              ),
              Container(
                margin: EdgeInsets.fromLTRB(75, 0, 75, 0),
                padding: EdgeInsets.fromLTRB(0, 0, 0, 0),
                height: 60.0,
                child: ElevatedButton(
                  onPressed: () {
                    setState(() {
                      index = 1;
                    });
                  },
                  child: SizedBox(
                    width: double.infinity,
                    child: Text(
                      'Clas 02',
                      textAlign: TextAlign.left,
                    ),
                  ),
                  style: ElevatedButton.styleFrom(
                      side: BorderSide(width: 2.5, color: Colors.grey),
                      primary: index == 1 ? Colors.red : Colors.white,
                      onPrimary: Colors.black,
                      textStyle: const TextStyle(
                        fontSize: 15,
                      )),
                ),
              ),
              SizedBox(
                height: 10.0,
              ),
              Container(
                margin: EdgeInsets.fromLTRB(75, 0, 75, 0),
                padding: EdgeInsets.fromLTRB(0, 0, 0, 0),
                height: 60.0,
                child: ElevatedButton(
                  onPressed: () {
                    setState(() {
                      index = 2;
                    });
                  },
                  child: SizedBox(
                    width: double.infinity,
                    child: Text(
                      'Clas 03',
                      textAlign: TextAlign.left,
                    ),
                  ),
                  style: ElevatedButton.styleFrom(
                      side: BorderSide(width: 2.5, color: Colors.grey),
                      primary: index == 2 ? Colors.red : Colors.white,
                      onPrimary: Colors.black,
                      onSurface: Colors.white,
                      textStyle: const TextStyle(
                        fontSize: 15,
                      )),
                ),
              ),
              SizedBox(
                height: 10.0,
              ),
              Container(
                margin: EdgeInsets.fromLTRB(75, 0, 75, 0),
                height: 50,
                padding: EdgeInsets.fromLTRB(0, 0, 0, 0),
                child: ElevatedButton(
                  child: Text('Next'),
                  onPressed: () {
                    Navigator.push(
                      context,
                      MaterialPageRoute(builder: (context) => customer_name()),
                    );
                  },
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
4

1 回答 1

1

根据条件更改onPrimary:颜色,例如ElevatedButton.styleFrom

onPrimary: index == 2 ? Colors.white : Colors.black,它是Clas 03按钮,index==classIndex对其他两个做同样的改变

完整的小部件


class property_selection extends StatefulWidget {
  const property_selection({Key? key}) : super(key: key);

  @override
  _property_selectionState createState() => _property_selectionState();
}

int index = -1;
Color enableColor = Colors.red; //your color
Color disableColor = Colors.white; //your color

class _property_selectionState extends State<property_selection> {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        body: Center(
          child: ListView(
            shrinkWrap: true,
            children: <Widget>[
              Container(
                margin: EdgeInsets.fromLTRB(0, 0, 0, 0),
                child: Text(
                  'Select your class',
                  textAlign: TextAlign.center,
                  style: TextStyle(
                      color: Colors.red,
                      fontWeight: FontWeight.w500,
                      fontSize: 30),
                ),
              ),
              SizedBox(
                height: 15.0,
              ),
              Container(
                margin: EdgeInsets.fromLTRB(75, 0, 75, 0),
                padding: EdgeInsets.fromLTRB(0, 0, 0, 0),
                height: 60.0,
                child: ElevatedButton(
                  onPressed: () {
                    setState(() {
                      index = 0;
                    });
                  },
                  child: SizedBox(
                    width: double.infinity,
                    child: Text(
                      'Clas 01',
                      textAlign: TextAlign.left,
                      // style: TextStyle(
                      //   color: index == 0 ? Colors.white : Colors.black,
                      // ),
                    ),
                  ),
                  style: ElevatedButton.styleFrom(
                      side: BorderSide(width: 2.5, color: Colors.grey),
                      primary: index == 0 ? Colors.red : Colors.white,
                      onPrimary: index == 0 ? Colors.white : Colors.black,
                      textStyle: const TextStyle(
                        fontSize: 15,
                      )),
                ),
              ),
              SizedBox(
                height: 10.0,
              ),
              Container(
                margin: EdgeInsets.fromLTRB(75, 0, 75, 0),
                padding: EdgeInsets.fromLTRB(0, 0, 0, 0),
                height: 60.0,
                child: ElevatedButton(
                  onPressed: () {
                    setState(() {
                      index = 1;
                    });
                  },
                  child: SizedBox(
                    width: double.infinity,
                    child: Text(
                      'Clas 02',
                      textAlign: TextAlign.left,
                    ),
                  ),
                  style: ElevatedButton.styleFrom(
                      side: BorderSide(width: 2.5, color: Colors.grey),
                      primary: index == 1 ? Colors.red : Colors.white,
                       onPrimary: index == 1? Colors.white : Colors.black,
                      textStyle: const TextStyle(
                        fontSize: 15,
                      )),
                ),
              ),
              SizedBox(
                height: 10.0,
              ),
              Container(
                margin: EdgeInsets.fromLTRB(75, 0, 75, 0),
                padding: EdgeInsets.fromLTRB(0, 0, 0, 0),
                height: 60.0,
                child: ElevatedButton(
                  onPressed: () {
                    setState(() {
                      index = 2;
                    });
                  },
                  child: SizedBox(
                    width: double.infinity,
                    child: Text(
                      'Clas 03',
                      textAlign: TextAlign.left,
                    ),
                  ),
                  style: ElevatedButton.styleFrom(
                      side: BorderSide(width: 2.5, color: Colors.grey),
                      primary: index == 2 ? Colors.red : Colors.white,
                        onPrimary: index == 2 ? Colors.white : Colors.black,
                      onSurface: Colors.white,
                      textStyle: const TextStyle(
                        fontSize: 15,
                      )),
                ),
              ),
              SizedBox(
                height: 10.0,
              ),
              Container(
                margin: EdgeInsets.fromLTRB(75, 0, 75, 0),
                height: 50,
                padding: EdgeInsets.fromLTRB(0, 0, 0, 0),
                child: ElevatedButton(
                  child: Text('Next'),
                  onPressed: () {
                    // Navigator.push(
                    //   context,
                    //   MaterialPageRoute(builder: (context) => customer_name()),
                    // );
                  },
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

于 2021-10-29T16:22:13.603 回答