1. 组件
  2. 代码

刚开始使用 Gradio？ 从这里开始： 入门指南

查看 发布历史

←

ClearButton

颜色选择器

→

代码

gradio.Code(···)

描述

创建一个代码编辑器，用于查看代码（作为输出组件）或输入和编辑代码（作为输入组件）。

行为

作为输入组件: 将输入的代码作为 str 类型传递。

您的函数应接受其中一种类型
def predict(
	value: str | None
)
	...

作为输出组件: 期望一个 str 类型的代码。

您的函数应返回其中一种类型
def predict(···) -> tuple[str] | str | None
	...	
	return value

初始化

参数
🔗 
value: str | Callable | None
默认 = None

在代码编辑器中显示的默认值。如果提供了函数，则每次加载应用时都会调用该函数来设置此组件的初始值。

🔗 
language: Literal['python', 'c', 'cpp', 'markdown', 'latex', 'json', 'html', 'css', 'javascript', 'jinja2', 'typescript', 'yaml', 'dockerfile', 'shell', 'r', 'sql', 'sql-msSQL', 'sql-mySQL', 'sql-mariaDB', 'sql-sqlite', 'sql-cassandra', 'sql-plSQL', 'sql-hive', 'sql-pgSQL', 'sql-gql', 'sql-gpSQL', 'sql-sparkSQL', 'sql-esper'] | None
默认 = None

代码显示的语言。支持的语言列表在 `gr.Code.languages` 中。

🔗 
every: Timer | float | None
默认 = None

持续调用 `value` 来重新计算它（如果 `value` 是一个函数，否则无效）。可以提供一个 Timer，其滴答声会重置 `value`，或者提供一个浮点数来为重置 Timer 提供常规间隔。

🔗 
inputs: Component | list[Component] | set[Component] | None
默认 = None

用作计算 `value` 的输入的组件（如果 `value` 是一个函数，否则无效）。`value` 在输入更改时会重新计算。

🔗 
lines: int
默认 = 5

代码编辑器中显示的最小可见行数。

🔗 
max_lines: int | None
默认 = None

代码编辑器中显示的最大可见行数。默认为 None，会填充容器的高度。

🔗 
label: str | I18nData | None
默认 = None

此组件的标签。显示在组件上方，如果该组件有示例表格，也用作标题。如果为 None 且在 `gr.Interface` 中使用，则标签将是此组件分配到的参数名称。

🔗 
interactive: bool | None
默认 = None

用户是否应该能够输入代码，还是只能查看它。

🔗 
show_label: bool | None
默认 = None

如果为 True，将显示标签。

🔗 
container: bool
默认 = True

如果为 True，则会将组件放置在容器中，在边框周围提供一些额外的填充。

🔗 
scale: int | None
默认 = None

与相邻组件相比的相对大小。例如，如果组件 A 和 B 在一个 Row 中，A 的 scale 为 2，B 的 scale 为 1，则 A 的宽度将是 B 的两倍。应为整数。scale 适用于 Rows，以及 Blocks 中 fill_height=True 的顶级组件。

🔗 
min_width: int
默认 = 160

最小像素宽度，如果屏幕空间不足以满足此值，则会换行。如果某个 scale 值导致此组件比 min_width 窄，则将首先考虑 min_width 参数。

🔗 
visible: bool | Literal['hidden']
默认 = True

如果为 False，则组件将隐藏。如果为“hidden”，则组件将视觉上隐藏并且不会在布局中占用空间，但仍存在于 DOM 中。

🔗 
elem_id: str | None
默认 = None

一个可选字符串，用作此组件在 HTML DOM 中的 id。可用于定位 CSS 样式。

🔗 
elem_classes: list[str] | str | None
默认 = None

一个可选的字符串列表，用作此组件在 HTML DOM 中的类。可用于定位 CSS 样式。

🔗 
render: bool
默认 = True

如果为 False，则组件不会在 Blocks 上下文中渲染。如果打算现在分配事件监听器，但稍后渲染组件，则应使用此选项。

🔗 
key: int | str | tuple[int | str, ...] | None
默认 = None

在 `gr.render` 中，跨重渲染具有相同键的组件被视为同一个组件，而不是一个新组件。在 `preserved_by_key` 中设置的属性在重渲染时不会重置。

🔗 
preserved_by_key: list[str] | str | None
默认 = "value"

此组件构造函数中的参数列表。在 `gr.render()` 函数内部，如果一个组件使用相同的键进行重渲染，则这些（也是唯一的）参数将在 UI 中被保留（如果它们已被用户或事件监听器更改），而不是根据构造函数中提供的值进行重渲染。

🔗 
wrap_lines: bool
默认 = False

如果为 True，当发生溢出时，将根据容器的宽度换行。默认为 False。

🔗 
show_line_numbers: bool
默认 = True

如果为 True，则显示行号；如果为 False，则隐藏行号。

🔗 
autocomplete: bool
默认 = False

如果为 True，将显示支持语言的自动完成建议。默认为 False。

🔗 
buttons: list[Literal['copy', 'download'] | Button] | None
默认 = None

要在组件的右上角显示的按钮列表。有效选项包括 "copy"（复制）、"download"（下载）或 `gr.Button()` 实例。"copy" 按钮允许用户将代码复制到剪贴板。"download" 按钮允许用户将代码下载为文件。自定义的 `gr.Button()` 实例将出现在工具栏中，并带有其配置的图标和/或标签，点击它们将触发在该按钮上注册的任何 `.click()` 事件。默认情况下，将显示 "copy" 和 "download" 按钮。

快捷方式

快捷方式
gradio.Code
接口字符串快捷方式 "code"
初始化 使用默认值

事件监听器

描述

事件监听器允许您响应 Gradio Blocks 应用中定义的 UI 组件的用户交互。当用户与元素交互时（例如，更改滑块值或上传图像），会调用一个函数。

支持的事件监听器

Code 组件支持以下事件监听器。每个事件监听器接受相同的参数，这些参数在下面的 事件参数 表中列出。

监听器
Code.languages(fn, ···)

['python', 'c', 'cpp', 'markdown', 'latex', 'json', 'html', 'css', 'javascript', 'jinja2', 'typescript', 'yaml', 'dockerfile', 'shell', 'r', 'sql', 'sql-msSQL', 'sql-mySQL', 'sql-mariaDB', 'sql-sqlite', 'sql-cassandra', 'sql-plSQL', 'sql-hive', 'sql-pgSQL', 'sql-gql', 'sql-gpSQL', 'sql-sparkSQL', 'sql-esper', None]

Code.change(fn, ···)

当代码的值因用户输入（例如，用户在文本框中键入）或函数更新（例如，图像从事件触发器的输出接收值）而改变时触发。有关仅由用户输入触发的监听器，请参阅 .input()。

Code.input(fn, ···)

当用户更改代码的值时触发此监听器。

Code.focus(fn, ···)

当代码获得焦点时触发此监听器。

Code.blur(fn, ···)

当代码失去焦点/模糊时触发此监听器。

事件参数

参数
←

ClearButton

颜色选择器

→
gradio