从零开始创建cli-progress自定义预设：打造独一无二的进度条样式

从零开始创建cli-progress自定义预设：打造独一无二的进度条样式

【免费下载链接】cli-progress :hourglass: easy to use progress-bar for command-line/terminal applications 项目地址: https://gitcode.com/gh_mirrors/cl/cli-progress

在开发命令行应用时，一个直观美观的进度条能极大提升用户体验。cli-progress作为一款轻量级的命令行进度条工具，不仅提供了丰富的预设样式，更支持开发者创建完全自定义的进度条风格。本文将带你一步步打造专属于你的进度条预设，让你的命令行应用脱颖而出。

认识cli-progress预设系统

cli-progress的预设系统位于项目的presets/目录下，通过模块化的方式组织不同风格的进度条配置。系统默认提供了四种预设：legacy、shades_classic、shades_grey和rect，这些预设定义了进度条的外观、字符和格式。

不同预设样式的进度条展示，从左到右分别为legacy、shades_classic、shades_grey和rect

预设本质上是一个包含特定配置属性的JavaScript对象。以presets/rect.js为例，一个基础的预设结构如下：

module.exports = { format: ' {bar}■ {percentage}% | ETA: {eta}s | {value}/{total}', barCompleteChar: '■', barIncompleteChar: ' ' }; 

自定义预设的核心配置项

创建自定义预设前，需要了解cli-progress提供的核心配置选项。这些选项决定了进度条的外观和行为：

进度条格式(format)

格式字符串定义了进度条的整体布局，可包含以下占位符：

• {bar}: 进度条主体
• {percentage}: 完成百分比
• {value}: 当前值
• {total}: 总值
• {eta}: 预计剩余时间

进度条字符

• barCompleteChar: 已完成部分的字符
• barIncompleteChar: 未完成部分的字符
• barGlue: 连接完成与未完成部分的字符（可选）

样式增强

• colors: 为进度条添加颜色（需配合chalk等颜色库）
• width: 进度条宽度（默认为40）
• stopOnComplete: 完成后是否停止动画

五步创建自定义预设

1. 创建预设文件

在presets/目录下创建新的预设文件，建议使用有意义的名称，如custom-dots.js。

2. 定义基础结构

在文件中导出一个包含配置选项的对象：

module.exports = { // 配置选项将在这里定义 }; 

3. 设计进度条格式

设计适合你应用场景的格式字符串。例如，创建一个简洁的点式进度条：

format: 'Progress: {bar} {percentage}% ({value}/{total})', 

4. 选择进度条字符

选择能体现你设计风格的字符。例如，使用点和星号组合：

barCompleteChar: '★', barIncompleteChar: '·', 

5. 添加高级配置（可选）

根据需要添加颜色、宽度等高级配置：

colors: { bar: 'green', percentage: 'yellow' }, width: 50 

应用和测试自定义预设

创建完成后，需要在代码中应用并测试你的自定义预设。可以参考examples/example-presets.js中的方式使用新预设：

const cliProgress = require('../cli-progress'); const customPreset = require('../presets/custom-dots'); // 创建进度条实例 const bar = new cliProgress.SingleBar({}, customPreset); // 启动进度条 bar.start(100, 0); // 更新进度 bar.update(50); // 完成进度条 bar.stop(); 

使用cli-progress创建的多进度条展示，适合同时显示多个任务的进度

分享你的创意预设

创建独特的预设后，你可以通过以下方式与社区分享：

1. 将你的预设提交到项目的CONTRIBUTE.md中
2. 在examples目录下创建演示文件，展示预设效果
3. 在项目的docs/events.md中记录你的预设特点

通过自定义预设，你可以让命令行应用的进度展示更加个性化和专业化。无论是简约的文本进度条，还是富有创意的动画效果，cli-progress都能满足你的需求，让你的应用在命令行中脱颖而出。

【免费下载链接】cli-progress :hourglass: easy to use progress-bar for command-line/terminal applications 项目地址: https://gitcode.com/gh_mirrors/cl/cli-progress