auth_button_kit 0.9.7
auth_button_kit: ^0.9.7 copied to clipboard
Awesome buttons custamisable that build you a beautiful authentication page in just a few clicks
AuthButtonKit
A Flutter Package to easily create beautiful auth buttons
Specially designed for IOS/Android
import 'package:auth_button_kit/auth_button_kit.dart';
// for a single button
AuthButton(
onPressed: (method) => print('you pressed $method'),
brand: Method.facebook,
),
// for a group of buttons
AuthMultiButtons(
onPressed: (method) => print('you pressed $method'),
brands: [Method.google, Method.apple],
),
Usages #
You have two ways to use this package (like the example above):
- AuthButton: A single button
- AuthMultiButtons: A group of buttons
Customization #
You can customize the buttons with the following properties:
| Property | Type | Description |
|---|---|---|
| onPressed | Function(Method) | The function called when the button is pressed, the brand (ex: Method.google) is passed as a parameter |
| brand | Method | The brand of the button (ex: Method.google), you can use a list of brands for AuthMultiButtons |
| text | String | The text of the button, you can use {brand} to display the brand name |
| backgroundColor | Color | The background color of the button |
| borderColor | Color | The border color of the button |
| textColor | Color | The text color of the button, adapts to contrast with background by default |
| fontFamily | String | The font family of the button |
| fontWeight | FontWeight | The font weight of the button |
| showLoader | bool | Show a loader when you want |
| loaderColor | Color | The color of the loader, adapts to contrast with background by default |
| splashEffect | bool | Show a splash effect when the button is pressed, does not work with a dark background |
| customImage | Image | Change the default logo of the button, works only with AuthButton and Method.custom |
Supported brands (to use like Method.brand) #
- Apple
- Custom (you can use your own logo)
- Discord
- Dribbble
- Github
- Medium
- Microsoft
- Spotify
- Tiktok
