StadiumBorder详解

StadiumBorder

StadiumBorder 的灵感来自体育场的形状(一个相对两侧有 2 个半圆的盒子)，StadiumBorder 通常与 ShapeDecoration 一起使用来绘制边框。其构造：

 const StadiumBorder({ super.side }) 

例子：

 Container(
     width: 150,
     height: 75,
     decoration:   const ShapeDecoration(
         color: Colors.white,
         shape: StadiumBorder(
           side: BorderSide(
             width: 5.0,
             color: Colors.green
           )
         )
     ),
   ),

还可以将 StadiumBorder 用于 ElevatedButton、OutlinedButton 和 TextButton 等按钮。但是，在这种情况下，StadiumBorder.side 将不起作用，因为它已被 ButtonStyle.side 覆盖。

ElevatedButton(
  child: const Text('实例按钮'),
  onPressed: (){},
  style: ElevatedButton.styleFrom(
    backgroundColor: Colors.red,
    side: const BorderSide(width: 3,color: Colors.green),
    shape: const StadiumBorder(
      side: BorderSide(width: 5,color: Colors.blue),//被覆盖
    )
  ),
)