как отобразить перетаскиваемый контейнер внутри другого контейнера при перетаскивании в него во флаттере

Что я сделал до сих пор, так это сделал виджет перетаскиваемым и цель перетаскивания в соответствии с моими требованиями. Что я хочу, так это то, что когда пользователь бросает перетаскиваемый контейнер в цель перетаскивания, я хочу показать этот перетаскиваемый виджет внутри этого большого целевого контейнера перетаскивания и могу оценить, является ли это правильным вариантом или нет. вторая проблема, с которой я сталкиваюсь, заключается в том, что я использую преобразование текста в речь для звука, и это не работает, я пробовал много вещей, но все равно это не работает. у меня есть кнопка воспроизведения, и я даю ей букву, например A, B, D, G и т. д., когда пользователь нажимает кнопку, я хочу воспроизвести звук этой кнопки и перетащить нужный контейнер в цель перетаскивания. Спасибо за помощь.

      // ignore_for_file: prefer_const_constructors, file_names, non_constant_identifier_names

import 'package:dyslexia/pages/round_2/Q8sound.dart';
import 'package:dyslexia/utilities/nextButton.dart';
import 'package:flutter/material.dart';
import 'package:flutter_tts/flutter_tts.dart';

import '../../utilities/QuestionWidget.dart';

class Q1DAD extends StatefulWidget {
  const Q1DAD({Key? key}) : super(key: key);

  @override
  State<Q1DAD> createState() => _Q1DADState();
}

class _Q1DADState extends State<Q1DAD> {
  String question =
      "Listen to this letter sound and then choose the letter whose sound you hear";
  var changeButton = false;
  var score = 0;
  final FlutterTts flutterTts = FlutterTts();

  speak(word) async {
    await flutterTts.setLanguage("en-US");
    await flutterTts.setPitch(1);
    await flutterTts.setVolume(10.0);
    await flutterTts.speak(word);
  }

  var word = "M";

  bool isPlayingMsg = false;
  bool draged = false;
  bool showDRag = false;

  @override
  Widget build(BuildContext context) {
    bool isPlayingMsg = false;
    return Scaffold(
      appBar: AppBar(
        automaticallyImplyLeading: true,
        backgroundColor: Colors.cyan,
        title: Text("AD&DY"),
      ),
      body: Padding(
        padding: const EdgeInsets.all(14.0),
        child: Column(children: [
          QuestionWidget(question: question),
          SizedBox(height: MediaQuery.of(context).size.height * 0.05),
          Material(
            elevation: 5,
            color: Colors.cyan[50],
            child: ListTile(
              onTap: () async {
                speak(word);
                isPlayingMsg = true;
              },
              leading: Icon(isPlayingMsg ? Icons.stop : Icons.play_arrow),
              title: Text(isPlayingMsg ? "Stop" : "Play",
                  textScaleFactor: 1.2,
                  style: TextStyle(
                    color: Colors.black,
                  )),
            ),
          ),
          Divider(
            thickness: 1.0,
          ),
          SizedBox(height: MediaQuery.of(context).size.height * 0.05),
          Column(
            children: [
              DragTarget1(),
              SizedBox(height: MediaQuery.of(context).size.height * 0.07),
              Wrap(
                spacing: 10,
                runSpacing: 5,
                children: [
                  draggableWord("M", false, score),
                  draggableWord("N", false, score),
                  draggableWord("O", false, score),
                  draggableWord("R", false, score),
                ],
              ),
            ],
          ),
          SizedBox(height: MediaQuery.of(context).size.height * 0.1),
          nextButton(changeButton: changeButton, Location: Q8sound()),
        ]),
      ),
    );
  }

  int acceptedData = 0;
  Widget DragTarget1() {
    return Column(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: [
        DragTarget<int>(
          builder: (
            BuildContext context,
            List<dynamic> accepted,
            List<dynamic> rejected,
          ) {
            return Material(
              elevation: 10,
              borderRadius: BorderRadius.circular(80),
              child: Container(
                height: 100.0,
                width: 250.0,
                color: Color.fromARGB(255, 78, 166, 178),
                child: draged
                    ? Container(
                        height: 50,
                        width: 70,
                        color: Colors.lightGreenAccent,
                        child: Align(
                          child: Text(word),
                        ),
                      )
                    : Center(
                        child: Text('Drag target here'),
                      ),
              ),
            );
          },
          onAccept: (int data) {
            setState(() {
              draged = true;
              showDRag = true;
            });
          },
        ),
      ],
    );
  }

  Widget draggableWord(word, option, score) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.spaceEvenly,
      children: <Widget>[
        showDRag
            ? SizedBox()
            : Draggable<int>(
                // Data is the value this Draggable stores.
                data: 10,
                feedback: Container(
                  color: Colors.yellow[100],
                  height: 50,
                  width: 70,
                  child: Center(child: Text(word)),
                ),
                childWhenDragging: Material(
                  elevation: 5,
                  borderRadius: BorderRadius.circular(10),
                  child: Container(
                    height: 50.0,
                    width: 70.0,
                    color: Colors.grey,
                    child: Center(
                      child: Text(""),
                    ),
                  ),
                ),
                child: Material(
                  elevation: 5,
                  borderRadius: BorderRadius.circular(10),
                  child: Container(
                    height: 50,
                    width: 70,
                    color: Colors.lightGreenAccent,
                    child: Center(
                      child: Text(word),
                    ),
                  ),
                ),
              )
      ],
    );
  }
}

вот мой виджет вопроса

      import 'package:flutter/material.dart';

class QuestionWidget extends StatelessWidget {
  const QuestionWidget({
    Key? key,
    required this.question,
  }) : super(key: key);

  final String question;

  @override
  Widget build(BuildContext context) {
    return Material(
      elevation: 12,
      color: Color.fromARGB(255, 125, 200, 210),
      shadowColor: Colors.grey,
      borderRadius: BorderRadius.circular(8),
      child: Container(
          height: 80,
          width: 280,
          alignment: Alignment.center,
          child: Text(question,
              textScaleFactor: 1.2,
              style: TextStyle(
                color: Colors.black,
              ))),
    );
  }
}

0 ответов

Другие вопросы по тегам