我想在 flutter 中創建一個曲線底部應用欄？

Question

enter image description here

return Scaffold(backgroundColor: Colors.white, bottomNavigationBar: BottomAppBar(child: Container(height: 155, child: Center(child: Text('Powered By')), color: Colors.green, )));

Answer 1

您可以使用以下代碼創建一個彎曲的底部應用欄。

  return Scaffold(
      backgroundColor: Colors.white,
      bottomNavigationBar: BottomAppBar(
        child: Container(
          height: 155,
          child: Center(
            child: Container(
              margin: const EdgeInsets.only(top: 50),
              height: 100,
              width: 150,
              decoration: const BoxDecoration(
                borderRadius: BorderRadius.only(topLeft: Radius.circular(75), topRight: Radius.circular(75)),
                color: Colors.grey,
              ),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: const [
                  Text("Powered By"),
                  Text("Logo Here"),
                ],
              ),
            ),
          ),
          color: Colors.green,
        ),
      ),
    );