搜尋套件、儲存庫與 APP 分類

flutter_social_button 封面
套件詳情v1.1.6+1

flutter_social_button

Flutter 社交按鈕是用於在任何 Flutter 應用程式中輕鬆建立社交媒體登入按鈕的 Flutter 套件。

AndroidiOSWebmacOSWindowsLinux
近 30 天下載
68
喜歡數
41
Pub 分數
140

安裝套件

flutter pub add flutter_social_button

套件介紹

根據套件公開資料產生的選型評估,僅供參考。

Flutter 社交按鈕是一個輕量級套件,可簡化在 Flutter 應用中整合社群媒體登入按鈕的過程。它為 Google、Facebook 和 Apple 等熱門平台提供預設計且可自訂的按鈕,從而提升使用者驗證流程。該套件支援 Android、iOS、Web、macOS、Windows 和 Linux 等多個平台,確保跨平台的一致性。透過最少的設定,開發者可快速為其應用新增視覺吸引力強的社交登入選項。

適用情境

  • 向認證螢幕添加社交登入按鈕
  • 透過快速登入選項提升使用者入門體驗
  • 在多個平台上創建一致的使用者介面
  • 整合 Google、Facebook 和 Apple 登入
  • 自訂按鈕樣式以實現品牌一致性

主要特色

  • 預建構的社群媒體按鈕範本
  • 跨平台支援(Android、iOS、Web、macOS、Windows、Linux)
  • 輕鬆自訂顏色和大小
  • 透過 pub.dev 的簡單整合
  • 支援主要社交平台

適合對象

  • Flutter 開發人員建構驗證流程
  • 需要快速社交登入的應用
  • 致力於實現跨平台一致使用者介面的專案
  • 注重開發速度的團隊
  • 注重設計的應用程式

使用建議

  • 每個社交提供者都需要額外設定
  • 可能需要特定平台的設定(例如,OAuth 金鑰)
  • 除非擴展,否則僅限預定義按鈕設計
  • 依賴外部社交API實現功能
  • 不適合用於超出樣式的自訂按鈕邏輯

原始 README

以下為關聯原始碼儲存庫的 README 原文快照,最新內容請造訪原始碼儲存庫。

Flutter Social Button

Flutter Social Button

pub package pub points LinkedIn Instagram Facebook Youtube


Features

Flutter Social Button is a Flutter package to easily add social media buttons to your app. Buttons are customizable, and the package supports a wide range of social platforms.


Getting Started

Add the following dependency to your pubspec.yaml file:

dependencies:
  flutter:
    sdk: flutter
  flutter_social_button: ^latest_version

Usage Example

import flutter_social_button.dart


import 'package:flutter_social_button/flutter_social_button.dart';

For built-in buttons.


// for full width Buttons

            //For default Button Its return a Email Button
               FlutterSocialButton(
                   onTap: () {}, ), 
                   
            //For facebook Button   
            
             FlutterSocialButton(
                onTap: () {},
                buttonType: ButtonType.facebook, // Button type for different type buttons
              ),
              
          //For google Button
          
               FlutterSocialButton(
                onTap: () {},
                buttonType: ButtonType.google, // Button type for different type buttons
                iconColor: Colors.black,  // for change icons colors
              ),  

           // for Mini Circle Button

                 FlutterSocialButton(
                    onTap: () {},
                    mini: true,   //just pass true for mini circle buttons
                    buttonType: ButtonType.phone,  // Button type for different type buttons
                  ),

Button Types

  • Facebook
  • Google
  • Yahoo
  • Twitter
  • LinkedIn
  • WhatsApp
  • Apple
  • GitHub
  • Phone
  • Email
  • Instagram
  • YouTube
  • Snapchat
  • Pinterest
  • TikTok
  • Reddit
  • Tumblr
  • Skype
  • Viber
  • Discord
  • WeChat
  • Line
  • Quora
  • Twitch
  • Flickr
  • Yelp
  • Spotify

Example

import 'package:flutter/material.dart';
import 'package:flutter_social_button/flutter_social_button.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const HomePage(),
    );
  }
}

class HomePage extends StatelessWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Social Buttons"),
        centerTitle: true,
      ),
      body: Center(
        child: SingleChildScrollView(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              //For default Button
              FlutterSocialButton(
                onTap: () {},
              ),
              const SizedBox(
                height: 2,
              ),

              //For facebook Button
              FlutterSocialButton(
                onTap: () {},
                buttonType: ButtonType.facebook,
              ),
              const SizedBox(
                height: 2,
              ),

              //For google Button
              FlutterSocialButton(
                onTap: () {},
                buttonType: ButtonType.google,
              ),
              const SizedBox(
                height: 2,
              ),

              //For phone Button
              FlutterSocialButton(
                onTap: () {},
                buttonType: ButtonType.phone,
              ),

              const SizedBox(
                height: 2,
              ),

              //For Whatsapp Button
              FlutterSocialButton(
                onTap: () {},
                buttonType: ButtonType.whatsapp,
              ),
              const SizedBox(
                height: 2,
              ),

              const Divider(
                color: Colors.black,
                thickness: 2.5,
              ),
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  FlutterSocialButton(
                    onTap: () {},
                    mini: true,
                  ),
                  FlutterSocialButton(
                    onTap: () {},
                    mini: true,
                    buttonType: ButtonType.facebook,
                  ),
                  FlutterSocialButton(
                    onTap: () {},
                    mini: true,
                    buttonType: ButtonType.google,
                  ),
                  FlutterSocialButton(
                    onTap: () {},
                    mini: true,
                    buttonType: ButtonType.phone,
                  ),
                ],
              )
            ],
          ),
        ),
      ),
    );
  }
}

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

所屬分類

依賴

依賴清單 1 項

原始碼儲存庫

使用此套件的專案

暫無相關資料。