1. 组件
  2. 代码

刚接触Gradio?从这里开始:Getting Started

查看发布历史

代码

gradio.Code(···)
import gradio as gr with gr.Blocks() as demo: gr.Code(language="python", value=""" import gradio as gr def hello(name): return "hello " + name interface = gr.Interface(hello, "text", "text") interface.launch() """, interactive=True, lines=6) demo.launch()

描述

创建一个代码编辑器,用于查看代码(作为输出组件),或用于输入和编辑代码(作为输入组件)。

行为

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

您的函数应接受以下类型之一:
def predict(
	value: str | None
)
	...

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

您的函数应返回以下类型之一:
def predict(···) -> tuple[str] | str | None
	...	
	return value

初始化

Parameters
value: str | Callable | None
default = None

在代码编辑器中显示的默认值。如果是可调用的,每当应用程序加载时,该函数将被调用以设置组件的初始值。

language: Literal['python', 'c', 'cpp', 'markdown', '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
default = None

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

every: Timer | float | None
default = None

如果`value`是一个函数,则持续调用`value`以重新计算它(否则无效)。可以提供一个计时器,其滴答重置`value`,或者提供一个浮点数来设置重置计时器的常规间隔。

inputs: Component | list[Component] | set[Component] | None
default = None

如果`value`是一个函数(否则无效),则用作计算`value`的输入的组件。每当输入发生变化时,`value`都会重新计算。

lines: int
default = 5

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

max_lines: int | None
default = None

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

label: str | None
default = None

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

interactive: bool | None
default = None

用户是否应该能够输入代码或仅查看它。

show_label: bool | None
default = None

如果为真,将显示标签。

container: bool
default = True

如果为True,将把组件放在一个容器中 - 在边框周围提供一些额外的填充。

scale: int | None
default = None

相对于相邻组件的尺寸。例如,如果组件A和B在一行中,A的scale=2,B的scale=1,A的宽度将是B的两倍。应该是一个整数。scale适用于行,以及在fill_height=True的块中的顶级组件。

min_width: int
default = 160

最小像素宽度,如果没有足够的屏幕空间来满足此值,则会换行。如果某个比例值导致此组件比min_width更窄,则将首先尊重min_width参数。

visible: bool
default = True

如果为False,组件将被隐藏。

elem_id: str | None
default = None

一个可选的字符串,被分配为该组件在HTML DOM中的id。可用于定位CSS样式。

elem_classes: list[str] | str | None
default = None

一个可选的字符串列表,这些字符串被分配为该组件在HTML DOM中的类。可用于定位CSS样式。

render: bool
default = True

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

key: int | str | None
default = None

如果指定,将用于在重新渲染时保持身份。在重新渲染时具有相同键的组件将保留其值。

wrap_lines: bool
default = False

如果为True,当发生溢出时,将换行以适应容器的宽度。默认为False。

快捷键

接口字符串快捷方式 初始化

gradio.Code

"code"

使用默认值

事件监听器

描述

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

支持的事件监听器

Code 组件支持以下事件监听器。每个事件监听器都采用相同的参数,这些参数列在下面的事件参数表中。

监听器 描述

Code.languages(fn, ···)

['python', 'c', 'cpp', 'markdown', '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, ···)

当Code的值因用户输入(例如用户在文本框中输入)或函数更新(例如图像从事件触发器的输出接收值)而更改时触发。请参阅.input()以获取仅由用户输入触发的监听器。

Code.input(fn, ···)

当用户更改Code的值时,此监听器被触发。

Code.focus(fn, ···)

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

Code.blur(fn, ···)

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

事件参数

Parameters