README.md

QuickBox 🚀

行业顶级的快应用多厂商兼容框架 - 一套代码，完美运行于所有厂商

✨ 特性

• 🎯 完美兼容 - 自动适配 OPPO、vivo、小米、华为、荣耀等9大厂商
• 🚀 零配置 - 开箱即用，无需额外配置
• 📦 轻量级 - 核心代码精简，无冗余依赖
• 🔒 类型安全 - 完整的 TypeScript 类型支持
• 🛠️ 易于扩展 - 清晰的架构设计，方便添加新厂商支持
• 📚 文档完善 - 详细的中文文档和示例
• 💰 支付支持 - 完美兼容各厂商支付平台
• 📱 广告支持 - 统一接口支持Banner、插屏、激励视频、原生广告
• 📖 阅读器工具 - 提供内容分页、屏幕适配等实用工具方法
• 🎯 加桌工具 - 统一的添加到桌面接口，自动适配各厂商差异
• ⚙️ 配置管理 - 统一的支付配置获取接口
• 🌐 请求增强 - 统一参数注入、401自动登录、请求拦截器
• 🔑 Token管理 - 统一的Token获取和缓存机制，避免重复请求
• 📊 应用状态 - 应用就绪状态管理，确保初始化完成后再执行操作
• 📍 来源追踪 - 用户来源追踪工具，支持过期时间管理
• 🛠️ 通用工具 - 防抖、节流、重试等常用工具函数
• 📱 设备增强 - 完整的设备信息获取（设备ID、OAID等）
• 💬 提示框 - Toast、Dialog、ActionMenu、Loading等完整提示能力
• 🔗 分享 - 统一的分享接口，支持文本、链接分享
• 📋 剪贴板 - 剪贴板读写能力
• 🌐 WebView - WebView加载和控制
• 🔔 推送 - 推送订阅和管理（支持vivo特殊实现）
• 📅 日历 - 日历事件插入功能
• 📱 应用信息 - 获取应用包名、版本、启动来源等信息
• 🌐 网络状态 - 网络类型检测和状态监听
• 🛠️ 路由增强 - 获取当前路由状态信息
• 📅 日期工具 - 日期格式化、计算、判断等实用函数
• 🔗 URL工具 - URL参数拼接等工具函数

📱 支持的厂商

厂商	最低版本	状态
OPPO	1100	✅
vivo	1100	✅
小米	1100	✅
华为	1100	✅
荣耀	1100	✅
魅族	计划中	🚧
中兴	计划中	🚧
努比亚	计划中	🚧
联想	计划中	🚧

🚀 快速开始

安装

npm install quickbox
# 或
yarn add quickbox
# 或
pnpm add quickbox

💡 提示：QuickBox 开箱即用，无需任何配置即可开始使用！

使用

import QuickBox from 'quickbox';

// 网络请求
const data = await QuickBox.get('https://api.example.com/users');
await QuickBox.post('https://api.example.com/users', { name: 'John' });

// 存储
await QuickBox.setStorage('user', { id: 1, name: 'John' });
const user = await QuickBox.getStorage('user');

// 路由
QuickBox.navigateTo({ uri: '/pages/detail', params: { id: 1 } });
QuickBox.navigateBack();

// 系统信息
const info = await QuickBox.getSystemInfo();
console.log('当前厂商:', info.brand);

// 能力检测
if (QuickBox.canIUse('payment')) {
  // 使用支付功能
}

// 账号登录（小米支付需要先登录）
const loginResult = await QuickBox.login('YOUR_MEMBER_ID');
if (loginResult.status === 'success') {
  console.log('登录成功', loginResult.openId);
}

// 支付（小米会自动处理登录流程）
const payResult = await QuickBox.vendorPay('ORDER_123', 10000, '商品描述', 'YOUR_MEMBER_ID');
if (payResult.status === 'success') {
  console.log('支付成功');
}

