UI Components

在 ChatGPT 中打开

在 webforJ 中，应用程序是通过称为组件的模块化单元创建的，这些单元促进了快速高效的用户界面开发。该框架提供了一系列基本组件，如按钮、输入元素和布局容器。在掌握基础知识后，您可以参考 JavaDocs 以获取所有组件及其功能的详细概述。

布局

布局组件为结构化用户界面提供基础，使开发人员能够高效地组织内容。这些组件提供多种方式来控制子组件的排列，不论是简单还是复杂布局。

以下布局组件旨在处理广泛的用例，从响应式设计到高级内容管理。

AppLayout

一个容器组件，为顶级应用导航和内容组织提供结构化布局。

Toolbar

一个水平容器组件，包含一组操作按钮、图标或其他控件，通常用于执行与当前上下文相关的任务。

FlexLayout

一个布局组件，使用灵活盒子（flexbox）规则排列其子组件，用于响应式设计和对齐。

ColumnsLayout

一个布局组件，将其子组件排列成多个垂直列，适用于创建表单和格栅状结构。

Splitter

一个布局组件，划分可用空间给两个子组件，允许用户通过拖动分隔条来调整它们的大小。

Drawer

一个滑动面板组件，通常用于侧边导航或容纳可以显示或隐藏的附加内容。

Dialog

一个模态窗口组件，覆盖内容以显示重要信息或提示用户交互，通常需要用户操作以关闭。

Login

一个提供预构建用户认证界面的组件，通常包括用户名和密码字段以及提交按钮。

Accordion

一组垂直堆叠的可折叠面板，每个面板都有一个可点击的标题，用于切换其主体内容的可见性。

TabbedPane

一个容器组件，将内容组织成多个选项卡，允许用户在不同视图或部分之间切换。

数据输入

数据输入组件提供捕获用户输入和管理应用程序内交互的重要工具。这些组件多功能，便于构建交互式表单并收集各种类型的数据。

TextField

一个用于输入和编辑文本数据的单行输入组件。

MaskedTextField

一个文本输入组件，限制用户输入特定格式或模式，通常用于如电话号码、日期或信用卡号码等字段。

NumberField

一个组件，提供默认的基于浏览器的输入字段，用于输入数值，并带有增减值的内置控件。

MaskedNumberField

一个数字输入组件，限制用户输入特定的数字格式或模式，确保有效的数字输入，如货币、百分比或其他格式化数字。

PasswordField

一个用于安全输入和掩蔽密码数据的单行输入组件。

DateField

一个组件，提供默认的基于浏览器的日期选择器，通过输入字段选择日期。

MaskedDateField

一个日期输入组件，强制执行特定的日期格式或模式，确保用户根据定义的格式输入有效日期。

TimeField

一个组件，提供默认的基于浏览器的时间选择器，通过输入字段选择时间值。

MaskedTimeField

一个时间输入组件，强制执行特定的时间格式或模式，确保用户根据定义的格式输入有效时间。

DateTimeField

一个组件，提供默认的基于浏览器的日期和时间选择器，通过单个输入字段选择日期和时间。

ColorField

一个组件，提供默认的基于浏览器的颜色选择器，允许用户从输入字段中选择颜色。

TextArea

一个多行文本输入组件，允许用户输入或编辑较大的文本块。

CheckBox

一个表示二元选项的组件，允许用户在选中（真）和未选中（假）状态之间切换。

RadioButton

一个组件，允许用户从互斥的选项组中选择一个选项。

Switch

一个切换组件，允许用户在两种状态之间切换，例如开/关或真/假，通过滑动动作实现。

ChoiceBox

一个组件，提供预定义选项的下拉列表，允许用户从列表中选择一个选项。

ComboBox

一个将下拉列表与可编辑文本输入相结合的组件，允许用户从列表中选择一个选项或输入自定义值。

ListBox

一个组件，显示一个可滚动的选项列表，允许用户从列表中选择一个或多个项目。

选项对话框

选项对话框提供了一种方式，让用户可以看到选择或在继续进行某一操作之前提示他们确认。这些组件对于创建交互式、以决策为驱动的工作流程至关重要，使用户能够以明确且结构化的方式确认、取消或从各种选项中进行选择。

MessageDialog

用于向用户显示信息消息或警报的对话框组件，通常带有一个“确定”按钮以确认消息。

ConfirmDialog

一个对话框组件，询问用户确认或取消某个操作，通常提供“是”和“否”或“确定”和“取消”按钮。

InputDialog

一个对话框组件，提示用户输入文本或数据，通常提供一个输入字段以及“确定”和“取消”等操作按钮。

FileChooserDialog

一个对话框组件，允许用户浏览并从服务器文件系统中选择文件。

FileUploadDialog

一个对话框组件，使用户能够将文件从本地文件系统上传到应用程序。

FileSaveDialog

一个对话框组件，允许用户将文件保存到服务器文件系统的指定位置。

互动与展示

这一类别包括促进用户交互和视觉展示数据或应用程序状态的组件。这些组件帮助用户导航应用程序、触发操作，并通过动态视觉元素理解进度或结果。

Table

一个用于以结构化的表格格式显示数据的组件，支持排序和分页等功能。

GoogleCharts

一个与 Google Charts 集成的组件，用于在应用中显示各种类型的图表和视觉数据表现。

Button

一个可点击的组件，当按下时触发一个操作或事件。

Toast

一个轻量级、非阻止的通知组件，简短地向用户显示消息，然后自动消失。

Alert

一个以显著格式显示重要消息或警告的组件，以引起用户的注意。

Badge

一个小标签组件，用于显示计数、状态或简短的元数据，支持主题、大小和图标。

DesktopNotification

一个利用浏览器的原生通知 API 向用户发出自定义桌面通知的组件。

Navigator

一个可定制的分页组件，用于在数据集中进行导航，支持带有首页、尾页、下一页、上一页按钮和快速跳转字段的布局。

ProgressBar

一个视觉上表示任务或过程进度的组件，通常以水平条的形式显示，随着进度的进行而填充。

Slider

一个允许用户通过在轨道上拖动滑块选择定义范围内值的组件。

BusyIndicator

一个应用范围内的视觉指示器，通常是旋转图标，表明全局进程正在进行。

Loading

一个范围加载指示器，显示在特定父组件内，指示该部分的内容或数据正在加载。

Spinner

一个显示旋转动画的组件，通常用于指示过程或操作正在进行中。

AppNav

一个为应用提供导航菜单的组件，通常用于列出链接或导航项，以在不同部分或视图之间切换。

Icon

一个显示图形符号或图像的组件，通常用于在用户界面中表示操作、状态或类别。

Terminal

一个在应用中模拟命令行界面（CLI）的组件，允许用户输入和执行基于文本的命令。

InfiniteScroll

一个在滚动时加载更多项目的组件，显示加载指示器，并跟踪何时获取所有内容。

Refresher

一个允许在可滚动容器内进行下拉刷新交互的组件，非常适合动态数据加载。

Tree

一个用于显示层次数据的组件，允许用户展开、折叠并与嵌套项目交互。

Avatar

一个用于显示用户头像或首字母的组件，支持不同的大小、形状和主题。

MarkdownViewer

一个用于显示 markdown 内容的组件，具有逐字符的渐进式渲染，非常适合 AI 聊天界面和流式文本。