CODEWITHSUNDEEP
flutterdart
Max
Max

Reputation: 1301

How to add three dots at the end of a line on a textField in Flutter?

I have a text box that displays selected information. I faced the problem that if the text is long, it is cut off on the right sometimes from the bottom. Tell me, how can I do if the text is too long and does not fit in the text field - put three dots at the end?

widget

  Widget build(BuildContext context) {
    return SizedBox(
      height: 58,
      child: Card(
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(8),
        ),
        child: TextField(
          style: constants.Styles.smallTextStyleWhite,
          controller: controller,
          onChanged: (v) {
            if (onChange != null) onChange!(v);
          },
          keyboardType: type,
          obscureText: isObscureText ?? false,
          decoration: InputDecoration(
            isDense: true,
            border: InputBorder.none,
            suffixIcon: suffixIcon ?? suffixPassIcon,
            enabled: enabled,
            errorText: error,
            contentPadding: const EdgeInsets.only(left: 8, top: 8, right: 8, bottom: 0),
            labelText: hint,
            labelStyle: constants.Styles.textFieldLabelLightGreyStyle,
          ),
        ),
      ),
    );
  }

Upvotes: 0

Views: 916

Answers (1)

Nijat Namazzade
Nijat Namazzade

Reputation: 742

This is kind of proposal that came from one developer on this issue: https://github.com/flutter/flutter/issues/62963 . Briefly, the solution says that this feature doesn't exist so you can use the hint text property for that, but if you want your actual text to look like the same, you can create your own text field.

Upvotes: 1

Related Questions