// 广告
if (QuickBox.canIUseAd('rewardedVideo')) {
  const rewardedVideoAd = QuickBox.createRewardedVideoAd({
    adUnitId: 'YOUR_AD_UNIT_ID'
  });
  rewardedVideoAd.load();
  rewardedVideoAd.onClose((res) => {
    if (res.isEnded) {
      console.log('观看完成，发放奖励');
    }
    rewardedVideoAd.load();
  });
  rewardedVideoAd.show();
}

📖 API 文档

Request（网络请求）

// GET 请求
QuickBox.get(url, params?, options?)

// POST 请求
QuickBox.post(url, data?, options?)

// PUT 请求
QuickBox.put(url, data?, options?)

// DELETE 请求
QuickBox.delete(url, options?)

// 通用请求
QuickBox.request({
  url: 'https://api.example.com/data',
  method: 'POST',
  data: { key: 'value' },
  header: { 'Content-Type': 'application/json' }
})

Storage（存储）

// 设置存储
await QuickBox.setStorage(key, value)

// 获取存储
const value = await QuickBox.getStorage(key)

// 删除存储
await QuickBox.removeStorage(key)

Router（路由）

// 跳转页面
QuickBox.navigateTo({ 
  uri: '/pages/detail', 
  params: { id: 1 } 
})

// 返回上一页
QuickBox.navigateBack()

// 重定向
QuickBox.redirectTo({ uri: '/pages/home' })

// 返回首页（自动适配各厂商差异）
// 注意：华为使用 clearStack()，其他厂商使用 clear()
QuickBox.navigateToHome()

System（系统）

// 获取系统信息
const info = await QuickBox.getSystemInfo()

// 检查能力支持
if (QuickBox.canIUse('push')) {
  // 使用推送功能
}

// 获取厂商信息
const vendorInfo = QuickBox.getVendorInfo()
console.log(vendorInfo.vendor) // 'oppo' | 'vivo' | 'xiaomi' | ...
console.log(vendorInfo.version) // 1100

Account（账号登录）

// 小米账号登录（使用 unionLogin）
const loginResult = await QuickBox.login('YOUR_MEMBER_ID')
if (loginResult.status === 'success') {
  console.log('登录成功', loginResult.openId) // 小米返回 openId
}

// 华为/荣耀账号授权（使用 authorize）
const hwLoginResult = await QuickBox.huaweiAuthorize('YOUR_HUAWEI_APPID')
if (hwLoginResult.status === 'success') {
  console.log('授权成功', hwLoginResult.token) // 华为返回 accessToken
}

// 完整登录方法
const unionResult = await QuickBox.unionLogin({
  accountType: 'app',
  memberId: 'YOUR_MEMBER_ID',
  extra: {
    huaweiAppId: 'YOUR_HUAWEI_APPID' // 华为/荣耀需要
  }
})

Payment（支付）

// ========== 小米支付 ==========
// 方式1：使用便捷方法（推荐）
const miPayResult = await QuickBox.xiaomiPay(
  'ORDER_123',      // cpOrderId
  10000,            // 金额（分）
  '商品名称',        // purchaseName
  'YOUR_MEMBER_ID'  // 必传，用于登录获取 openId
)

// 方式2：使用通用方法
const miPayResult2 = await QuickBox.vendorPay(
  'ORDER_123',
  10000,
  '商品名称',
  'YOUR_MEMBER_ID', // 必传
  { productType: 1, unit: 0 } // 扩展参数
)

// ========== 华为/荣耀支付 ==========
// 需要先授权获取 token
const hwToken = await QuickBox.huaweiAuthorize('YOUR_HUAWEI_APPID')
if (hwToken.status === 'success') {
  const hwPayResult = await QuickBox.huaweiPay(
    'ORDER_123',
    10000,
    'YOUR_APPLICATION_ID',  // 华为应用ID
    'YOUR_PUBLIC_KEY',      // 华为公钥
    'product_10000'         // 商品ID（可选）
  )
}

// ========== OPPO支付 ==========
// 需要从服务器获取 prePayToken 和 detailCode
const oppoPayResult = await QuickBox.oppoPay(
  'ORDER_123',
  'PRE_PAY_TOKEN',  // 从服务器获取
  'DETAIL_CODE'     // 从服务器获取
)

