Flutter控制台输出插件console_flutter的使用

console_flutter 是一个简单的 Flutter 包，用于存储、查看和管理应用程序的控制台日志和 API 日志。以下是该插件的基本功能和使用方法。

功能概述

console_flutter 提供了以下日志类型：

• verbose（默认，黑色文本）
• info（蓝色文本）
• error（红色文本）

示例效果

安装

在项目的 pubspec.yaml 文件的 dependencies: 部分添加以下依赖项：

dependencies:
  console_flutter: <最新版本>

然后运行以下命令以安装依赖：

flutter pub get

使用方法

方法 1: 使用 WrapperWidget

在主应用中包裹 ConsoleWrapper 来启用控制台日志功能。

示例代码

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

void main() {
  WidgetsFlutterBinding.ensureInitialized(); // 确保 Flutter 绑定初始化
  Console.logEnabled(kDebugMode); // 开启或关闭控制台视图
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: ConsoleWrapper( // 包裹控制台视图
        child: MyHomePage(),
      ),
    );
  }
}

class MyHomePage extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('控制台示例'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            Console.log("这是一条普通日志"); // 记录普通日志
            Console.info("这是一条信息日志"); // 记录信息日志
            Console.error("这是一条错误日志"); // 记录错误日志
          },
          child: const Text('记录日志'),
        ),
      ),
    );
  }
}

方法 2: 自定义导航打开日志屏幕

通过调用 Console.showConsoleLog(context) 手动打开日志屏幕。

示例代码

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

void main() {
  Console.logEnabled(true);
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('控制台示例'),
      ),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            Console.showConsoleLog(context); // 打开日志屏幕
          },
          child: const Text('查看日志'),
        ),
      ),
    );
  }
}