Custom Alert Dialog in Flutter


Here is the simple program for Custom AlertDialog in Flutter.


Source Code

import 'package:flutter/material.dart';

void main(){
  runApp(MaterialApp(
    title: "Simple Alert",
    home: MyApp(),
  ));
}

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Simple Custom Alert"),),
      body: Center(
        child: RaisedButton(
          child: Text("Click Me",style: TextStyle(color: Colors.white),),
          color: Colors.red,
          onPressed: (){
            String title="Test Message";
            String message="Welcome to Tutor Joes Computer Education";
            showAlertDialog(context, title,message);
          },
        ),
      ),
    );
  }
}

showAlertDialog(BuildContext context,String title,String message)
{
  //Set Button
  Widget okbtn=FlatButton(
    child: Text("Ok",style: TextStyle(color: Colors.white)),
    color: Colors.orange,
    onPressed: (){

    },
  );
//Set Button
  Widget cancelbtn=FlatButton(
    child: Text("Cancel",style: TextStyle(color: Colors.white)),
    color: Colors.red,
    onPressed: (){

    },
  );

  AlertDialog alert=AlertDialog(
    title: Text(title,style: TextStyle(color: Colors.orange),),
    content: Text(message),
    actions: [
      okbtn,
      cancelbtn,
    ],
  );

  showDialog(context: context,
  builder: (BuildContext context){
    return alert;
  }
  );
}
To download raw file Click Here