526互联

flutter 底部弹出框

发布时间 2024-01-09 10:18:15作者: 吾爱吃鱼

getx模式

Get.bottomSheet(
      isScrollControlled: false,
      backgroundColor: AppColors.primaryBackground,
      isDismissible: false,
      enableDrag: false,
      Container(
        decoration: const ShapeDecoration(
          color: Colors.white,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.only(
              topLeft: Radius.circular(16),
              topRight: Radius.circular(16),
            ),
          ),
        ),
        // color: Colors.white,
        child:,
)

原生模式

  Container _buildBottomSheet(context) {
      return Container(
        height: 400,
        padding: const EdgeInsets.all(8.0),
        decoration: BoxDecoration(
            border: Border.all(color: Colors.transparent, width: 2.0),
            borderRadius: BorderRadius.circular(16.0),
            color: Colors.white),
        child:,

  );
    }

原生模式使用方法：

 onTap:(){
                showModalBottomSheet<void>(
                    context: context,
                    enableDrag:false,
                    builder: (BuildContext context) {
                      return _buildBottomSheet(context);
                    });
              },