Draggable widget loses text styling while dragging - Flutter

49 Views Asked by At

When I drag the view, the Text changes it's style. I guess there is some rebuilding going on. Any idea how I can make the Text stay the same while I drag it?

Positioned(
    left: _textPosition.dx,
    top: _textPosition.dy,
    child: Draggable(
      feedback: Container(
        color: black_transparent_light,
        child:  Padding(
          padding: const EdgeInsets.all(8.0),
          child: Text(
            "Some Text Here",
            style: const TextStyle( // Preserve original style
                color: Colors.white, // Adjust as needed
                fontSize: 16, // Adjust as needed
                fontStyle: FontStyle.normal,
                decoration: TextDecoration.none
            ),
          ),
        )
      ),
      childWhenDragging: Container(),
      onDragEnd: (details)
      {
        final RenderBox renderBox = _mainContainerKey.currentContext!.findRenderObject() as RenderBox;
        final Offset position = renderBox.localToGlobal(Offset.zero); // This is the absolute position

        setState(() {
          _textPosition = Offset(
              details.offset.dx-position.dx - mainContainerStartMargin,
              details.offset.dy-position.dy-mainContainerTopMargin);
        });
      },
      child: Container(
        color: black_transparent_light,
        child:  Padding(
          padding: const EdgeInsets.all(8.0),
          child: Text(
            "Some Text Here",
            style: const TextStyle( // Preserve original style
                color: Colors.white, // Adjust as needed
                fontSize: 16, // Adjust as needed
                fontStyle: FontStyle.normal,
                decoration: TextDecoration.none
            ),
          ),
        ),
      ),
    ),
  ),
1

There are 1 best solutions below

0
stavros.3p On BEST ANSWER

All I had to do to fix this issue was to wrap the Container inside the feedback with the Material Widget:

feedback: Material(
   color: Colors.transparent,
   child: Container(
   color: black_transparent_light,
   child:  Padding(
   padding: const EdgeInsets.all(8.0),
     child: Text(
             "Some Text Here",
             style: const TextStyle( // Preserve original style
              color: Colors.white, // Adjust as needed
             fontSize: 16, // Adjust as needed
                fontStyle: FontStyle.normal,
               decoration: TextDecoration.none
                 ),
               ),
            )
      ),
)