// ========== vivo支付 ==========
// 需要从服务器获取 payInfo.params
const vivoPayResult = await QuickBox.vivoPay(
  'ORDER_123',
  { /* payInfo.params 对象 */ } // 从服务器获取
)

// ========== 通用支付方法 ==========
const payResult = await QuickBox.pay({
  orderInfo: 'ORDER_123',
  payType: 'vendor',
  amount: 10000,
  description: '商品描述',
  // 根据厂商传入对应参数
  memberId: 'YOUR_MEMBER_ID',        // 小米需要
  applicationID: 'YOUR_APP_ID',      // 华为需要
  publicKey: 'YOUR_PUBLIC_KEY',      // 华为需要
  prePayToken: 'PRE_PAY_TOKEN',      // OPPO需要
  detailCode: 'DETAIL_CODE',         // OPPO需要
  payInfoParams: { /* ... */ }       // vivo需要
})

// ========== 微信支付（如果支持）==========
const wxResult = await QuickBox.wxpay('ORDER_123', { amount: 10000 })

// ========== 支付宝支付（如果支持）==========
const aliResult = await QuickBox.alipay('ORDER_123', { amount: 10000 })

重要说明：

• 小米支付：使用 pay.purchaseInApp()，必须先登录获取 openId
• 华为/荣耀支付：使用 pay.createPurchaseIntent()，需要 applicationID 和 publicKey，支付失败会自动补单
• OPPO支付：使用 pay.requestPayment()，需要 prePayToken 和 detailCode（从服务器获取）
• vivo支付：使用 pay.requestCashierPayment()，需要 payInfo.params（从服务器获取）
• vivo/OPPO支付：自2024年12月31日起，不再默认支持微信、支付宝，需要通过各自的支付平台接入

Ad（广告）

// 检查广告支持
if (QuickBox.canIUseAd('rewardedVideo')) {
  // 支持激励视频广告
}

// ========== 激励视频广告 ==========
const rewardedVideoAd = QuickBox.createRewardedVideoAd({
  adUnitId: 'YOUR_AD_UNIT_ID'
})

// 华为/荣耀需要先预加载（框架已自动处理）
// 其他厂商也可以手动预加载
rewardedVideoAd.load()

rewardedVideoAd.onLoad(() => {
  console.log('广告加载成功')
})

rewardedVideoAd.onError((err) => {
  console.log('广告加载失败', err)
})

rewardedVideoAd.onClose((res) => {
  if (res.isEnded) {
    console.log('用户观看完成，可以发放奖励')
  } else {
    console.log('用户中途退出')
  }
  // 重新加载广告
  rewardedVideoAd.load()
})

// 显示广告
rewardedVideoAd.show().catch((err) => {
  console.log('广告显示失败', err)
  rewardedVideoAd.load()
})

// ========== Banner广告 ==========
// 自动适配宽度：华为360，其他750（默认开启）
const bannerAd = QuickBox.createBannerAd({
  adUnitId: 'YOUR_AD_UNIT_ID',
  autoWidth: true, // 默认true，自动适配
  style: {
    left: 0,
    top: 100,
    height: 57
    // width会自动设置为华为360或其他750
  }
})

bannerAd.onLoad(() => {
  console.log('Banner广告加载成功')
})

bannerAd.onError((err) => {
  console.log('Banner广告加载失败', err)
})

bannerAd.show()

// 隐藏广告
bannerAd.hide()

// 销毁广告
bannerAd.destroy()

// ========== 插屏广告 ==========
const interstitialAd = QuickBox.createInterstitialAd({
  adUnitId: 'YOUR_AD_UNIT_ID'
})

interstitialAd.load()

interstitialAd.onLoad(() => {
  interstitialAd.show()
})

interstitialAd.onClose(() => {
  console.log('插屏广告关闭')
  // 重新加载
  interstitialAd.load()
})

