flutter 不同文件中的TextButton未被识别为TextButton

xn1cxnb4  于 2022-12-14  发布在  Flutter
关注(0)|答案(2)|浏览(156)

我正在Flutter项目中使用GetX。
使用像Get.snackbar()这样的函数可以显示一个SnackBar,我想在其中包含一个使用mainButton的按钮。这个按钮必须是TextButton类型。因为我在项目的很多部分都使用这种类型的SnackBar,所以我想从另一个文件调用TextButton
我创建了一个文件,如下所示:

import 'package:flutter/material.dart';

class SnackbarTextButton extends StatelessWidget {
  final String text;

  const SnackbarTextButton({Key? key, required this.text}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return TextButton(
      style: ButtonStyle(
        overlayColor: MaterialStateColor.resolveWith((states) => Colors.transparent),
        splashFactory: NoSplash.splashFactory,
      ),
      onPressed: () {},
      child: Text(
        text,
        style: const TextStyle(
          fontSize: 12,
          color: Colors.white,
          fontWeight: FontWeight.bold,
        ),
      ),
    );
  }
}

我在使用SnackBar的地方包含了它,但得到了错误:The argument type 'SnackbarTextButton' can't be assigned to the parameter type 'TextButton?' .
我如何告诉我的文件我实际上返回的是一个TextButton?我如何改变我在另一个文件上构建的小部件的类型,以匹配本例中的TextButton
先谢谢你。

mec1mxoz

mec1mxoz1#

您可以创建一个helper方法来代替StatelessWidget,因为如果所需的类型是TextButton?,那么使用StatelessWidget时,您应该扩展或实现TextButton类型:

class SnackbarTextButton extends TextButton {// ...}

但是这会给您的案例带来额外的不必要的工作,因为您可以简单地创建一个helper方法来返回您想要的TextButton小部件:

TextButton snackbarTextButton ({required this.text}) {
 return TextButton(
  style: ButtonStyle(
    overlayColor: MaterialStateColor.resolveWith((states) => Colors.transparent),
    splashFactory: NoSplash.splashFactory,
  ),
  onPressed: () {},
  child: Text(
    text,
    style: const TextStyle(
      fontSize: 12,
      color: Colors.white,
      fontWeight: FontWeight.bold,
    ),
  ),
);
 }

那么就这样命名它:

snackbarTextButton(text: "exampleText"), // this will be valid for TextButton type
xvw2m8pv

xvw2m8pv2#

我希望这个答案能解决你的错误这是你应该做的
用于main.dart

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(title: 'Snackbar'),
    );
  }
}

您可以像这样使用Get.showSnackbar

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key, required this.title}) : super(key: key);

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(widget.title), actions: [
        TextButton(
            onPressed: () {
              Get.showSnackbar(const GetSnackBar(
                backgroundColor: Colors.blue,
                titleText: SnackbarTextButton(text: "SnackbarTextButton"),
                message: "Hello",
              ));
            },
            child: const Text(
              "Show snackBar",
              style: TextStyle(color: Colors.white),
            )),
      ]),
      body: Column(children: <Widget>[]),
    );
  }
}

文本按钮代码

class SnackbarTextButton extends StatelessWidget {
  final String text;

  const SnackbarTextButton({Key? key, required this.text}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Align(
      alignment: Alignment.centerLeft,
      child: TextButton(
        style: ButtonStyle(
          backgroundColor:
              MaterialStateColor.resolveWith((states) => Colors.red),
          overlayColor:
              MaterialStateColor.resolveWith((states) => Colors.transparent),
          splashFactory: NoSplash.splashFactory,
        ),
        onPressed: () {
          Get.back();
        },
        child: Text(
          text,
          style: const TextStyle(
            fontSize: 12,
            color: Colors.white,
            fontWeight: FontWeight.bold,
          ),
        ),
      ),
    );
  }
}

输出:

相关问题