Flutter TextButton.icon

The TextButton.icon is a flutter widget that combines the functionality of the TextButton and Icon widgets into a single widget. It allows you to create a button with a text label and an icon that can be pressed to trigger an action.

Usage

To use the TextButton.icon widget, you need to import the material package.

import 'package:flutter/material.dart';

Once the package is imported, you can use the TextButton.icon widget as shown below:

TextButton.icon(
  onPressed: () {
    // action to perform when the button is pressed
  },
  icon: Icon(Icons.add),
  label: Text('Add Item'),
)

The onPressed property specifies the action to perform when the button is pressed. In the example above, we have left it empty but you can replace it with code that will execute when the button is pressed.

The icon property specifies the icon to display on the button. We have used the add icon in the example above but you can use any other icon that is available in the Icons class.

The label property specifies the text to display on the button. You can use any text that you want to display.

Customization

The TextButton.icon widget can be customized in various ways by using the properties available in the widget. Some of the properties that you can customize include:

• style: Specifies the style to use for the button. You can customize the background color, text color, font size, etc. by specifying a ButtonStyle object.
• onLongPress: Specifies the action to perform when the button is long pressed.
• focusNode: Specifies the focus node to use for the button.
• autofocus: Specifies whether the button should be focused when the widget is first displayed.

Conclusion

In conclusion, the TextButton.icon widget is a powerful widget that allows you to create buttons with text labels and icons in a single widget. It is easy to use and can be customized to suit your needs.