auth_buttons

Pub Version

Auth Buttons is a flutter widget library, include buttons for authenticating with the most popular social networks like: Google, Facebook, Apple and too other.

Installation

  1. Add this to your packages pubspec.yaml file:
dependencies:
  auth_buttons: ^1.0.0
  1. Install it You can install it from the command line:
$ flutter pub get
  1. Import it Now in Dart code, you can use:
import 'package:auth_buttons/auth_buttons.dart';

Recommendation

We recommend you to using show special when you want use some button. show help you importing part of library.

import 'package:auth_buttons/auth_buttons.dart'
    show GoogleAuthButton, AuthButtonStyle;

We also recommend you to using the latest version.

Overview

New new icons available.

There are three style you can choose between them:

  1. Default
  2. Icon
  3. Secondary

Using

You need to use just the following code:

Default style

GoogleAuthButton(
  onPressed: () {},
  darkMode: false, // if true second example
),
LightDark
GoogleAuthButton(
  onPressed: () {},
  darkMode: false,
  iconStyle: AuthIconStyle.outlined,
),
LightDark
GoogleAuthButton(
  onPressed: () {},
  darkMode: false,
  iconStyle: AuthIconStyle.secondary,
),
LightDark

Icon Style

GoogleAuthButton(
  onPressed: () {},
  darkMode: false,
  style: AuthButtonStyle.icon,
),
LightDark
GoogleAuthButton(
  onPressed: () {},
  darkMode: false,
  style: AuthButtonStyle.icon,
  iconStyle: AuthIconStyle.outlined,
),
LightDark
GoogleAuthButton(
  onPressed: () {},
  darkMode: false,
  style: AuthButtonStyle.icon,
  iconStyle: AuthIconStyle.secondary,
),
LightDark

Secondary Style

GoogleAuthButton(
  onPressed: () {},
  darkMode: false,
  style: AuthButtonStyle.secondary,
  iconStyle: AuthIconStyle.secondary,
),
LightDark
GoogleAuthButton(
  onPressed: () {},
  darkMode: false,
  style: AuthButtonStyle.secondary,
  iconStyle: AuthIconStyle.outlined,
),
LightDark
GoogleAuthButton(
  onPressed: () {},
  darkMode: false,
  style: AuthButtonStyle.secondary,
  iconStyle: AuthIconStyle.secondary,
),
LightDark

Do same think with the other buttons, when you want customize any button you can do it just passing a property which you want.

Full property you can passing:

GoogleAuthButton(
  key: ValueKey(''),
  onPressed: () {},
  onLongPressed: (){},
  darkMode: false,
  rtl: false,
  buttonColor: Colors.white,
  splashColor: Colors.grey,
  shadowColor: Colors.teal,
  borderColor: Colors.red,
  borderRadius: 8.0,
  borderWidth: 2.0,
  elevation: 2.0,
  width: 280.0,
  height: 50.0,
  separator: 10.0,
  iconSize: 35.0,
  iconBackground: Colors.transparent,
  iconStyle: AuthIconStyle.outlined,
  style: AuthButtonStyle.secondary,
  padding: EdgeInsets.all(8.0),
  text: 'Sign in with Google',
  textStyle: TextStyle(
    color: Colors.black,
    fontSize: 18,
    fontWeight: FontWeight.bold,
    letterSpacing: 0.50,
  ),
),

return up

Libraries

apple_auth_button
auth_button
auth_buttons
auth_colors
auth_icons
auth_style
button_contents
custom_auth_button
email_auth_button
facebook_auth_button
github_auth_button
google_auth_button
huawei_auth_button
microsoft_auth_button
shared_button
twitter_auth_button