Giter Club home page Giter Club logo

skalertdialog's Introduction

SKAlertDialog

  A highly customizable, powerful and easy-to-use alert dialog for Flutter.   Flutter pub package

GIF

Screenshots

SKAlertDialog Basic Alert Alert with buttons Alert with custom buttons
Login Form Checkbox Radio button Custom Dialog

💻 Installation

You just need to add sk_alert_dialog as a dependency in your pubspec.yaml file.

dependencies:
sk_alert_dialog: ^1.0.0

Usage

Import this class

import 'package:sk_alert_dialog/sk_alert_dialog.dart';

Simple Alert

     SKAlertDialog.show(
        context: context,
        type: SKAlertType.info,
        title: 'Simple Alert',
        message: 'Hi! Welcome to SKALertDialog',
        onOkBtnTap: (value) {
          print('Okay Button Tapped');
        },
      );

Alert with buttons

    SKAlertDialog.show(
        context: context,
        type: SKAlertType.buttons,
        title: 'Alert with buttons',
        message: 'Shall we move to next alert?',
        onOkBtnTap: (value) {
          print('Okay Button Tapped');
        },
        onCancelBtnTap: (value) {
          print('Cancel Button Tapped');
        },
      );

Alert with custom buttons

   SKAlertDialog.show(
        context: context,
        type: SKAlertType.buttons,
        title: 'Alert with custom buttons',
        message: 'Do you like this package?',
        okBtnText: 'YES',
        okBtnTxtColor: Colors.white,
        okBtnColor: const Color(0xFF3BD459),
        cancelBtnText: 'NO',
        cancelBtnTxtColor: Colors.white,
        cancelBtnColor: const Color(0xFFFF4954),
        onOkBtnTap: (value) {
          print('Okay Button Tapped');
        },
        onCancelBtnTap: (value) {
          print('Cancel Button Tapped');
        },
      );

Login Form

  SKAlertDialog.show(
        context: context,
        type: SKAlertType.loginform,
        title: 'Login Form',
        okBtnText: 'LOGIN',
        onOkBtnTap: (value) {
          print('Okay Button Tapped');
        },
        onCancelBtnTap: (value) {
          print('Cancel Button Tapped');
        },
        onEmailTextFieldChanged: (value) {
          print('On Email Text Changed $value');
        },
        onPasswordTextFieldChanged: (value) {
          print('On Password Text Changed $value');
        },
      );

Checkbox

    SKAlertDialog.show(
        context: context,
        type: SKAlertType.checkbox,
        checkBoxAry: {'Choice One': true, 'Choice Two': false, 'Choice Three': true, 'Choice Four': false, 'Choice Five': false},
        title: 'Checkbox',
        onCancelBtnTap: (value) {
          print('Cancel Button Tapped');
        },
        onCheckBoxSelection: (value) {
          print('onCheckBoxSelection $value');
        },
      );

Radio button

    SKAlertDialog.show(
        context: context,
        type: SKAlertType.radiobutton,
        radioButtonAry: {'Choice One': 1, 'Choice Two': 2, 'Choice Three': 3, 'Choice Four': 4, 'Choice Five': 5},
        title: UtilsImporter().stringUtils.radio_button_alert_title,
        onCancelBtnTap: (value) {
          print('Cancel Button Tapped');
        },
        onRadioButtonSelection: (value) {
          print('onRadioButtonSelection $value');
        },
      );

Custom Dialog

    SKAlertDialog.show(
        context: context,
        type: SKAlertType.custom,
        customWidget: customWidget(),
      );

Create the custom widget

  Widget customWidget() { 
     return new Padding(
        padding: EdgeInsets.only(left: 20, right: 20, top: 20, bottom: 20),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            Text(
              'Thank you for reviewing the package',
              style: TextStyle(
                  fontWeight: FontWeight.w400,
                  color: Theme.of(context).primaryColorDark.withOpacity(0.7),
                  fontSize: 20),
            ),
            SizedBox(height: 20),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                FlatButton(
                  color: const Color(0xFF50A1FF),
                  onPressed: () {
                    Navigator.of(context).pop();
                  },
                  child: Text(
                    'The End !',
                    style: TextStyle(
                        fontWeight: FontWeight.w700,
                        color: Colors.white,
                        fontSize: 20),
                  ),
                )
              ],
            ),
          ],
        ));
  }

skalertdialog's People

Contributors

senthilece01 avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

skalertdialog's Issues

How to dismiss the dialog?

I am using the SKAlertType.buttons with Ok and cancel buttons in my app. Clicking the cancel button should dismiss the dialog but instead the app screen is taken off the stack. I am using Navigator.of(context).pop(). Is there any other way to do the same?

package requires google font 1.0.0

Hi,
Before flutter 2 I used your package and was working well.
now with Flutter 2 I have following error:

              Because every version of sk_alert_dialog depends on google_fonts ^1.1.0 which depends on http ^0.12.0+2, every 
             version of sk_alert_dialog requires http ^0.12.0+2.

when I add google_font 1.1.0 :

             Because google_fonts <2.0.0-nullsafety.0 depends on http ^0.12.0+2 and tasneem_app depends on http ^0.13.3, 
             google_fonts <2.0.0-nullsafety.0 is forbidden.

google_map_places requires http 0.13.1 at least ..I need the google places .
If I upgrade google_map 2.1.0 m I get this error :

         Because every version of sk_alert_dialog depends on google_fonts ^1.1.0 and tasneem_app depends on google_fonts 
         ^2.1.0, sk_alert_dialog is forbidden.

Why not upgrade sk_alert to use google_font 2.1.0 ?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.