piapia123
zh

文本进度条生成

文本

所有处理都在浏览器本地完成,数据不上传服务器

输入
把文件拖到这里可直接载入
输出

把「百分比 标签」的一行行文字画成等宽字符的进度条,再包成可直接粘进 README 的代码块。 ⚠️ 八分块 `▏▎▍▌▋▊▉█` 一个字符有 8 档,不是 1 档 —— 宽度只有十几个字符时,它也能把 35% 与 37% 的差别画出来,这是它比方块样式精确的原因。⚠️ 宽度按显示宽度算(汉字占两格),中文标签那一列才对齐;0% 一律全空、100% 一律全满,不留残块。全部在本机算完,不上传任何数据。

功能

  • 五种样式:方块、渐变块、圆点、箭头、八分块
  • 八分块 `▏▎▍▌▋▊▉█` 一个字符 8 档,小宽度下也精确
  • 宽度按显示宽度算,中文标签对齐不跑偏
  • 0% 全空、100% 全满,边界不留残块
  • 百分比可以显示在条内,也可以跟在条后
  • 百分比可省,省了按行数平均
  • 最后给出可直接粘进 README 的代码块
  • 全部在本机算完,不上传任何数据

使用方法

  1. 一行一条写「百分比 标签」,例如 `35 安装依赖`
  2. 选样式与宽度
  3. 决定百分比显示在条内还是条后
  4. 复制代码块,粘进 README 或工单

常见问题

八分块为什么更精确?
因为一个字符有 8 档(▏ 是 1/8、▌ 是 4/8、█ 是 8/8),而方块只有「实心 / 空心」两种状态。宽度 10 时 35% 在八分块下是 3 格加半格(3.5 格),方块只能取整成 4 格 —— 宽度越小,这点差别越明显。
中文标签怎么对齐?
按显示宽度算,不是按字符数。等宽字体里一个汉字占两格,用字符数去补齐会让中文那一列短一截、整片错位。工具用 displayWidth 量出真实宽度再补空格,所以中英混排也能对齐。
0% 和 100% 会画成什么样?
0% 一律全空(方块是░░░、圆点是○○○、八分块是空格),100% 一律全满。这两个边界最容易因为四舍五入留下一格残块,工具单独处理了它们。
真的能直接粘进 README 吗?
能。输出末尾就是一个 ```text 围起来的代码块,含等宽字符,GitHub、GitLab 与大多数 Markdown 渲染器都会原样显示。注意有些渲染器会去掉行尾空格,所以对齐主要靠条的宽度一致,而不是靠补空格。

相关工具