pub package
pub points

Flutter社交按钮

Flutter社交按钮是一个flutter包，可以轻松地为任何flutter应用创建社交媒体登录按钮。

截图

#移动视图

Image

#Web视图

Image

入门

用法

将依赖项添加到pubspec.yaml文件中。

dart
  dependencies:
    flutter:
      sdk: flutter
    flutter_social_button: any

按钮类型

  • Facebook
  • Google
  • Twitter
  • 领英
  • WhatsApp
  • Apple
  • Github
  • 电话

示例

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);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Social Buttons',
      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: [
              SocialButton.appleButton(onTap: (){}),
              const SizedBox(height: 2,),
              SocialButton.facebookButton(onTap: (){}),
              const SizedBox(height: 2,),
              SocialButton.googleButton(onTap: (){}),
              const SizedBox(height: 2,),
              SocialButton.linkedinButton(onTap: (){}),
              const SizedBox(height: 2,),
              SocialButton.twitterButton(onTap: (){}),
              const SizedBox(height: 2,),
              SocialButton.whatsappButton(onTap: (){}),
              const SizedBox(height: 2,),
              SocialButton.githubButton(onTap: (){}),
              const SizedBox(height: 2,),
              SocialButton.phoneButton(onTap: (){}),

              const Divider(color: Colors.black, thickness: 2.5,),

              Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  SocialButton.appleButtonCircle(onTap: (){}),
                  SocialButton.facebookButtonCircle(onTap: (){}),
                  SocialButton.googleButtonCircle(onTap: (){}),
                  SocialButton.twitterButtonCircle(onTap: (){}),
                  SocialButton.linkedinButtonCircle(onTap: (){}),
                  SocialButton.whatsappButtonCircle(onTap: (){}),
                  SocialButton.githubButtonCircle(onTap: (){}),
                  SocialButton.phoneButtonCircle(onTap: (){}),
                ],
              )
            ],
          ),
        ),
      ),
    );
  }
}

贡献

欢迎 Pull requests。对于重大更改，请先打开一个 issue 来讨论您想进行的更改。

GitHub

查看 Github