RaisedButton Widget

RaisedButton is a material design button that is elevated above the surface of the screen. It has a rectangular shape with rounded corners, and can be customized with a variety of properties to change its appearance and behavior.

The constructor for RaisedButton takes several required and optional parameters. The required parameters are child and onPressed. The child parameter is used to specify the widget that will be displayed inside the button. This can be any widget, such as Text, Icon, or Image. The onPressed parameter is a callback function that is called when the button is pressed.

Optional parameters for RaisedButton include color, textColor, disabledColor, disabledTextColor, padding, shape, clipBehavior, elevation, focusElevation, hoverElevation, and highlightElevation. These parameters can be used to change the appearance and behavior of the button in various ways, such as changing its background color, text color, padding, and elevation.

Here is an example of using RaisedButton with a Text widget as its child and a callback function for onPressed:

RaisedButton(
  child: Text('Click me!'),
  onPressed: () {
    // Callback function for button press
    print('Button pressed!');
  },
);

This creates a simple raised button with the text “Click me!” displayed inside it. When the button is pressed, the callback function prints a message to the console.

Overall, RaisedButton is a versatile and customizable widget that is commonly used in Flutter apps for user interaction.

Example with optional parameters

Here’s an example of a RaisedButton widget that includes all the optional parameters:

RaisedButton(
  onPressed: () {
    // do something
  },
  child: Text('Click me!'),
  color: Colors.blue,
  textColor: Colors.white,
  disabledColor: Colors.grey,
  disabledTextColor: Colors.black,
  padding: EdgeInsets.all(10),
  shape: RoundedRectangleBorder(
    borderRadius: BorderRadius.circular(20),
    side: BorderSide(color: Colors.black)
  ),
  elevation: 5,
  splashColor: Colors.green,
  highlightColor: Colors.yellow,
  clipBehavior: Clip.hardEdge,
),

In this example, we set the onPressed property to a function that will be executed when the button is pressed. We also set the child property to a Text widget that will be displayed on the button.

The optional properties include color, textColor, disabledColor, disabledTextColor, padding, shape, elevation, splashColor, highlightColor, and clipBehavior.

The color property sets the background color of the button, while textColor sets the color of the text. If the button is disabled, disabledColor and disabledTextColor will be used instead.

padding sets the amount of padding around the child widget, and shape defines the shape of the button. We used RoundedRectangleBorder with a circular border radius and a black border.

elevation sets the elevation of the button, while splashColor and highlightColor are used to change the color of the splash and highlight effects respectively. clipBehavior defines the clip behavior when the widget is clipped. In this case, we set it to Clip.hardEdge so that the widget’s corners are not rounded.