如何在 Flutter 中的容器的一側制作圓形邊框？

Question

我需要在容器的一側繪制圓形邊框。 問題在於這種方法：

Container(
      decoration: BoxDecoration(
        borderRadius: BorderRadius.only(bottomLeft: Radius.circular(4.sp), bottomRight: Radius.circular(4.sp)),
        border: Border(bottom: BorderSide(width: 2.sp, color: Color.fromARGB(255, 237, 237, 237))),
      ),

拋出此錯誤：

flutter: ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
flutter: The following assertion was thrown during paint():
flutter: A borderRadius can only be given for a uniform Border.
flutter: The following is not uniform:
flutter: BorderSide.color
flutter: BorderSide.width
flutter: BorderSide.style

我怎樣才能做到這一點？ 預期 output：

Answer 1

像這樣添加一個帶有 Box Shadow 的容器：

Container(
decoration: BoxDecoration(
                boxShadow: [
                  BoxShadow(
                    color: Colors.grey.shade100,
                    spreadRadius: 1,
                    blurRadius: 0,
                    offset: Offset(0, 0), // changes position of shadow
                  ),
                ],
                borderRadius: BorderRadius.only(
                  topLeft: Radius.circular(30.0),
                  topRight: Radius.circular(30.0),
                ),
              ),
)

Answer 2

似乎Flutter 還不支持它。
您可以通過堆棧執行所需的操作（不過，在使用此代碼后要洗手）：

Stack(children: [
        Container(
          width: double.infinity,
          height: 8.sp,
          decoration: BoxDecoration(
            borderRadius: BorderRadius.all(Radius.circular(4.sp)),
            border: Border.all(width: 2.sp, color: Color.fromARGB(255, 237, 237, 237)),
          ),
        ),
        Container(
          width: double.infinity,
          height: 3.sp,
          color: Colors.white, //or your bg color
        ),
      ])