Skip to content
This repository has been archived by the owner on Jan 13, 2023. It is now read-only.

kryptogo/kg-kit-flutter

Folders and files

NameName
Last commit message
Last commit date

Latest commit

b386e30 · Jan 10, 2023

History

22 Commits
Jan 10, 2023
Dec 13, 2022
Jan 10, 2023
Jan 10, 2023
Dec 13, 2022
Jan 10, 2023
Jan 10, 2023
Dec 14, 2022
Dec 13, 2022
Dec 13, 2022
Dec 13, 2022
Dec 20, 2022
Dec 13, 2022
Jan 10, 2023

Repository files navigation

A Flutter UI Kit from KyrptoGO

Getting started

# add this line to your dependencies
kg_kit: 'version'
import 'package:kg_kit/kg_kit.dart';

Usage

  1. Wrap your root widget with KgKit for inject stateMange
void main() {
  runApp(const KgKit(child: MyApp()));
}
  1. Replace MaterialApp with KgMaterialApp
@override
  Widget build(BuildContext context) {
    return const KgMaterialApp(
      title: 'Flutter Demo',
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }

set dark mode

You can easily change to dark mode by calling setThemeMode

ThemeMode {
  system,
  light,
  dark,
}

KgKit.of(context).setThemeMode(ThemeMode);

set fonts

you can add .ttf file under lib/fonts. And add following code in your flutter directory pubspec.yaml

fonts:
  - family: awesomeFont
    fonts:
      - asset: packages/kg_kit/fonts/awesomeFont-Light.ttf
      - asset: packages/kg_kit/fonts/awesomeFont-Medium.ttf
        weight: 500
      - asset: packages/kg_kit/fonts/awesomeFont-Bold.ttf
        weight: 700

Then set FontFamily

KgKit.of(context).setFontFamily('awesomeFont');

set theme data

If you want customize your themeData. You can use setThemeData to override your own themeData.

KgKit.of(context).setThemeData(ThemeData);

Or you can load JsonFile using set

KgKit.of(context).setThemeData(JsonData);
// Theme JsonData example
{
    "innerGapValue": 8,
    "borderRadiusValue": 8,
    "paddingValue": 10,
    "primaryValue": 0xFF11A8FF,
    "primaryDarkValue": 0xFF3FB9FF,
    "primaryContainerValue": 0xFFFFFFFF,
    "primaryContainerDarkValue": 0xFF2E2E2E,
    "secondaryValue": 0xFF0B42A8,
    "secondaryDarkValue": 0xFF384DFF,
    "secondaryContainerValue": 0xFFFFD270,
    "tertiaryValue": 0xFF5C5C95,
    "tertiaryContainerValue": 0xFFC8DBF8,
    "backgroundValue": 0xFFF3F0EA,
    "backgroundDarkValue": 0xFF191919,
    "textColorValue": 0xFF001F58,
    "textColorDarkValue": 0xFFFFFFFF,
  };