feat(uikit): 新增通用 UI 组件库与主题 token

This commit is contained in:
AndyChen1024
2026-09-11 16:22:45 +08:00
parent b73e74fa4a
commit d5e2d88c4c
12 changed files with 168 additions and 0 deletions

View File

@@ -0,0 +1,4 @@
export { AppColor, AppSpacing, AppFontSize } from './theme/Theme';
export { AppButton, ButtonVariant } from './components/AppButton';
export { LoadingView } from './components/LoadingView';
export { EmptyView } from './components/EmptyView';

View File

@@ -0,0 +1,33 @@
import { AppColor } from '../theme/Theme';
export enum ButtonVariant {
Primary = 'primary',
Secondary = 'secondary'
}
/**
* 通用按钮:@ComponentV2 + @Param 输入 + @Event 输出回调。
*/
@ComponentV2
export struct AppButton {
@Param text: string = '';
@Param variant: ButtonVariant = ButtonVariant.Primary;
@Param disabled: boolean = false;
@Event onTap: () => void;
build() {
Button(this.text)
.width('100%')
.height(48)
.fontSize(16)
.fontColor(this.variant === ButtonVariant.Primary ? AppColor.white : AppColor.primary)
.backgroundColor(this.variant === ButtonVariant.Primary ? AppColor.primary : AppColor.white)
.borderRadius(8)
.enabled(!this.disabled)
.onClick(() => {
if (!this.disabled) {
this.onTap();
}
})
}
}

View File

@@ -0,0 +1,20 @@
import { AppColor, AppFontSize } from '../theme/Theme';
/**
* 通用空态组件。
*/
@ComponentV2
export struct EmptyView {
@Param text: string = '暂无数据';
build() {
Column({ space: 8 }) {
Text('暂无内容')
.fontSize(AppFontSize.headline)
.fontColor(AppColor.textSecondary)
Text(this.text)
.fontSize(AppFontSize.body)
.fontColor(AppColor.textSecondary)
}
}
}

View File

@@ -0,0 +1,21 @@
import { AppColor, AppFontSize } from '../theme/Theme';
/**
* 通用加载态组件。
*/
@ComponentV2
export struct LoadingView {
@Param text: string = '加载中...';
build() {
Column({ space: 8 }) {
LoadingProgress()
.width(32)
.height(32)
.color(AppColor.primary)
Text(this.text)
.fontSize(AppFontSize.body)
.fontColor(AppColor.textSecondary)
}
}
}

View File

@@ -0,0 +1,29 @@
/**
* 主题 token:颜色 / 间距 / 字号。
* 全 App 统一从这里取值,避免散落魔法值。
*/
export class AppColor {
static readonly primary: string = '#0A59F7';
static readonly primaryPressed: string = '#094CCB';
static readonly textPrimary: string = '#182431';
static readonly textSecondary: string = '#66182431';
static readonly background: string = '#F1F3F5';
static readonly white: string = '#FFFFFF';
static readonly divider: string = '#0D182431';
static readonly danger: string = '#E84026';
}
export class AppSpacing {
static readonly xs: number = 4;
static readonly sm: number = 8;
static readonly md: number = 16;
static readonly lg: number = 24;
static readonly xl: number = 32;
}
export class AppFontSize {
static readonly caption: number = 12;
static readonly body: number = 14;
static readonly title: number = 16;
static readonly headline: number = 20;
}

View File

@@ -0,0 +1,10 @@
{
"module": {
"name": "uikit",
"type": "har",
"description": "$string:module_desc",
"deviceTypes": [
"phone"
]
}
}

View File

@@ -0,0 +1,8 @@
{
"string": [
{
"name": "module_desc",
"value": "uikit module"
}
]
}