Home > other >  How to constain maxWidth of flutter Tooltip?
How to constain maxWidth of flutter Tooltip?

Time:11-20

if the tooltip message is very long, the tooltip expands on the full screen size. How to avoid it and fix max width of tooltip message or convert it to multiline text?

Tooltip(
   message: "A very, very, very, very loooooooooooooooooong text of information icon",
   child: Icon(Icons.info_outline_rounded),
)

CodePudding user response:

You can manually add a break-line (\n) within the message. So for instance:

Tooltip(
   message: "A very, very, very, very\nloooooooooooooooooong\ntext of information icon",
   child: Icon(Icons.info_outline_rounded),
)

CodePudding user response:

you can try with this and just tweak with margin

// call from outside 
 getToolTip("A very, very, very, very loooooooooooooooooong text of information icon", GlobalKey())

// tooltip        
getToolTip(String message, GlobalKey _toolTipKey) {
  return GestureDetector(
    onTap: (){
      final dynamic _toolTip = _toolTipKey.currentState;
      _toolTip.ensureTooltipVisible();
    },
    child: Tooltip(
      key: _toolTipKey,
      waitDuration: Duration(seconds: 1),
      showDuration: Duration(seconds: 2),
      preferBelow: true,
      verticalOffset: 20,
      margin: EdgeInsets.only(right: 50), //here you change the margin 
      padding: EdgeInsets.all(5),
      height: 16,
      message: message,
      child: Icon(
        Icons.add,
      ),
    ),
  );
}

enter image description here

  • Related