顫振小部件的自定義邊框-有解無憂

我有一個自定義邊框來圍繞小部件繪制。我附上了一張圖片顫振小部件的自定義邊框

誰能知道如何在顫振中做到這一點？

請注意它沒有底部邊框。

uj5u.com熱心網友回復：

這里有一個簡單的方法就可以實作固體邊界在你的widget。

Container(
          width: 200,
          height: 200,
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(10),
            border: Border.all(
              width: 5,
              color: Colors.red,
            ),
          ),
        ),

uj5u.com熱心網友回復：

請參考以下代碼：

Padding(
  padding: const EdgeInsets.all(15.0),
    child: Container(
        height: 100,
        width: double.infinity,
        decoration: BoxDecoration(
         border: Border.all(
            width: 4,
            color: Colors.black,),
        borderRadius:BorderRadius.circular(10.0),),
        child: Center(
           child: Text('Custom Border'),),),
 ),

uj5u.com熱心網友回復：

包裹小部件 Container

 Container(
            decoration: BoxDecoration(
            border: Border.all(width: 5.0, color: Colors.black),
             borderRadius: BorderRadius.circular(20.0) )// change value as per your needs
     child: //your widget
        )

uj5u.com熱心網友回復：

試試下面的代碼希望對你有幫助。

如果你只想要頂角是圓角的：

  Container(
        width: double.infinity,
        height: 100,
        decoration: BoxDecoration(
          borderRadius: const BorderRadius.only(
            topLeft: Radius.circular(10),
            topRight: Radius.circular(10),
          ),
          border: Border.all(
            width: 3,
            color: Colors.black,
          ),
        ),
      ),

結果頂部圓角：顫振小部件的自定義邊框

如果您希望所有容器都四舍五入：

Container(
        width: double.infinity,
        height: 100,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(10),
          border: Border.all(
            width: 5,
            color: Colors.black,
          ),
        ),
      ),

全圓角容器結果：顫振小部件的自定義邊框

轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/400075.html

標籤：扑镖

上一篇：我想在我的Flutter應用程式中將googlepay與stripe連接起來

下一篇：Flutter-如何使scrollwidget內的小部件不可滾動？