gliph_ui 1.3.0 copy "gliph_ui: ^1.3.0" to clipboard
gliph_ui: ^1.3.0 copied to clipboard

A premium suite of highly-customizable UI components for Flutter, starting with iOS-style 3D scroll pickers.

example/lib/main.dart

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

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Gliph UI Example',
      theme: ThemeData(
        brightness: Brightness.dark,
        useMaterial3: true,
      ),
      home: const NavbarShowcase(),
    );
  }
}

class NavbarShowcase extends StatefulWidget {
  const NavbarShowcase({super.key});

  @override
  State<NavbarShowcase> createState() => _NavbarShowcaseState();
}

class _NavbarShowcaseState extends State<NavbarShowcase> {
  String _activeTab = 'home';
  NavbarVariant _variant = NavbarVariant.floating;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xFF050505),
      appBar: AppBar(
        title: const Text('Gliph Navbar'),
        backgroundColor: Colors.transparent,
        elevation: 0,
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Text(
              'Active Tab: ${_activeTab.toUpperCase()}',
              style: const TextStyle(color: Colors.white, fontSize: 24, fontWeight: FontWeight.bold),
            ),
            const SizedBox(height: 40),
            Wrap(
              gap: 10,
              children: NavbarVariant.values.map((v) {
                return ChoiceChip(
                  label: Text(v.name.toUpperCase()),
                  selected: _variant == v,
                  onSelected: (selected) {
                    if (selected) setState(() => _variant = v);
                  },
                );
              }).toList(),
            ),
          ],
        ),
      ),
      bottomNavigationBar: Navbar(
        variant: _variant,
        activeTab: _activeTab,
        onTabChange: (id) => setState(() => _activeTab = id),
        actionButton: _variant == NavbarVariant.floating ? ActionButtonObj(
          icon: (c, s) => Icon(Icons.add, color: c, size: s),
          onPress: () => debugPrint('Action Pressed'),
          color: Colors.indigoAccent,
        ) : null,
        tabs: [
          NavbarTab(
            id: 'home',
            label: 'Home',
            icon: (c, s) => Icon(Icons.home_outlined, color: c, size: s),
            activeIcon: (c, s) => Icon(Icons.home, color: c, size: s),
          ),
          NavbarTab(
            id: 'search',
            label: 'Search',
            icon: (c, s) => Icon(Icons.search_outlined, color: c, size: s),
            activeIcon: (c, s) => Icon(Icons.search, color: c, size: s),
          ),
          NavbarTab(
            id: 'profile',
            label: 'Profile',
            icon: (c, s) => Icon(Icons.person_outline, color: c, size: s),
            activeIcon: (c, s) => Icon(Icons.person, color: c, size: s),
          ),
        ],
      ),
    );
  }
}
2
likes
120
points
45
downloads

Documentation

API reference

Publisher

unverified uploader

Weekly Downloads

A premium suite of highly-customizable UI components for Flutter, starting with iOS-style 3D scroll pickers.

License

unknown (license)

Dependencies

flutter

More

Packages that depend on gliph_ui