// ========== 原生广告 ==========
// OPPO/小米/vivo：使用preloadAd，需要adCount参数（OPPO必传）
// 华为/荣耀：使用createNativeAd，需要预加载，荣耀需要allowRecommend参数
const nativeAd = QuickBox.createNativeAd({
  adUnitId: 'YOUR_AD_UNIT_ID',
  adCount: 1, // OPPO/小米/vivo必传
  allowRecommend: true // 荣耀必传
})

if (nativeAd) {
  // 华为/荣耀需要预加载（框架已自动处理）
  // OPPO/小米/vivo使用preloadAd，不需要手动load
  
  nativeAd.onLoad((data) => {
    console.log('原生广告数据', data)
    const adList = data.adList || []
    if (adList.length > 0) {
      const adData = adList[0]
      // 显示广告内容
      console.log('广告标题', adData.title)
      console.log('广告描述', adData.desc)
      console.log('广告图片', adData.imgUrlList)
      console.log('广告视频', adData.videoUrlList)
      
      // 上报曝光（需要传入adId）
      nativeAd.reportAdShow({ adId: adData.adId })
    }
  })
  
  nativeAd.onError((err) => {
    console.log('原生广告加载失败', err)
  })
  
  // 用户点击时上报
  nativeAd.reportAdClick({ adId: 'adId' })
  
  // 销毁广告
  nativeAd.destroy()
}

重要说明：

• 激励视频广告：华为/荣耀需要先预加载，框架已自动处理；超过1小时需重新加载
• 原生广告：
  • OPPO/小米/vivo：使用 preloadAd，需要 adCount 参数（OPPO必传）
  • 华为/荣耀：使用 createNativeAd，需要预加载，荣耀需要 allowRecommend 参数
  • 如果厂商不支持，调用 createNativeAd() 会返回 null
• Banner广告：框架自动适配宽度（华为360，其他750），可通过 autoWidth: false 关闭
• 版本要求：
  • Banner/插屏：OPPO 1044+, vivo 1052+, 小米 1062+, 华为 1075+
  • 激励视频：OPPO 1060+, vivo 1061+, 小米 1062+, 华为 1075+
  • 原生广告：OPPO 1060+, 华为 1075+（vivo和小米实际可用preloadAd）

// 厂商检测便捷方法（类似 $data.isMi = ['redmi', 'xiaomi'].includes($data.brand)） if (QuickBox.isXiaomi()) { // 小米系设备（包括小米和红米） }

