Flutter UI #79: Fun with Grafpix in Flutter


Flutter UI #79: Fun with Grafpix in Flutter

Tutorial and code of Grafpix in Flutter. Copy and paste the below code as per your requirements.

grafpix: ^1.2.8

import 'package:flutter/material.dart';
import 'package:grafpix/icons.dart';
import 'package:grafpix/pixloaders/pix_loader.dart';
import 'package:grafpix/pixbuttons/radial.dart';
import 'package:grafpix/pixbuttons/medal.dart';
void main() =>
    runApp(const MaterialApp(debugShowCheckedModeBanner: false, home: Example()));

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

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title:const Center(child: Text("Grafpix"),)),
      backgroundColor: Colors.grey[900],
      body: FutureBuilder(
          future: waitForFuture(),
          builder: (context, snapshot) {
            if (snapshot.hasData) {
              return Container(
                  alignment: Alignment.center,
                  child: Column(mainAxisSize: MainAxisSize.min, children: [
                    PixButton(
                        radius: 70.0,
                        icon: PixIcon.airplane, //PixIcon
                        iconSize: 50.0,
                        iconColor: Colors.white,
                        backgroundColor: Colors.blue,
                        shutter: 0.6,
                        twinkles: true,
                        onPress: () {
                          print('PixButton Pressed');
                        }),
                    const SizedBox(height: 200.0),
                    const PixMedal(
                      icon: PixIcon.bicycle,
                      medalType: MedalType.Gold,
                      radius: 70.0,
                      iconSize: 60.0,
                    )
                  ]));
            } else {
              return PixLoader(
                  loaderType: LoaderType.Flashing, faceColor: Colors.white70);
            }
          }),
    );
  }
}
Future waitForFuture() async {
  await Future.delayed(const Duration(seconds: 5));
  return true;
}

Leave a Reply

Your email address will not be published.