Question

我的目标是在彼此上方显示两个文本框，并在其周围显示实线边框。不幸的是，我无法指定顶部文本字段应该没有底部边框。下图显示了当前状态。在两个文本字段之间，有一个粗边框，是两个文本字段的单个边框大小的两倍。

现在的问题是：是否有一种简单的方法，通过分别删除第一个文本字段的底部边框或第二个文本字段的顶部边框，来使两个文本字段之间的边框与标准边框大小相同？

相应的代码如下：

body: Column(
children: <Widget>[
  Container(
    padding: EdgeInsets.fromLTRB(20, 20, 20, 0),
    child: TextField(
      decoration: InputDecoration(
        filled: true,
        fillColor: Color(0xffff8f00),
        enabledBorder: const OutlineInputBorder(
          borderSide: const BorderSide(
            color: Colors.white,
            width: 3.0,
            //style: BorderStyle.none,
          ),
          borderRadius: BorderRadius.only(
            topRight: Radius.circular(20),
            topLeft: Radius.circular(20),
          ),
        ),
        focusedBorder: const OutlineInputBorder(
          borderSide: const BorderSide(color: Colors.white, width: 3.0),
          borderRadius: BorderRadius.only(
            topRight: Radius.circular(20),
            topLeft: Radius.circular(20),
          ),
        ),
        hintText: "Email or username",
        hintStyle: TextStyle(
          fontSize: 16,
          color: Colors.white70,
        ),
      ),
      style: TextStyle(
        color: Colors.white,
        fontWeight: FontWeight.w700,
      ),
      controller: myEmailUsernameController,
    ),
  ),
  Container(
    padding: EdgeInsets.fromLTRB(20, 0, 20, 0),
    child: TextField(
      decoration: InputDecoration(
        filled: true,
        fillColor: Color(0xffff8f00),
        enabledBorder: const OutlineInputBorder(
          borderSide: const BorderSide(color: Colors.white, width: 3.0),
          borderRadius: BorderRadius.only(
            bottomLeft: Radius.circular(20),
            bottomRight: Radius.circular(20),
          ),
        ),
        focusedBorder: const OutlineInputBorder(
          borderSide: const BorderSide(color: Colors.white, width: 3.0),
          borderRadius: BorderRadius.only(
            bottomLeft: Radius.circular(20),
            bottomRight: Radius.circular(20),
          ),
        ),
        hintText: "Password",
        hintStyle: TextStyle(
          fontSize: 16,
          color: Colors.white70,
        ),
      ),
      style: TextStyle(
        color: Colors.white,
        fontWeight: FontWeight.w700,
      ),
      obscureText: showPW,
      controller: myPasswordController,
    ),
  ),
],
),

从OutlineInputBorder删除特定边框

0 个答案: