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

  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: [
                        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.