Flutter开发辅助插件dev_prokit的使用

发布于 1周前 作者 h691938207 来自 Flutter

Flutter开发辅助插件dev_prokit的使用

dev_prokit

dev_prokit Pub Version Pub Popularity Pub Likes GitHub Repo stars GitHub Issues or Pull Requests GitHub Issues or Pull Requests

介绍

dev_prokit 是一个专门为Flutter开发设计的实用工具包。它集合了许多常用的功能,使开发者能够以更少的努力构建应用程序。该工具包不仅功能全面,而且调用代码极为方便,并且编写的功能代码更加稳定可靠。通过使用它,开发者可以显著缩短开发周期,预计可节省约50%的时间,使得开发工作更加轻松,让创造力和灵感自由绽放!

概述

以下是dev_prokit当前包含的功能类型概述表:

类型 数量 内容
2 ColorConvert 、ETextStyle
小部件 2 EdgeInsetWidget、GapNum
函数 6 LogDiyInterceptor、CurlInterceptor、DebounceFunction、ThrottleFunction、RangeNum、RandomList

文档

以下是dev_prokit提供的功能目录(中文目录)。用户可以根据业务需求选择相应的功能和中文目录,如下所示:

  1. 使用十六进制字符串快速生成颜色
  2. 快速填充组件之间的空隙
  3. 快速在组件边缘插入内容
  4. 基于Dio的便捷GET请求curl链接
  5. 在多种模式下的漂亮日志输出格式
  6. 事件节流和防抖
  7. 随机生成双精度、布尔值、整数数组,可选安全/非安全模式,可设置随机数是否重复

示例代码

以下是一个简单的示例代码,展示了如何使用dev_prokit

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

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

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'DevProkit Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const GapWidget(),
    );
  }
}

/// 快速填充组件之间的空隙
class GapWidget extends StatelessWidget {
  const GapWidget({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    /// 1. Gap 示例
    """
    10.vGap  (int)
    5.2.vGap (double)
    """;

    /// 2. HEX、HEXA 、AHEX 转颜色
    """
    '#3bc'.color       (HEX)
    '#33bbcc'.color    (HEX)
    '#33bbccff'.color  (HEXA)
    '#ff33bbcc'.color  (AHEX)
    """;

    /// 3. 小部件边距
    """
    // 小部件
    Text('Hello Word').insets(EdgeInsets.zero)
    Text('Hello Word').insetsAll(10)
    Text('Hello Word').insetsOnly(left: 10)
    Text('Hello Word').insetsSymmetric(horizontal: 10, vertical: 20)
    
    // Sliver 小部件
    SliverToBoxAdapter(child: Text('Hello Word')).insets(EdgeInsets.zero)
    SliverToBoxAdapter(child: Text('Hello Word')).insetsAll(10)
    SliverToBoxAdapter(child: Text('Hello Word')).insetsOnly(left: 10)
    SliverToBoxAdapter(child: Text('Hello Word')).insetsSymmetric(horizontal: 10, vertical: 20)
    
    // Sliver 子类
    class PageBoxAdapter extends SliverToBoxAdapter {
      const PageBoxAdapter({super.key});
    }
    PageBoxAdapter().sliverInsets(EdgeInsets.zero)

    // 更多方法
    insetsFromViewPadding
    insetsLTRB
    insetsLerp
    """;

    /// 4. 文本样式
    """
    TextStyle().fSize(18)
    TextStyle().fColor(Colors.red)
    TextStyle().bold
    TextStyle().fHeight(1.2)
    ......
    """;

    /// 5. 日志
    """
    Dio dio = new Dio(baseOptions);
    dio.interceptors
      ..add(const LogDiyInterceptor(type: LogType.rich));
    """;

    /// 6. 范围数值
    """
    3.range(min:4); // 4
    3.0.range(max:2.0); // 2.0
    3.5.range(min:2.0, max:4.0); // 3.5
    """;

    /// 7. 事件防抖
    """
    // 无参数
    GestureDetector(
      onTap:() {
        print('Debounce without parameters method');
      }.debounce(),
      ......
    )

    // 一个参数
    InkWell(
      onTapDown: (details) {
        print('A Parameter');
      }.debounceParam(),
    }

    // 两个参数
    PersonWidget(
      onRun:(name,time) {
        print('name-time');
      }.debounceParam2(),
    )

    // 多于两个参数
    Function(String,(int,String)) diyOnRun = (name,(time,address)) {
      print('name-time-address');
    }.debounceParam2();

    PersonWidget(
      onRun:(name,time,address) {
        diyOnRun(name,(time,address));
      },
    )
    """;

    /// 8. 事件节流
    """
    // 无参数
    GestureDetector(
      onTap:() {
        print('throttle without parameters method');
      }.throttle(),
      ......
    )

    // 一个参数
    InkWell(
      onTapDown: (details) {
        print('A Parameter');
      }.throttleParam(),
    }

    // 两个参数
    PersonWidget(
      onRun:(name,time) {
        print('name-time');
      }.throttleParam2(),
    )

    // 多于两个参数
    Function(String,(int,String)) diyOnRun = (name,(time,address)) {
      print('name-time-address');
    }.throttleParam2();

    PersonWidget(
      onRun:(name,time,address) {
        diyOnRun(name,(time,address));
      },
    )
    """;

    /// 9. 快速生成随机数组
    """
    RandomList.nextBool(3); // [true, false, true]
    RandomList.nextInt(3);  // [2, 0, 1]
    RandomList.nextInt(3, start:10); // [12, 10, 12]
    RandomList.nextInt(3, start:10, repeat:false); // [12, 10, 11]
    RandomList.nextDouble() 
    ...... 等等。
    """;

    const TextStyle tStyle = TextStyle(fontFamily: 'Rc', height: 1);

    return Scaffold(
      appBar: AppBar(
        title: Text(
          '文本样式',
          style: tStyle.bold,
        ),
      ),
      body: Column(
        children: [
          Text(
            '设置字重',
            textDirection: TextDirection.rtl,
            style: tStyle.medium,
          ).insetsOnly(right: 200),
          Text(
            '设置大小',
            style: tStyle.fSize(20),
          ).insets(const EdgeInsetsDirectional.all(30)),
          Text(
            '设置文本颜色',
            style: tStyle.fColor(Colors.red),
          ),
          SizedBox(
            width: 60,
            child: Text(
              '设置溢出格式',
              textDirection: TextDirection.rtl,
              style: tStyle.oFlow(TextOverflow.ellipsis),
            ),
          ),
          Text(
            '设置文字字母间距',
            style: tStyle.lSpacing(5),
          ),
          Text(
            '设置文字字体间距ab like',
            style: tStyle.wSpacing(50),
          )
        ],
      ).insetsAll(20),
    );
  }
}

class MethodWidget extends StatelessWidget {
  const MethodWidget({super.key, this.itemMethod});
  final Function(String, int)? itemMethod;

