Блог

У меня есть список, определенный как показано ниже, и я пытаюсь выделить один элемент списка во время урока. В настоящее время я использую Tutorial Coach Mark. Каждый раз, когда я отлаживаю свое приложение, оно показывает мне

 KEY information could not be obtained 
  

Я не знаю, почему это происходит, поскольку я выполнил все необходимые шаги для интеграции, показанные в зависимости.
Это мой код:

 class _SettingsState extends State<Settings> {
  TutorialCoachMark tutorialCoachMark;
  GlobalKey keyButton3 = GlobalKey();
  List<TargetFocus> targets = List();
  
  void initState() {
    initTarget();
    WidgetsBinding.instance.addPostFrameCallback(_afterLayouts);
    super.initState();
  }

  void _afterLayouts(_) {
    Future.delayed(Duration(milliseconds: 100), () {
      showTutorial(context);
    });
  }

  void showTutorial(context) {
    tutorialCoachMark = TutorialCoachMark(context,
        targets: targets,
        colorShadow: Colors.red,
        textSkip: "SKIP",
        paddingFocus: 10,
        opacityShadow: 0.8, onFinish: () {
      print("finish");
    }, onClickTarget: (target) {
      print(target);
    }, onClickSkip: () {
      print("skip");
    })
      ..show();
  }

  void initTarget() {
    targets.add(
      TargetFocus(
          //claim reward
          identify: "Target 2",
          keyTarget: keyButton3,
          color: Colors.purple,
          contents: [
            ContentTarget(
                align: AlignContent.bottom,
                child: Container(
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    crossAxisAlignment: CrossAxisAlignment.start,
                    children: <Widget>[
                      Text(
                        "Click here",
                        style: TextStyle(
                            fontWeight: FontWeight.bold,
                            color: Colors.white,
                            fontSize: 20.0),
                      ),
                    ],
                  ),
                ))
          ],
          shape: ShapeLightFocus.RRect,
          radius: 6),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          centerTitle: true,
          iconTheme: IconThemeData(
            color: Colors.white,
          ),
          elevation: 0,
          title: Text(
            'Settings',
            style: kTasksStyle,
          ),
          backgroundColor: Color(0xff0C7368),
        ),
        body: Stack(
          children: [
            Padding(
              padding: const EdgeInsets.only(top: 8),
              child: ListView.separated(
                  separatorBuilder: (context, index) => Divider(
                        height: 2,
                        color: Colors.grey.withOpacity(0.3),
                      ),
                  itemCount: 5,
                  itemBuilder: (context, index) {
                    return Padding(
                      padding: EdgeInsets.all(5.0),
                      child: ListTile(
                        key: index == 0 ? keyButton3 : null,// to highlight the 0th index of the list only                  
                        title: Text(
                          "Hello",
                          style: kTasksStyle.copyWith(
                              fontSize: 15,
                              color: Colors.black,
                              fontWeight: FontWeight.normal),
                        ),
                        leading: Icon(
                          Icons.supervised_user_circle,
                          color: Color(0xff0C7368),
                        ),
                      ),
                    );
                  }),
            )
          ],
        ));
  }
}
  

Я пытаюсь добиться чего-то подобного этому: