【问题标题】:Flutter: Borders Disappear When Their Colour ChangesFlutter:当颜色变化时,边框消失
【发布时间】:2020-09-02 08:15:05
【问题描述】:

问题:

我遇到了一个我无法解决的有趣问题。当我改变它们的颜色时,容器的边框消失了。

代码:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        backgroundColor: Color(0xff31353B),
        body: Home(),
      ),
    );
  }
}

class Home extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Container(
            height: 50.0,
            child: GestureDetector(
              onTap: () {},
              child: Container(
                decoration: BoxDecoration(
                  border: Border(
                    left: BorderSide(
                      //TODO: HERE IS THE PROBLEM.
                      color: Color(0xFFF05A22),
                      //style: BorderStyle.solid,
                      width: 3.0,
                    ),
                    top: BorderSide(
                      //TODO: HERE IS THE PROBLEM.
                      color: Color(0xFFF05A22),
                      style: BorderStyle.solid,
                      width: 3.0,
                    ),
                    right: BorderSide(
                      //TODO: HERE IS THE PROBLEM.
                      color: Color(0xFFF05A22),
                      style: BorderStyle.solid,
                      width: 3.0,
                    ),
                    bottom: BorderSide(
                      //TODO: HERE IS THE PROBLEM.
                      color: Color(0xFFF05A22),
                      style: BorderStyle.solid,
                      width: 3.0,
                    ),
                  ),
                  color: Colors.green,
                  borderRadius: BorderRadius.circular(30.0),
                ),
                child: Row(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                    Center(
                      child: Text(
                        "BUTTON",
                        style: TextStyle(
                          color: Color(0xFFF05A22),
                          fontFamily: 'Montserrat',
                          fontSize: 16,
                          fontWeight: FontWeight.w600,
                          letterSpacing: 1,
                        ),
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ),
        ],
      ),
    );
  }
}

我已经用 //TODO:

标记了感兴趣的区域

如果它们不消失,我什至无法将它们的颜色更改为白色或黑色。我花了大约一个小时试图通过互联网搜索自己解决这个问题,但没有成功。

问题:

为什么我可以有一种颜色而不能有另一种?

预期:

将顶部和左侧边框更改为黑色,将底部和右侧边框更改为白色。

【问题讨论】:

  • 在颤振中,您不能在边框中使用两种不同的颜色,也不适用于边框半径

标签: flutter border


【解决方案1】:

在颤振中“只能为统一的边界指定边界半径。”因此,如果您删除半径,它将起作用。但是如果要保持半径,只用一条线并不容易,question中有一些示例:

【讨论】:

    猜你喜欢
    • 2012-03-15
    • 1970-01-01
    • 2017-07-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-08-20
    • 1970-01-01
    • 2021-08-25
    相关资源
    最近更新 更多