flutter - 如何使 Flutter RaisedButton 处于选中状态

Question

如何使 RaisedButton 成为选中状态，就像切换按钮选中状态一样？

如何使 RaisedButton 不占用额外的宽度，即虾皮包裹标签文本。

Answer 1

我相信我已经设法在不使用 RaisedButton 的情况下做同样的事情。

据我了解，您试图在第一个问题中使 RaisedButton 在两种情况之间切换，您可以通过在 onPressed 时在两个 States 之间交替来实现此目的 被调用。

但是，为了也回答您的第二个问题，我使用了 Container 而不是 RaisedButton ，这个 Container 现在充当一个 Button ，当被点击时，它会在状态之间切换。并且 Container 将根据它的 child 调整自身大小，在我的示例中，Text 的状态会发生变化(String 和 Color 值)。

最后，为了让这个 Container 具有与 RaisedButton 的按下功能类似的行为，我将它包装在 GestureDetector 中，并控制 onTap 调用内部的状态变化。

这是我的完整代码:

import 'package:flutter/material.dart';


void main() {
  runApp(new MaterialApp(
      home: new MyApp()));
}

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return new _MyAppState();
  }
}

class _MyAppState extends State<MyApp> {
  Color _myColor = Colors.green;
  String _myAccountState = "Account Enabled";

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("Manage Accounts"),
        centerTitle: true,
      ),
      body: new Center(
          child: new GestureDetector(
            child: new Container(
              decoration: new BoxDecoration(color: Colors.grey),
              child: new Text(
                _myAccountState, style: new TextStyle(color: _myColor),),
            ),
            onTap: () {
              setState(() {
                if (_myColor == Colors.green) {
                  _myAccountState = "Account Disabled";
                  _myColor = Colors.orange;
                }
                else {
                  _myAccountState = "Account Enabled";
                  _myColor = Colors.green;
                }
              });
            },

          )
      ),
    );
  }

}

PS:对于开关行为，您绝对可以使用 RaisedButton 并产生类似的行为，如下所示:

return new Scaffold(
      appBar: new AppBar(
        title: new Text("Manage Accounts"),
        centerTitle: true,
      ),
      body: new Center(
        child: new Column(
          children: <Widget>[
            new Text(_myAccountState),
            new RaisedButton(
                child: new Text("Click Me"), color: _myColor, onPressed: () {
              setState(() {
                if (_myColor == Colors.green) {
                  _myAccountState = "Account Disabled";
                  _myColor = Colors.red;
                }
                else {
                  _myAccountState = "Account Enabled";
                  _myColor = Colors.green;
                }
              });
            })
          ],
        ),
      ),
    );

但是，我尝试将 Container 与 GestureDetector 一起使用的唯一原因是回答您的第二个问题，我不确定如何将 shrinkWrap 与 一起使用凸起按钮。