Flutter基础功能插件dudv_base的使用

Flutter基础功能插件dudv_base的使用

dudv_base 是一个在 Flutter 中使用的实用插件，它提供了许多基础功能，例如加载视图、按钮视图等。本文将详细介绍如何使用 dudv_base 插件，并提供一个完整的示例 Demo。

安装插件

首先，在你的 pubspec.yaml 文件中添加 dudv_base 依赖：

dependencies:
  dudv_base: ^版本号

然后运行 flutter pub get 来安装该插件。

示例代码

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

示例代码文件：main.dart

import 'package:dudv_base/dudv_base.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_state_notifier/flutter_state_notifier.dart';
import 'package:provider/provider.dart';

void main() {
  // 设置加载视图的颜色
  LoadingView.color(Colors.yellow);
  runApp(const Application());
}

// 应用程序入口
class Application extends StatelessWidget {
  const Application({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData.dark(),
      home: StateNotifierProvider<MyAppPresenter, Count>(
        create: (context) => MyAppPresenter(context),
        child: const MyApp(),
      ),
    );
  }
}

// 主页面
class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: const Color(0xff213245),
      appBar: AppBar(
        title: const Text('插件示例应用'),
      ),
      body: Center(
        child: Column(
          children: [
            const LoadingView(),
            Text(
              '运行于: ${context.watch<Count>().value}\n',
              style: Styles.copyStyle(),
            ),
            BtnView(
              onPress: context.read<MyAppPresenter>().onLogin,
              title: '登录',
            )
          ],
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () => context.read<MyAppPresenter>().increment(),
        child: const Icon(Icons.add),
      ),
    );
  }
}

// 主页控制器
class MyAppPresenter extends StateNotifier<Count>
    with LocatorMixin, ApiPresenter, LoadingPresenter {
  MyAppPresenter(this.context) : super(Count(0));

  @override
  final BuildContext context;
  final String _loginFuncKey = 'login_func_key';

  void increment() {
    state = Count(state.value + 1);
  }

  void decrement() {
    state = Count(state.value - 1);
  }

  void onLogin() async {
    final res = await onSubmit(_loginFuncKey);
    if (kDebugMode) {
      print(res);
    }
  }

  Future _login() => Future.value(true);

  @override
  Map<String, Function> get apiSubmits => {_loginFuncKey: _login};
}

// 计数器类
class Count {
  int value;

  Count(this.value);
}

代码解释

1. 设置加载视图颜色

   LoadingView.color(Colors.yellow);
   

   这行代码设置了加载视图的颜色为黄色。

2. 应用程序入口

   class Application extends StatelessWidget {
     const Application({Key? key}) : super(key: key);
   
     @override
     Widget build(BuildContext context) {
       return MaterialApp(
         theme: ThemeData.dark(),
         home: StateNotifierProvider<MyAppPresenter, Count>(
           create: (context) => MyAppPresenter(context),
           child: const MyApp(),
         ),
       );
     }
   }
   

   这里创建了一个简单的 MaterialApp，并将其主页设置为 MyApp。

3. 主页面

   class MyApp extends StatelessWidget {
     const MyApp({Key? key}) : super(key: key);
   
     @override
     Widget build(BuildContext context) {
       return Scaffold(
         backgroundColor: const Color(0xff213245),
         appBar: AppBar(
           title: const Text('插件示例应用'),
         ),
         body: Center(
           child: Column(
             children: [
               const LoadingView(),
               Text(
                 '运行于: ${context.watch<Count>().value}\n',
                 style: Styles.copyStyle(),
               ),
               BtnView(
                 onPress: context.read<MyAppPresenter>().onLogin,
                 title: '登录',
               )
             ],
           ),
         ),
         floatingActionButton: FloatingActionButton(
           onPressed: () => context.read<MyAppPresenter>().increment(),
           child: const Icon(Icons.add),
         ),
       );
     }
   }
   

   在这里，我们定义了主页面的布局，包括加载视图、文本视图和按钮视图。

4. 主页控制器

   class MyAppPresenter extends StateNotifier<Count>
       with LocatorMixin, ApiPresenter, LoadingPresenter {
     MyAppPresenter(this.context) : super(Count(0));
   
     @override
     final BuildContext context;
     final String _loginFuncKey = 'login_func_key';
   
     void increment() {
       state = Count(state.value + 1);
     }
   
     void decrement() {
       state = Count(state.value - 1);
     }
   
     void onLogin() async {
       final res = await onSubmit(_loginFuncKey);
       if (kDebugMode) {
         print(res);
       }
     }
   
     Future _login() => Future.value(true);
   
     @override
     Map<String, Function> get apiSubmits => {_loginFuncKey: _login};
   }
   

   控制器 MyAppPresenter 包含了一些基本的方法，如 increment 和 decrement，用于更新计数值。onLogin 方法用于处理登录逻辑。

5. 计数器类

   class Count {
     int value;
   
     Count(this.value);
   }