Decennium Sprint — quick start¶
Fastest path to using khflutterlib in your own sprint app. If you hit
something this doesn't cover, see the full
Getting started guide instead — this page is
deliberately the short version.
1. Add the dependency¶
khflutterlib isn't on pub.dev — it's a private monorepo, so you pull
packages in via git dependency. Pin every package to the same
release tag, never a branch, so you don't get surprised by in-progress
changes mid-sprint (mixing tags makes flutter pub get fail):
dependencies:
flutter:
sdk: flutter
kh_core:
git:
url: https://github.com/msflib/flutter.git
path: packages/kh_core
ref: khflutterlib-v0.4.3
kh_theme:
git:
url: https://github.com/msflib/flutter.git
path: packages/kh_theme
ref: khflutterlib-v0.4.3
kh_ui:
git:
url: https://github.com/msflib/flutter.git
path: packages/kh_ui
ref: khflutterlib-v0.4.3
kh_screens:
git:
url: https://github.com/msflib/flutter.git
path: packages/kh_screens
ref: khflutterlib-v0.4.3
kh_utils:
git:
url: https://github.com/msflib/flutter.git
path: packages/kh_utils
ref: khflutterlib-v0.4.3
Only add the packages you actually use — kh_core/kh_theme/kh_ui cover
most needs; kh_screens adds ready-made splash/onboarding/login screens;
kh_utils adds form validators, date/currency formatters, and a leveled
logger — genuinely useful in almost any app, worth adding by default.
To upgrade later, change every ref to the newer release tag together;
the release train page lists the releases.
Then run:
2. One thing that's easy to miss¶
Add this to your own app's pubspec.yaml (under flutter:):
Skip this and every default icon (KhButton, KhTextField, KhBadge,
KhEmptyState/KhErrorState) renders as a garbled glyph — kh_ui
declaring it doesn't bundle the font for your app, only your own
declaration does, and Flutter only warns instead of failing loudly.
3. Minimal app¶
import 'package:flutter/material.dart';
import 'package:kh_theme/kh_theme.dart';
import 'package:kh_ui/kh_ui.dart';
void main() => runApp(const MyApp());
class MyApp extends StatelessWidget {
const MyApp({super.key});
@override
Widget build(BuildContext context) {
return MaterialApp(
theme: KhTheme.light(),
darkTheme: KhTheme.dark(),
home: Scaffold(
appBar: AppBar(title: const Text('My sprint app')),
// Builder gives the button a context *below* MaterialApp, which
// KhSnackbar.show needs to find a ScaffoldMessenger. The build
// method's own context sits above MaterialApp and would throw.
body: Builder(
builder: (context) => Center(
child: KhButton.primary(
onPressed: () =>
KhSnackbar.show(context, content: const Text('Hi!')),
child: const Text('Say hi'),
),
),
),
),
);
}
}
4. What's in the box¶
kh_core, kh_theme, kh_ui, kh_screens, and kh_utils are built;
everything else in the root README.md's package table is still
planned — don't depend on packages that aren't listed above, they
don't exist yet.
Each package page lists exactly what it exports:
- kh_ui: buttons, text fields, cards, dialogs, chips/badges, dropdowns, date pickers, bottom sheets, snackbars, bottom nav, nav drawer, and more.
- kh_screens: splash screen, onboarding flow, login form.
- kh_utils:
KhValidators(form validation),KhFormatters(date/currency/number/phone formatting),KhPhoneRegion(country-aware phone numbers),KhLogger(leveled logging).
Prefer to start from a working app? The starter app has the theme, a splash and both navigation shells already wired up.
Or run the component gallery yourself to see everything live (needs a clone of this repo, not just the git dependency):
git clone https://github.com/msflib/flutter.git khflutterlib
cd khflutterlib && melos bootstrap
cd packages/example && flutter run
Stuck?¶
Full contributor-facing guide, troubleshooting, and the "why" behind all of this: Getting started.