从基础到进阶的详细步骤和一些专业的设计技巧，帮助你在Adobe Illustrator中轻松绘制。
第一部分：基础电池图标绘制（四步法）
这是一种最标准、最清晰的方法。
1. 创建主体
- 使用矩形工具（M），绘制一个圆角矩形作为电池主体。
- 技巧：绘制后，直接拖动矩形内部的“圆角微件”来调整圆角弧度，或在上方属性栏输入数值。让圆角适中，看起来更友好。
2. 添加正极
- 在电池主体右上角，绘制一个小矩形（宽度为主体的1/5-1/6）。
- 对齐：选中两个形状，使用对齐工具，确保小矩形与电池主体水平居中对齐。
3. 绘制电量格（核心步骤）
- 在电池主体内部，用线段工具（/） 或矩形工具绘制一条垂直的线段。
- 复制：按住
Alt 键拖动这条线段，复制出多份。
- 精准分布：选中所有线段，打开对齐面板，点击“垂直分布间距”按钮（确保间距相等）。或者使用
Ctrl+D （再次变换）进行等距复制。
- 编组：将所有电量格线段选中，按
Ctrl+G 编组，便于管理。
4. 填充电量状态
- 绘制一个与电池主体内部等高的矩形，填充颜色（如绿色），置于底层，作为“电量”。
- 关键：将这个填充矩形置于 “电池主体”之下，“电量格线段”之上的图层顺序。
- 调整这个填充矩形的宽度，来代表不同的电量（满电=与内部等宽，低电=仅1-2格宽度）。
第二部分：手机电量格图标设计技巧（进阶）
这是你要的重点，更适用于手机状态栏那种小巧精致的风格。
技巧1：极简轮廓风格（iOS风格）
- 只保留一个极细描边的电池外框，内部无填充。
- 正极也使用细线表示。
- 电量用实心色块表示，色块与轮廓之间有微小间距。这种风格干净、现代，适合小尺寸显示。
技巧2：填充块风格（常见安卓风格）
- 电池主体无描边，有浅色背景填充（如浅灰色）。
- 电量格之间没有分隔线，电量显示为一个连续的、与背景对比度高的色块（如蓝色、绿色）。
- 低电量时（如20%以下），色块变为红色或橙色，这是一种重要的用户体验设计。
技巧3：微妙的视觉效果
- 内阴影/渐变：给电池主体添加轻微的线性渐变（上浅下深），或微小的内阴影，增加立体感但又不夸张。
- 电量格的圆角：将电量格的矩形也做成微圆角，与整体风格更协调。
- 间距是关键：电量块与电池内边框的间距、块与块之间的间距，必须均匀一致。这是保证图标专业性的细节。
技巧4：整套状态设计
一个专业的图标应该有一整套状态：
- 100%（满格）
- 66%左右（中等）
- 33%左右（低电量）
- 20%以下（警告状态，常变红色）
- 充电中（可以加入闪电符号，或使用脉冲渐变效果）
第三部分：在Adobe Illustrator中的实用操作提示
使用参考线和网格：打开
视图 > 显示网格 和
视图 > 对齐网格，能帮你严格对齐所有元素。
形状生成器工具（Shift+M）：如果你想将多个形状合并或切分，这个工具效率极高。
路径查找器：用于合并、减去、相交形状。例如，用电池主体减去一个内部矩形，可以直接做出“内壁”效果。
全局色板：为电池的不同状态（正常、警告、充电）创建全局色板，方便一键统一修改颜色。
符号：如果你需要多次使用同一个电池图标，将其创建为“符号”。更新符号实例，所有使用它的地方都会同步更新。
第四部分：简单案例流程（极简风格）
画布：新建一个小画布，如 100x100 像素。
轮廓：绘制一个无填充、1pt描边的圆角矩形（作为电池主体）。在其右侧绘制一个更小的圆角矩形作为正极。
电量：在轮廓内绘制一个填充色块（如蓝色），宽度占内部的80%，与四边保持几个像素的边距。
优化：选中所有部分，
Ctrl+G 编组。可以适当添加一个微妙的背景投影（效果 > 风格化 > 投影）。
总结与建议
- 清晰易读是第一要务：即使在很小的尺寸下，电池的形态和电量多少也必须一目了然。
- 风格统一：确保你的电池图标与你的App或系统其他图标的视觉风格（线宽、圆角、色彩体系）保持一致。
- 从模仿开始：找一些你喜欢的优秀设计（例如iOS、Material Design的系统图标），在AI中尝试临摹，这是最快的学习方法。
按照这些步骤和技巧，你完全可以在AI中绘制出既专业又美观的电量图标。祝你设计愉快！
