Flutter插件cherry_flutter的介绍与使用

cherry_flutter 是一个个人工具类库，仅适用于个人工作和学习，不建议用于商业用途。它提供了多种实用组件，可以快速构建界面并提升开发效率。

使用示例

以下是一个完整的示例代码，展示如何使用 cherry_flutter 插件中的组件。

示例代码

import 'package:cherry_flutter/widgets/field/chf_field.dart';
import 'package:example/demo/dialog.dart';
import 'package:example/demo/popup_menu.dart';
import 'package:flutter/material.dart';

import 'demo/action_sheet.dart';
import 'demo/appbar.dart';
import 'demo/button.dart';
import 'demo/divider.dart';
import 'demo/popup_menu_box.dart';

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

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        visualDensity: VisualDensity.adaptivePlatformDensity,
      ),
      home: HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  HomePage({Key? key}) : super(key: key);

  [@override](/user/override)
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  TextEditingController controller = TextEditingController();

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
        backgroundColor: Colors.white,
        appBar: AppBar(title: Text('Cherry ui')),
        body: SingleChildScrollView(
          child: Container(
            width: double.infinity,
            padding: EdgeInsets.symmetric(vertical: 20, horizontal: 20),
            child: Wrap(
              runSpacing: 20,
              alignment: WrapAlignment.spaceBetween,
              children: [
                // 按钮示例
                _Item(
                  title: 'button',
                  onTap: () {
                    Navigator.push(context,
                        MaterialPageRoute(builder: (context) {
                      return ButtonPage();
                    }));
                  },
                ),
                // 分割线示例
                _Item(
                  title: 'Divider',
                  onTap: () {
                    Navigator.push(context,
                        MaterialPageRoute(builder: (context) {
                      return DividerDemo();
                    }));
                  },
                ),
                // 动作表单示例
                _Item(
                  title: 'ActionSheet',
                  onTap: () {
                    Navigator.push(context,
                        MaterialPageRoute(builder: (context) {
                      return ActionSheetDemo();
                    }));
                  },
                ),
                // 对话框示例
                _Item(
                  title: 'Dialog',
                  onTap: () {
                    Navigator.push(context,
                        MaterialPageRoute(builder: (context) {
                      return DialogDemo();
                    }));
                  },
                ),
                // 弹出菜单示例
                _Item(
                  title: 'Popup menu',
                  onTap: () {
                    Navigator.push(context,
                        MaterialPageRoute(builder: (context) {
                      return PopupMenuDemo();
                    }));
                  },
                ),
                // 弹出菜单框示例
                _Item(
                  title: 'Popup menu box',
                  onTap: () {
                    Navigator.push(context,
                        MaterialPageRoute(builder: (context) {
                      return PopupMenuBoxDemo();
                    }));
                  },
                ),
                // 自定义AppBar示例
                _Item(
                  title: 'appbar',
                  onTap: () {
                    Navigator.push(context,
                        MaterialPageRoute(builder: (context) {
                      return AppBarDemo();
                    }));
                  },
                ),
                // 输入框示例
                Container(
                  width: 300,
                  decoration: BoxDecoration(
                    border: Border.all(width: 1, color: Colors.grey),
                    borderRadius: BorderRadius.circular(5)
                  ),
                  child: CHField(
                    height: 36,
                    cursorColor: Colors.blue,
                    cursorWidth: 4,
                    cursorHeight: 20,
                    controller: TextEditingController(),
                    contentPadding: EdgeInsets.symmetric(horizontal: 10, vertical: 0),
                    hintText: '请输入密码',
                    hintStyle: TextStyle(fontSize: 14, color: Colors.red, height: 1.428, textBaseline: TextBaseline.alphabetic),
                  ),
                )
              ],
            ),
          ),
        ));
  }
}

// 示例组件
class _Item extends StatelessWidget {
  final String title;
  final GestureTapCallback? onTap;

  const _Item({Key? key, required this.title, this.onTap}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        width: 100,
        height: 100,
        alignment: Alignment.center,
        decoration: BoxDecoration(color: Colors.white, boxShadow: [
          BoxShadow(
            color: Colors.black12,
            blurRadius: 10.0,
            spreadRadius: 0,
            offset: Offset(0, 2),
          )
        ]),
        child: Text(title),
      ),
    );
  }
}