kloktun_uikit 0.0.5

kloktun_uikit: ^0.0.5 copied to clipboard

example/lib/main.dart

import 'package:example/tabs.dart';
import 'package:flutter/material.dart' hide ButtonThemeData;
import 'package:kloktun_uikit/common/controls.dart';
import 'package:kloktun_uikit/components/radio/radio_group.dart';
import 'package:kloktun_uikit/components/theme/theme.dart';
import 'package:kloktun_uikit/kloktun_uikit.dart';

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

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

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return KloktunUIProvider(
      child: KloktunUIConsumer(builder: (context, state) {
        return MaterialApp(
          title: 'Flutter Demo',
          theme: state.themeData,
          home: const MyHomePage(title: 'Home Page'),
        );
      }),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  // This widget is the home page of your application. It is stateful, meaning
  // that it has a State object (defined below) that contains fields that affect
  // how it looks.

  // This class is the configuration for the state. It holds the values (in this
  // case the title) provided by the parent (in this case the App widget) and
  // used by the build method of the State. Fields in a Widget subclass are
  // always marked "final".

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  double value = 1;
  setValue(double newValue) {
    setState(() {
      value = newValue;
    });
  }

  void _incrementCounter() {
    KloktunUIState.of(context).setTheme(KloktunTheme(
        colors: KloktunThemeColors(
            primary: Colors.white, background: Color(0xFF202020))));

    setState(() {
      _counter++;
    });
  }

  var loading = false;

  _toggleLoading() {
    setState(() {
      loading = !loading;
    });
  }

  List<int?> values = [null, 2];

  changeValues(List<int?> newValues) {
    setState(() {
      values = newValues;
    });
  }

  handlePopup() async {
    var globalLoader = KGlobalSpinner(context);

    globalLoader.show();

    await Future.delayed(Duration(seconds: 2));

    globalLoader.close();

    var result = await showKConfirmPopup(
        context: context,
        danger: true,
        icon: Icon(Icons.abc),
        title: Text("Title"),
        child: Text(
          "Точно уверены?",
        ),
        buttonsDirection: Axis.horizontal,
        confirmButtonText: "Да, уверен",
        cancelButtonText: "Не уверен");

    print(result);

    showKMessagePopup(
        context: context,
        // danger: true,
        title: Text("Title"),
        child: Text(
          "У вас что-то произошло",
        ),
        buttonsDirection: Axis.horizontal,
        okayButtonText: 'Понятно');
  }

  int? selectValue;
  setSelectValue(int? value) {
    setState(() {
      selectValue = value;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: KAppBar(
        title: Text(widget.title),
      ),
      body: Center(
        // Center is a layout widget. It takes a single child and positions it
        // in the middle of the parent.
        child: Column(
          // Column is also a layout widget. It takes a list of children and
          // arranges them vertically. By default, it sizes itself to fit its
          // children horizontally, and tries to be as tall as its parent.
          //
          // Column has various properties to control how it sizes itself and
          // how it positions its children. Here we use mainAxisAlignment to
          // center the children vertically; the main axis here is the vertical
          // axis because Columns are vertical (the cross axis would be
          // horizontal).
          //
          // TRY THIS: Invoke "debug painting" (choose the "Toggle Debug Paint"
          // action in the IDE, or press "p" in the console), to see the
          // wireframe for each widget.
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            KButton(
                onPressed: () {
                  Navigator.of(context)
                      .push(MaterialPageRoute(builder: (_) => TabsPage()));
                },
                size: ControlSize.regular,
                child: const Text("Tabs")),
            KSwitch(
                value: loading,
                onChange: (newValue) {
                  setState(() {
                    loading = newValue;
                  });
                }),
            KSelect<int?>(
                icon: Icon(Icons.ac_unit_outlined),
                placeholder: "Choose number",
                value: selectValue,
                size: ControlSize.large,
                onChange: setSelectValue,
                clearable: true,
                options: const [
                  KSelectOption(
                      icon: Icon(Icons.abc),
                      value: 1,
                      child: Text("Another child"),
                      divider: true),
                  KSelectOption(
                    value: 2,
                    label: Text("Some data 2"),
                  ),
                  KSelectOption(
                    value: 3,
                    label: Text("Some data 3"),
                  )
                ]),
            KButton(child: Text("show popup"), onPressed: handlePopup),
            KInput(
              placeholder: "Hey wazup",
            ),
            KTextarea(
              size: ControlSize.regular,
              placeholder: "Hey wazup",
              minLines: 1,
              maxLines: 4,
            ),
            VGap(8),
            KTextarea(
              size: ControlSize.regular,
              placeholder: "Hey wazup",
              minLines: 2,
              maxLines: 4,
            ),
            VGap(8),
            KInput(
              success: true,
              warning: true,
              error: true,
              obscureText: true,
              togglePassword: true,
              clearable: true,
              placeholder: "Enter something",

              //     prepend: KButton(
              //         type: KButtonType.borderless, child: Text("Do some")),
              // prefix: Text("Some prefix"),
              prefix: KIconButton(
                child: Icon(Icons.search),
              ),
              prefixIcon: Icon(Icons.circle),
              // prefixText: "prefix-text",
              prefixPlaceholder: "vk.com/",
              //     suffixPlaceholder: "suffix-placeholder",
              //     suffixText: "suffix-text",
              //     suffixIcon: Icon(Icons.abc),
              //     suffix: Text("Some suffix"),
              //     append: KButton(
              //       type: KButtonType.borderless,
              //       child: Text("Do some"),
              //     )
            ),
            KButton(
              loading: loading,
              // disabled: true,
              type: KButtonType.plain,
              size: ControlSize.medium,
              warning: true,
              child: Text("Hello"),
            ),
            KIconButton(
              loading: loading,
              // disabled: true,
              type: KIconButtonType.primaryText,
              // warning: true,
              onPressed: _toggleLoading,
              error: true,
              child: Icon(KloktunIcons.search),
            ),
            KCheckbox(
              value: loading,
              onChange: (newValue) {
                setState(() {
                  loading = newValue;
                });
              },
              child: Text("Some data"),
            ),
            KLabel(
              label: Text("Just label"),
              child: Text("some value"),
            ),
            KDivider(),
            KHelper(
              // text: Text("Just helper"),
              error: Text("Just error"),
              // suffix: Text("Some suffix"),
              child: Text("some field"),
            ),
            KDivider(),
            Padding(
              padding: EdgeInsets.all(16),
              child: KAlert(
                icon: Icon(KloktunIcons.circle),
                // title: Text("some titlesome title"),
                child: Text("some child"),
                // error: true,
                // warning: true,
                // success: true,
                // suffix: KButton(
                //   child: Text("Press me"),
                // ),
              ),
            ),
            KDivider(),
            Checkbox(
                value: loading,
                onChanged: (newValue) {
                  setState(() {
                    loading = newValue ?? false;
                  });
                }),
            KCheckboxGroup<int?>(options: const [
              KCheckboxGroupOption(value: null, child: Text("1")),
              KCheckboxGroupOption(value: 2, disabled: true, child: Text("2")),
              KCheckboxGroupOption(value: 3, child: Text("3")),
            ], values: values, onChange: changeValues),
            KRadioGroup(
                value: loading,
                // disabled: true,
                onChange: (value) {
                  setState(() {
                    loading = value;
                  });
                },
                options: const [
                  KRadioGroupOption(
                      value: false, disabled: true, child: Text("not loading")),
                  KRadioGroupOption(value: true, child: Text("loading"))
                ]),
            KButton(
                onPressed: _toggleLoading,
                size: ControlSize.regular,
                child: const Text("Loading")),
            KButton(
                onPressed: _toggleLoading,
                size: ControlSize.regular,
                type: KButtonType.primary,
                icon: Icon(Icons.circle),
                child: const Text("Найти")),
            KDivider(
                // indent: 10,
                // endIndent: 20,
                // childAlign: KDividerChildAlign.center,
                // child: Text("or"),
                ),
            Container(
                padding: EdgeInsets.symmetric(
                    // horizontal: 100
                    ),
                width: double.infinity,
                child: KSlider(
                    value: value, min: 1, max: 7, step: 1, onChange: setValue)),
            VGap(100),
            Slider(
              value: value,
              min: 1,
              max: 7,
              onChanged: setValue,
            ),
            Text("Value: $value"),
            const Text(
              'You have pushed the button this many times:',
            ),
            TextField(
              decoration: InputDecoration(hintText: "Some text"),
            ),
            Text(
              '$_counter',
              style: Theme.of(context).textTheme.headlineMedium,
            ),
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _incrementCounter,
        tooltip: 'Increment',
        child: const Icon(Icons.add),
      ), // This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}