在VSCode Jupyter notebook中使tqdm进度条变暗

Question

我正在使用启用了深色模式的 Visual Studio Code 中的 Jupyter 笔记本。我使用tqdm可视化进度条，但它不会显示为深色模式。请参见下图：

根据GitHub上此问题，这不是与Jupyter、ipywidget或tqdm本身有关的问题，而仅与VSCode相关。

是否有任何解决方法来解决这个问题？

- Sadra

---

解决方法有点hacky，包括以下两个步骤： (1) 在vscode中将默认的pywidgets背景颜色设置为黑色：请参见链接 (2) 将小部件样式设置为文本颜色作为IPython预先单元格运行事件（以获取白色文本）：请参见链接 - omasoud

Answer 1

这个答案对我有用。在一个单元格中运行下面的代码。

%%html
<style>
.cell-output-ipywidget-background {
    background-color: transparent !important;
}
:root {
    --jp-widgets-color: var(--vscode-editor-foreground);
    --jp-widgets-font-size: var(--vscode-editor-font-size);
}  
</style>

- mentoc3000

Answer 2

你可以使用tqdm-bar_format参数将自定义格式传递给tqdm，该格式使用ANSI转义代码来设置颜色。

就像这样：

from tqdm import tqdm
import time

# Custom format with ANSI escape codes for dark green color
dark_green = "\033[1;32;40m"
bar_format = f"{dark_green}{{l_bar}}{{bar:50}} [{{elapsed}}]{{r_bar}}"

# Create tqdm progress bar with custom format
for i in tqdm(range(100), bar_format=bar_format):
    time.sleep(0.01)

此外，这篇文章可能会有所帮助。

- SriSreedhar

Answer 3

我曾经遇到过同样的问题，我的搜索显示在单元格中输入以下内容可以解决背景显示问题，但是在深色背景上文本仍然可能存在问题。为了达成妥协，我将我的页面设置为桃红色（请参见截图）：

%%html
<style>
.cell-output-ipywidget-background {
   background-color: transparent !important;
}
.jp-OutputArea-output {
   background-color: transparent;
}  
</style>

- walksonair