Nimrod Shai
Nimrod Shai

Reputation: 1179

Using a textfield as a button

I'm trying to use a textfield as a button so when someone taps it, it takes him to a different page. I've tried disabling the textfield but then I cannot use the onTap property. But if the textfield is not disabled, when I click it, it gets editing focus and this is something I don't want.

Can anyone help what's the easiest way this could be done?

Thanks

Upvotes: 0

Views: 1060

Answers (4)

Can
Can

Reputation: 1876

TextField(
  readOnly: true,
  onTap: () {
    // Do something
  },
);

Upvotes: 4

Lukas
Lukas

Reputation: 510

you can wrap it with an InkWell, see below:

InkWell(
  onTap: () {

  },
  child: Container(
    padding: EdgeInsets.all(4.0),
    child: Text('Click me'),
  ),
);

Upvotes: 1

Tinus Jackson
Tinus Jackson

Reputation: 3653

you can try the following.

GestureDetector(
  onTap: () {
   // redirect // nav to different screen
  },
  child: TextField(
    enabled: false
    ),
)

References

Upvotes: 0

Thor
Thor

Reputation: 559

You can use a Flatbutton instead. Just put this in your code:

FlatButton(
  onPressed: () {
    /*...*/
  },
  child: Text(
    "Clickable text!",
  ),
)

Or else use a GestureDetector:

GestureDetector(
  OnTap: () {...},
    child: TextField(
     // Text...
  ),
);

Upvotes: 1

Related Questions