if (QuickBox.isOppo()) { // OPPO系设备（包括OPPO和一加） }

if (QuickBox.isHuawei()) { // 华为设备 }

if (QuickBox.isHonor()) { // 荣耀设备 }

if (QuickBox.isHuaweiGroup()) { // 华为系设备（包括华为和荣耀） }

// ========== 阅读器工具 ========== import { ReaderUtils } from 'quickbox'

// 获取设备信息 const deviceInfo = await QuickBox.getSystemInfo()

// 内容分页 const result = ReaderUtils.splitContentIntoPages({ deviceInfo: { windowWidth: deviceInfo.windowWidth, windowHeight: deviceInfo.windowHeight, screenDensity: deviceInfo.screenDensity }, content: ['段落1内容', '段落2内容'], fontSize: 30, lineHeightRatio: 2.1, // 默认2.1 padding: 30, // 左右边距，默认30 topPadding: 100 // 顶部预留空间，默认100 })

console.log('分页结果', result.pages) // 分页后的内容数组 console.log('每页行数', result.linesPerPage) console.log('每行字符数', result.charsPerLine)

// 在分页内容中插入广告页 const pagesWithAd = ReaderUtils.insertAdPages( result.pages, 'iaa广告页', // 广告页标记 0, // 第一页索引 5, // 每5页插入一个广告 true // 第一页前也插入 )

// 计算Banner广告样式 const bannerStyle = ReaderUtils.calculateBannerStyle(deviceInfo, { height: 57, bottom: 20, isHuaweiGroup: QuickBox.isHuaweiGroup() // 华为系宽度360，其他750 })

// 格式化阅读时间 ReaderUtils.formatReadTime(3661) // "1小时1分1秒"

// 计算阅读进度 ReaderUtils.calculateProgress(5, 20) // 25（25%）

// ========== 加桌工具 ========== // 检查是否已添加到桌面 const isInstalled = await QuickBox.ShortcutUtils.checkInstalled()

// 获取加桌方式 const method = QuickBox.ShortcutUtils.getInstallMethod() if (method === 'install') { // 华为/OPPO：使用 API 方式 await QuickBox.ShortcutUtils.install({ success: () => console.log('添加成功'), fail: (err) => console.log('添加失败', err) }) } else { // 其他厂商：使用组件方式 // }

// ========== 配置管理 ========== // 获取华为支付配置 const huaweiConfig = await QuickBox.ConfigManager.getHuaweiConfig( 'https://api.example.com/app/config/getHuaweiConfig' )

// 自动根据当前厂商获取配置 const config = await QuickBox.ConfigManager.getConfigByVendor({ huawei: 'https://api.example.com/app/config/getHuaweiConfig', xiaomi: 'https://api.example.com/app/config/getXiaomiConfig', oppo: 'https://api.example.com/app/config/getOppoConfig', vivo: 'https://api.example.com/app/config/getVivoConfig' })

// ========== 网络请求增强 ========== // 配置统一参数（会自动添加到所有请求） QuickBox.Request.configure({ baseURL: 'https://api.example.com', baseParams: { max_app_id: 'YOUR_APP_ID', max_version: '1.0.0', max_brand: QuickBox.getVendorInfo().vendor }, timeout: 20000, onUnauthorized: async () => { // 401错误自动处理 await QuickBox.removeStorage('token') QuickBox.navigateTo({ uri: '/pages/login' }) } })

// 添加请求拦截器（添加Token） QuickBox.Request.addRequestInterceptor((options) => { const token = await QuickBox.getStorage('token') return { ...options, header: { ...options.header, Authorization: token } } })

// ========== Token管理 ========== // 获取华为Token（带缓存） const hwToken = await QuickBox.TokenManager.getHuaweiToken('YOUR_APPID', 'MEMBER_ID')

// 获取小米Token（带缓存） const miToken = await QuickBox.TokenManager.getXiaomiToken('MEMBER_ID')

// 根据厂商自动获取Token const token = await QuickBox.TokenManager.getTokenByVendor({ huaweiAppid: 'YOUR_APPID', xiaomiMemberId: 'MEMBER_ID' })

// ========== 应用状态管理 ========== // 设置应用就绪状态 QuickBox.AppStateManager.setReady(true)

// 等待应用就绪 await QuickBox.AppStateManager.waitForReady()

// 确保应用就绪后再执行 await QuickBox.AppStateManager.ensureReady(async () => { const data = await QuickBox.Request.get('/api/data') })

// ========== 来源追踪 ========== // 设置来源信息（7天后过期） await QuickBox.SourceTracker.setSource('content_123', 'origin_name', '书城', 7)

// 获取来源信息 const originName = await QuickBox.SourceTracker.getSource('content_123', 'origin_name')

// 获取所有来源 const sources = await QuickBox.SourceTracker.getAllSources('content_123')

// ========== 通用工具函数 ========== // 防抖 const debouncedSearch = QuickBox.debounce((keyword) => { console.log('搜索:', keyword) }, 300)

// 节流 const throttledScroll = QuickBox.throttle(() => { console.log('滚动事件') }, 100)

// 延迟 await QuickBox.delay(1000) // 等待1秒

// 重试 const result = await QuickBox.retry( () => QuickBox.Request.get('/api/data'), 3, // 最多重试3次 1000 // 每次重试间隔1秒 )

// ========== 设备信息增强 ========== // 获取设备详细信息 const deviceInfo = await QuickBox.getDeviceInfo()

// 获取设备ID const deviceId = await QuickBox.getDeviceUserId()

// 获取OAID const oaid = await QuickBox.getDeviceOAID()

// 获取完整设备信息（包括设备ID和OAID） const fullInfo = await QuickBox.Device.getFullInfo()

// ========== 提示框 ========== // Toast提示 QuickBox.showToast('操作成功') QuickBox.showToast({ message: '加载中...', duration: 2000 })

// 对话框 const result = await QuickBox.showDialog({ title: '提示', content: '确定要删除吗？', buttons: [ { text: '取消', color: '#999' }, { text: '确定', color: '#007AFF' } ] }) if (result.index === 1) { // 用户点击了确定 }

// 操作菜单 const index = await QuickBox.showActionMenu({ itemList: ['拍照', '从相册选择', '取消'] })

// 加载提示 QuickBox.showLoading({ message: '加载中...' }) // ... 执行操作 QuickBox.hideLoading()

// ========== 分享 ========== // 分享链接 await QuickBox.shareLink('https://example.com')

// 分享文本 await QuickBox.shareText('分享内容')

// 分享（自定义类型） await QuickBox.share({ type: 'text/html', data: 'https://example.com' })

// ========== 剪贴板 ========== // 设置剪贴板 await QuickBox.setClipboard('要复制的内容') QuickBox.showToast('复制成功')

// 获取剪贴板 const text = await QuickBox.getClipboard()

// ========== WebView ========== // 加载URL QuickBox.loadWebView({ url: 'https://example.com' })

// 向WebView发送消息 QuickBox.WebView.postMessage({ data: { type: 'update', value: 'new value' } })

// ========== 推送 ========== // 检查是否支持推送 if (QuickBox.Push.isSupported()) { // 订阅推送 const result = await QuickBox.subscribePush() console.log('推送regId:', result.regId)

// 获取推送提供商 const provider = QuickBox.getPushProvider() console.log('推送提供商:', provider) }

// ========== 日历 ========== // 插入日历事件 await QuickBox.insertCalendar({ title: '签到提醒', startDate: new Date('2024-01-01 20:00').getTime(), endDate: new Date('2024-01-01 21:00').getTime(), duration: 'PT1H', // ISO 8601格式，1小时 remindMinutes: [0, 5], // 开始前0分钟和5分钟提醒 rrule: 'FREQ=DAILY' // 每天重复 })

// ========== 应用信息 ========== // 获取应用信息 const appInfo = await QuickBox.getAppInfo() console.log('包名:', appInfo.packageName) console.log('版本:', appInfo.versionName) console.log('启动来源:', appInfo.source?.type)

// 退出应用 QuickBox.terminateApp()

// ========== 网络状态 ========== // 获取当前网络类型 const networkInfo = await QuickBox.getNetworkType() console.log('网络类型:', networkInfo.type) // 'wifi' | '4g' | 'none' 等 console.log('是否联网:', networkInfo.isConnected)

// 监听网络状态变化 const unsubscribe = QuickBox.subscribeNetwork((info) => { console.log('网络状态变化:', info.type) })

// 取消监听 unsubscribe()

// ========== 路由状态 ========== // 获取当前路由状态 const routerState = QuickBox.getRouterState() console.log('当前路径:', routerState.path) console.log('页面索引:', routerState.index) console.log('页面参数:', routerState.params)

// ========== 存储增强 ========== // 清除所有存储 await QuickBox.Storage.clear()

// ========== 日期工具函数 ========== // 格式化秒数为时分秒 const time = QuickBox.formatSeconds(3661) console.log(time) // { hours: "01", minutes: "01", seconds: "01" }

// 获取当前日期 const today = QuickBox.getDate() // "2024-01-15"

// 获取指定日期之前N天的日期 const beforeDate = QuickBox.getBeforeDate('2024-01-15', 5) // "2024-01-10"

// 判断是否是今天 const isToday = QuickBox.checkToday('2024-01-15') // true/false

// ========== URL工具函数 ========== // 拼接URL和参数 const url = QuickBox.queryString('https://example.com', { id: 1, name: 'test' }) // => "https://example.com?id=1&name=test"

// ========== 其他工具函数 ========== // 数字递增动画 QuickBox.countUp({ startValue: 0, targetValue: 100, duration: 1500, updateInterval: 60, onUpdate: (value) => { console.log('当前值:', value) }, onComplete: () => { console.log('动画完成') } })

// 格式化字符串为数组（按数字和字符串区分） const arr = QuickBox.formatStringToArray('abc123def456') // => ["abc", "123", "def", "456"]

// 根据值查找数组中的标签 const label = QuickBox.valueToLabel(1, [ { value: 1, label: '选项1' }, { value: 2, label: '选项2' } ]) // => "选项1"

## 🏗️ 架构设计

QuickBox 采用适配器模式，为每个厂商实现独立的适配器，通过统一的 API 接口对外提供服务。

┌─────────────────┐ │ Your App │ └────────┬────────┘ │ ┌────────▼────────┐ │ QuickBox API │ ← 统一接口 └────────┬────────┘ │ ┌────────▼────────┐ │ Adapter Layer │ ← 适配器层 └────────┬────────┘ │ ┌────┴────┬────────┬────────┐ │ │ │ │ ┌───▼───┐ ┌──▼───┐ ┌──▼───┐ ┌──▼───┐ │ OPPO │ │ vivo │ │小米 │ │华为 │ └───────┘ └──────┘ └──────┘ └──────┘

## 🔧 开发

```bash
# 克隆项目
git clone https://github.com/hackerFish/quickBox.git
cd quickBox

# 安装依赖
npm install

# 构建
npm run build

# 开发模式
npm run dev

🧩 组件库

QuickBox 提供开箱即用的 ux 组件，包括：

布局组件

• 📋 PageTitleBar - 页面标题栏
• ⬅️ BackButton - 返回按钮
• 🎴 Card - 卡片组件

列表组件

• 📝 List - 通用列表
• 🔲 GridList - 网格列表（适用于视频、图片展示）
• ⬇️ ListMore - 加载更多组件

视频播放器组件

• 🎬 VideoPlayer - 视频播放器主组件
• 🎮 VideoControl - 视频控制栏
• ℹ️ VideoInfo - 视频信息栏
• 📑 SectionSelector - 章节选择器

阅读器组件

• 📖 Reader - 小说阅读器主组件
• ⚙️ ReaderControl - 阅读器控制栏
• 📚 ReaderCatalog - 阅读器目录

通用组件

• 💬 Dialog - 通用弹窗
• ⏳ Loading - 加载组件
• 📭 Empty - 空状态组件
• 💳 PayConfirm - 支付确认弹窗

功能组件

• 🏠 AddDesktop - 添加桌面引导
• 🔗 ShareButton - 分享按钮

详细使用文档请查看：组件库文档

📚 文档

• 📖 使用文档 - 完整的使用指南和示例
• 🧩 组件库文档 - 开箱即用的ux组件使用指南
• 🏗️ 架构设计 - 架构设计文档
• ✅ 自检报告 - 易用性与兼容性自检报告
• 🔍 框架对比分析 - 与主流框架（uni-app、Taro）的深度对比和优化建议
• 🔍 兼容性文档 - 各厂商API差异说明
• 📊 兼容性矩阵 - 快速查阅兼容性矩阵
• 📋 兼容性检查报告 - 详细的兼容性检查结果
• 📈 功能差距分析 - 与主流框架的功能对比
• 💡 最佳实践 - 实际项目使用指南
• 📄 项目分析报告 - 基于真实项目的分析

主要差异包括：

• 返回首页：华为使用 clearStack()，其他厂商使用 clear()
• 支付接口：vivo和OPPO自2024年12月31日起不再默认支持微信、支付宝，需接入各自支付平台
• 事件处理：各厂商事件对象处理方式不同
• 语音播放：接口实现存在差异
• 文件引入：自定义文件引入机制不同

QuickBox 已自动处理这些差异，开发者无需关心底层实现。

📝 贡献指南

我们欢迎所有形式的贡献！请查看 CONTRIBUTING.md 了解详情。

📄 许可证

MIT © 2025

🙏 致谢

感谢所有快应用联盟厂商提供的支持！

📞 联系我们

• Issues: GitHub Issues
• Discussions: GitHub Discussions

---

如果这个项目对你有帮助，请给个 ⭐ Star！