How To Set Flutter Elevated Button Disabled [Flutter Easy Guide]

In this tutorial, we’ll learn how to properly implement Flutter elevated button disabled by using a practical Flutter code example.

Outline

1. Introduction: Flutter Elevated Button Disabled
2. Default Flutter Elevated Button
3. Implementing Flutter Elevated Button Disabled
4. Flutter Elevated Button Disabled Source Code
5. Conclusion

Introduction: Flutter Elevated Button Disabled

As the name suggests, it specifies the process of disabling the Flutter elevated button which means that when the user clicks on it, it shouldn’t perform any function.

So let’s see how to disable Flutter elevated button with the help of an easy Flutter code example.

Default Flutter Elevated Button

ElevatedButton(
              onPressed: () {},
                  child: Text(
                      'Default Flutter Elevated Button',
                    ))

Implementing Flutter Elevated Button Disabled

For that, we’ve to use the onPressed constructor of elevated button widget which takes a function and in that we can define actions which will get triggered when this button is clicked.

To make the Flutter elevated button disabled, we just have to pass null to this onPressed constructor instead of a function. See the below code:

ElevatedButton(
           onPressed: null,
              child: Text(
                'Flutter Elevated Button Is Disabled',
                    ))

import 'package:flutter/material.dart';
void main() {
  runApp(const MyApp());
}
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Homepage(),
    );
  }
}
class Homepage extends StatefulWidget {
  @override
  State<Homepage> createState() => _HomepageState();
}
class _HomepageState extends State<Homepage> {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
        child: Scaffold(
            body: Center(
                child: ElevatedButton(
                    onPressed: null,
                    child: Text(
                      'Flutter Elevated Button Is Disabled',
                    )))));
  }
}