  [@override](/user/override)
  Widget build(BuildContext context) {
    return const Placeholder();
  }
}

class PageBoxAdapter extends SliverToBoxAdapter {
  const PageBoxAdapter({super.key});
}

更多关于Flutter开发辅助插件dev_prokit的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter开发辅助插件dev_prokit的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在Flutter开发中,dev_prokit 是一个辅助插件集合,它提供了一系列预构建的UI组件和实用功能,以加速开发流程。虽然具体的使用可能会因项目需求而有所不同,但以下是一个基本的示例,展示了如何在Flutter项目中使用 dev_prokit 的一些功能。

首先,确保你已经在 pubspec.yaml 文件中添加了 dev_prokit 的依赖:

dependencies:
  flutter:
    sdk: flutter
  dev_prokit: ^最新版本号 # 替换为实际的最新版本号

然后运行 flutter pub get 以获取依赖。

示例代码

以下是一个简单的Flutter应用示例,展示了如何使用 dev_prokit 中的一些组件。

import 'package:flutter/material.dart';
import 'package:dev_prokit/dev_prokit.dart'; // 导入dev_prokit

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Dev ProKit Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Dev ProKit Demo'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            // 使用 dev_prokit 中的按钮组件
            SizedBox(
              height: 50,
              child: PKButton(
                label: 'Primary Button',
                onPressed: () {
                  // 按钮点击事件
                  print('Primary Button Pressed');
                },
                type: ButtonType.PRIMARY,
              ),
            ),
            // 使用 dev_prokit 中的输入框组件
            SizedBox(
              height: 60,
              child: PKTextField(
                controller: TextEditingController(),
                label: 'Enter Text',
                hint: 'This is a hint text',
                isPassword: false,
                onChanged: (value) {
                  // 输入框内容变化事件
                  print('Text changed to: $value');
                },
              ),
            ),
            // 使用 dev_prokit 中的加载指示器
            SizedBox(
              height: 50,
              child: Center(
                child: PKLoadingIndicator(
                  size: 50,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

说明

  1. PKButtondev_prokit 提供的一个按钮组件,支持多种类型(如主按钮、次要按钮等)。
  2. PKTextField:一个预构建的文本输入框组件,支持提示文本、密码输入等功能。
  3. PKLoadingIndicator:一个加载指示器组件,可以用于显示加载中的状态。

注意

  • 由于 dev_prokit 的API可能会随着版本更新而变化,因此建议查阅最新的官方文档以获取最准确的信息。
  • 在实际项目中,根据需求可能需要进一步自定义这些组件的样式和行为。

这个示例展示了如何在Flutter应用中使用 dev_prokit 提供的一些预构建组件。根据你的具体需求,你可以探索 dev_prokit 提供的更多功能,并将其集成到你的项目中。

回到顶部