并排显示按钮 |不显眼的方法?

时间:2021-02-17 00:12:55

标签: flutter

我试图让两个按钮并排,如下面的屏幕截图所示。

我在网上尝试了很多资源,但都没有成功。我什至尝试将更宽的列变成一行,但是,这完全脱离了设计。

有没有办法在当前按钮旁边添加第二个按钮而不会太突兀?

  const SizedBox(height: 16.0),
            OutlineButton(
              onPressed: () {},
              child: Text('Continue'),
              borderSide: BorderSide(color: Color(0xff33333D)),

有什么区别

Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  'Some Text',
                  style: TextStyle(
                    fontSize: 24,
                    fontFamily: 'Avenir',
                    fontWeight: FontWeight.w900,
                  ),
                ),
                const SizedBox(height: 16.0),
                Text(
                  "Some Text.",
                  style: TextStyle(
                    fontSize: 20,
                    fontFamily: 'Avenir',
                  ),
                ),
                const SizedBox(height: 16.0),
                OutlineButton(
                  onPressed: () {},
                  child: Text('Continue'),
                  borderSide: BorderSide(color: Color(0xff33333D)),

根据答案编辑:

Row(
                    children: [
                      OutlineButton(
                        onPressed: () {},
                        child: Text('Login'),
                        borderSide: BorderSide(
                          color: Color(0xff33333D),
                        ),
                      ),
                      SizedBox(
                        width: 15,
                        height: 25,
                      ),
                      OutlineButton(
                        onPressed: () {},
                        child: Text('Sign Up'),
                        borderSide: BorderSide(
                          color: Color(0xff33333D),

示例:

enter image description here

1 个答案:

答案 0 :(得分:1)

你可以用父行小部件包装它

  Column(
    crossAxisAlignment: CrossAxisAlignment.start,
    children: [
      Text(""),
      Text(""),
      Row(
        children: [
          OutlineButton(
            onPressed: () {},
            child: Text('Continue'),
            borderSide: BorderSide(
              color: Color(0xff33333D),
            ),
          ),
          SizedBox(width: 10),
          OutlineButton(
            onPressed: () {},
            child: Text('Continue'),
            borderSide: BorderSide(
              color: Color(0xff33333D),
            ),
          ),
        ],
      )
    ],
  )
相关问题