我尝试仅在用户未订阅时才有条件地在颤振中使用底表模式,但它给了我错误



问题:我有一个flutter应用程序,登录后,我只想在该应用程序的用户未订阅时显示底部表单模式弹出窗口,并限制他们使用该应用程序,并且可以点击将他们直接带到订阅小部件/页面。

但我得到一个错误说";参数类型";"未来";无法分配给参数类型"Widget">

我尝试过的解决方案:

  1. 我试图删除我在FloatingModal类中传递的Future和Async函数,但它在运行时上仍然会出现相同的错误

  2. 我将我的无状态小部件"Dashboard"转换为有状态小部件,看看它是否起到了作用,但它不起作用。

  3. 如果这种方法完全错误,你会为我推荐什么更好的方法来解决用例/问题

请注意,我使用的是Jaimeblasco的modal_bottom_sheet flutter软件包。该应用程序还在laravel中使用后端。

积极负责的3个小部件是dashboard.dartsubscription_notice.dartfloating_modal.dart,我将提供代码片段。

求你了,我真的需要帮助,因为这是我现在正在做的一个项目。谢谢:(

class Dashboard extends StatelessWidget {
const Dashboard({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
HomeController homeController = Get.find();
ServicesController servicesController = Get.find();
VerificationController verificationController = Get.find();
PlayersController playersController = Get.find();
var user =
UserModel.fromJson(jsonDecode(homeController.userData.value)).user!;

Widget content(context) {
return Obx(() => Column(
children: [
Expanded(
child: ListView(
padding: const EdgeInsets.only(
top: 40, left: 20, right: 20, bottom: 20),
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
AppLocalizations.of(context)!.welcome +
" ${user.firstName}",
style: const TextStyle(fontSize: 20)),

if (servicesController.subscription.isEmpty &&
!servicesController.loading &&
user.userType != "club_official")
FloatingModal(child: showFloatingModalBottomSheet(context: context, builder: (context) => const SubscriptionNotice())),
]);
),
const HorizontalAdvertBanner()
],
));
}

class SubscriptionNotice extends StatelessWidget {
const SubscriptionNotice({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
ServicesController servicesController = Get.find();
var user =
UserModel.fromJson(jsonDecode(servicesController.userData.value)).user!;
return Material(
child: SafeArea(
top: false,
child: Column(
children: [
const SizedBox(
height: 20,
),
CardItem(
icon: SvgPicture.asset("assets/images/warning_icon.svg"),
content: RichText(
text: TextSpan(
children: user.userType == "player"
? [
TextSpan(
text:
"you need to subscribe to a plan. Click on this ",
style: TextStyle(
fontSize: 14,
color: Get.isDarkMode
? AppColors.textLigth
: AppColors.textDark,
fontFamily: "Avenir")),
const TextSpan(
text: "link",
style: TextStyle(
color: Color(0xffFF9432),
fontSize: 14,
fontWeight: FontWeight.w600,
fontFamily: "Avenir")),
TextSpan(
text: " and subscribe now",
style: TextStyle(
fontSize: 14,
color: Get.isDarkMode
? AppColors.textLigth
: AppColors.textDark,
fontFamily: "Avenir"))
]
: [
TextSpan(
text:
" you need to subscribe.  Click on this",
style: TextStyle(
fontSize: 14,
color: Get.isDarkMode
? AppColors.textLigth
: AppColors.textDark,
fontFamily: "Avenir")),
const TextSpan(
text: " link",
style: TextStyle(
color: Color(0xffFF9432),
fontSize: 14,
fontWeight: FontWeight.w600,
fontFamily: "Avenir")),
TextSpan(
text: ", and subscribe",
style: TextStyle(
fontSize: 14,
color: Get.isDarkMode
? AppColors.textLigth
: AppColors.textDark,
fontFamily: "Avenir"))
]),
),
onPressed: () {
TabRouting().pushScreen(context, const Services());
}),
],
),
),
);
}
}

class FloatingModal extends StatelessWidget {
final Widget child;
final Color? backgroundColor;
const FloatingModal({Key? key, required this.child, this.backgroundColor})
: super(key: key);
@override
Widget build(BuildContext context) {
return SafeArea(
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 20),
child: Material(
color: backgroundColor,
clipBehavior: Clip.antiAlias,
borderRadius: BorderRadius.circular(12),
child: child,
),
),
);
}
}
Future<T> showFloatingModalBottomSheet<T>({
required BuildContext context,
required WidgetBuilder builder,
Color? backgroundColor,
}) async {
final result = await showCustomModalBottomSheet(
context: context,
builder: builder,
containerWidget: (_, animation, child) => FloatingModal(
child: child,
),
expand: false);
return result;
}

FloatingModal上,它将小部件作为子部件进行查找。但showFloatingModalBottomSheet是一种未来的方法。

您可以使用可点击的小部件,并在其上点击事件使用此方法。

FloatingModal(
child: ElevatedButton(
onPressed: () async {
showFloatingModalBottomSheet(context: context, builder: (context) => const SubscriptionNotice());
},
child: Text("showX"),
),
)

StatelessWidget上构建小部件后直接显示对话框

@override
Widget build(BuildContext context) {
WidgetsBinding.instance.addPostFrameCallback((timeStamp) async {
//condition if needed 
await showFloatingModalBottomSheet(context: context, builder: (context) => const SubscriptionNotice());
});

最新更新