OverAll
Basic Components
| name | description |
|---|---|
| SText(文字组件) | Display Text, SText inherits Text and add theme property |
| SButton(按钮组件) | SButton is a button component that you can freely perform regular properties operations on |
| SDivider(分割线) | A divider groups sections of content to create visual rhythm and hierarchy.Use dividers along with spacing and headers to organize content in your layout. |
| SIcon(图标) | this is a icon container, better than Image |
| SCard(卡片) | A very simple universal card without any layout or restrictions.You can add anything you want to the card |
Data Components
| name | description |
|---|---|
| STag(标签组件) | A small tag used to display data |
| STable and STableColumn(表格组件) | The table is split into table header and table content |
| SCollapse and SCollapseItem(折叠面板组件) | Ability to collapse content |
| SAvatar(头像组件) | SAvatar is a avatar component that defaults to Icons.Avatar when there are no images available |
| SCollection(收缩盒组件) | SCollection is an expandable box that can be zoomed in or out by clicking (internal can also be used) |
| SPersona(个人信息组件) | This component is used to display simple user introduction information |
| SBadge(勋章组件) | SBadge is a quick way to display user status or events |
| SProgress(进度条组件) | SProgress is commonly used to display download progress or event processing progress.And you can fully control it through the progress property |
| SSlider(滑块组件) | The Slider component is used for creating a slider control that allows users to select a value within a range. It supports customization of orientation, theme, and visual properties. |
| STree(树型组件) | STree can be used to display directory structure, forming a parent-child relationship, and can be easily displayed |
| SFile(文件组件) | SFile can help users present file selectors GUI |
| SStep(步骤组件) | The Step component visualizes the progress of a sequence by breaking it down into individual steps. It allows for custom theming and supports indicating the current, completed, and pending steps through visual cues. |
| SPagination(分页器) | A component designed for navigating through pages, providing options for customization and various interactions. |
| SKeyBoard(虚拟键盘) | A customizable keyboard component for various input types including numbers, alphabets, and computer keyboard layouts. |
| SCarousel(走马灯) | The Carousel component is designed to display a sequence of images (or slides) that users can navigate through. It provides a dynamic and visually engaging way to showcase multiple images without occupying too much space on the screen. |
| STimeLine(时间轴) | The timeline component is mainly used to display the changes of data over time, and it is usually used in data visualization to visually represent time series data |
| SCalendar(日历) | A calendar component that inherits from SCard. It is designed to display a month view with the ability to navigate and select dates. |
Form Components
| name | description |
|---|---|
| SInput(输入框组件) | This is a basic input box, often used in forms, divided into two types: text and password |
| SStar(评分组件) | SStar is a scoring component |
| SSelect(选择框组件) | SSelect is a selector that provides three types of optional input parameter values |
| SLink(链接组件) | SLink is commonly used to represent text connections or sharing |
| SRadio(单选框组件) | SRadio let people select a single item |
| SCheckbox(多选框组件) | SCheckbox let people select multi items |
| SSwitch(选项组件) | SSwitch is a switch used for simple judgment scenarios |
| SSwitchGroup(选项组组件) | SSwitchGroup switch group can contain more switch cases |
| SNumberInput(数字选择器) | A numeric input component that inherits from SCard, designed for inputting numerical values within a specified range. It allows adjustments through increment and decrement actions. |
Nav Components
| name | description |
|---|---|
| SHeader(页头组件) | SHeader is a simple header component that is generated based on routing information |
| SMenu(菜单组件) | SMenu is a menu bar located on the left side that you can quickly generate through the menu-data property |
| STab(标签页组件) | provide tab functionality, so that users can switch between different content sections |
| STabbar(底部导航栏组件) | provide bottom operation bar for page switching |
| SCatalog(目录组件) | The Catalog component is used to display a series of catalog items, each of which can contain labels and icons, and has click interaction functionality |
Feedback Components
| name | description |
|---|---|
| SResult(结果组件) | SResult helps you easily build a quick prompt , you can build it in popup window |
| SPopup(弹出框组件) | A masked popup layer appears in the current window.And users will not be able to use the popup layer to cover the components under it.Clicking on the popup layer again will close it |
| STip(提示组件) | A tip provides supplemental, contextual information elevated near its target component |
| SLoading(加载组件) | This is a loading component that you can embed anywhere you want to add a loading animation |
| SDialog(对话框组件) | SDialogs are used to confirm messages or events and display text |
| SDrawer(抽屉组件) | Sometimes, the Dialogue component does not meet our needs.Such as your form being too long, or if you need to temporarily display some documents, please use the SDrawer |
| SAlert(通知组件) | SAlert is used to display important prompt information on the page |
| SPopover(气泡卡片组件) | A customizable popover component designed to display contextual information or interactive content, attached to an element and floating above the UI. It supports various positions and can be shown or hidden programmatically. |