@techui/scifi

@techui/scifi

English | 中文

English

🚀 TechUI Scifi - Dynamic SVG Sci-Fi Component Library

A free, dynamic SVG UI component library for building sci-fi and futuristic interfaces, powered by Vue 3.

Strategy Adjustment

Strategy announcement: starting from version 0.1.0, the Scifi component library is functionally aligned with the current Prime version. Except for a small number of advanced components that still require authorization, Scifi now includes the full Prime feature set. In addition, the previously premium components TuiEcharts and TuiEchartsMap are now officially free to use.

The Prime component library is currently planning and developing other exclusive premium components to enhance its competitiveness.

✨ Features

• 🎨 Dynamic SVG Components - All components are drawn using dynamically calculated SVG elements for stunning visual effects
• 🆓 Free & Open - Evolved from the paid techui-vue2 library, now completely free to use
• 🌍 Built-in i18n - Multi-language support synchronized across all components
• 🎭 Theme System - Built-in theme functionality with seamless switching capabilities
• 📱 Best-in-Class Adaptive Component - The most powerful responsive solution on the market

📦 Components

• scifiButton - Futuristic interactive buttons
• scifiDeco - Decorative sci-fi elements
• scifiGeome - Geometric sci-fi shapes
• scifiHeader - Sci-fi style headers
• scifiPanel - Panel containers with sci-fi aesthetics
• scifiPanelTitle - Stylized panel titles
• TechUI Base Components (New in 0.0.7) - A selection of components from the TechUI base component library

🎯 TuiAdaptive - Revolutionary Responsive Component

The library includes TuiAdaptive, an incredibly powerful adaptive component that solves responsive design challenges once and for all using proportional scaling.

Key Features:

• Multiple adaptation modes for different scenarios
• Drag Mode - Activate via browser zoom functionality
• Coordinate Sync Container - Special solution for third-party map/GIS components (Cesium, etc.)
  • Prevents coordinate inaccuracy issues when GIS components are placed inside scaled containers
  • Uses a synchronized pass-through container to maintain accurate click coordinates

Proudly the best adaptive/responsive component available on the market today!

Documentation & Testcases

Documentation

• China: https://techui.cn/#/docs/
• Global: https://techui.net/#/docs

Testcases

• GitHub: https://github.com/aYin86cn/techui-scifi
• Gitee: https://gitee.com/ayin86/techui-scifi

Notes:

• The starter directory is a minimal startup project for TechUI-Scifi, containing only a few simple component demos.
• The testcases directory contains test scenarios for TechUI-Scifi, including demos for most components.

🖥️ TechUI Component Library

• @techui/prime: Closed-source Paid
• @techui/admin: Closed-source Free
• @techui/base: Closed-source Free
• @techui/scifi: Closed-source Free

📦 Dependencies

This library depends on the following TechUI ecosystem packages:

• @techui/colors - Color system
• @techui/lessmixins - LESS mixins
• @techui/locales - Internationalization
• @techui/themes - Theme system
• @techui/libs - Utility libraries
• @techui/utils - Utility functions

📄 License

UNLICENSED

👨‍💻 Author

aYin

• Email: [e-mail]
• WeChat: jay1986cn
• China Site: https://techui.cn/
• Global Site: https://techui.net/

中文

🚀 TechUI Scifi - 动态 SVG 科幻组件库

一个免费的、动态的 SVG UI 组件库,用于绘制科幻、未来风格的UI界面，基于 Vue 3 开发。

策略调整

策略调整公告：自 0.1.0 版本发布起，Scifi 组件库已实现与当前 Prime 版本的功能对齐。除个别高级组件仍需授权外，Scifi 已包含 Prime 的全部功能。此外，原高级组件 TuiEcharts 与 TuiEchartsMap 现已正式转为免费开放。

Prime组件库目前正在规划和开发其他的 独占高级组件 以提升其竞争力。

✨ 特性

• 🎨 动态 SVG 组件 - 所有组件均使用动态计算的 SVG 元素绘制，呈现炫酷视觉效果
• 🆓 完全免费 - 由付费组件库 techui-vue2 迭代而来，现已转为免费开放
• 🌍 内置多语言 - 多语言功能贯穿所有组件，支持同步切换
• 🎭 主题系统 - 内置主题功能，可在所有组件间无缝切换
• 📱 最强自适应组件 - 市面上最好用的响应式解决方案

📦 组件列表

• scifiButton - 未来感交互按钮
• scifiDeco - 科幻装饰元素
• scifiGeome - 几何科幻图形
• scifiHeader - 科幻风格头部
• scifiPanel - 科幻面板容器
• scifiPanelTitle - 科幻面板标题
• TechUI Base (0.1.0+) - TechUI基础组件库

🎯 TuiAdaptive - 革命性的自适应组件

库中包含功能强大的 TuiAdaptive 适配组件，采用等比缩放方式，让开发者一劳永逸地解决自适应问题。

核心功能:

• 多种适配模式，适应不同场景
• 拖拽模式 - 可通过浏览器缩放功能激活
• 同步穿透容器 - 专为第三方地图/GIS组件设计（Cesium等）
  • 解决 GIS 组件放置在缩放容器内部时点击坐标不准确的问题
  • 通过同步穿透容器保持准确的点击坐标

可以自豪地说，它是现在市面上最好用的自适应/适配组件！

文档与测试用例地址

文档

• 中国：https://techui.cn/#/docs/
• 全球：https://techui.net/#/docs

测试用例

• GitHub：https://github.com/aYin86cn/techui-scifi
• Gitee：https://gitee.com/ayin86/techui-scifi

说明：

• starter 目录是一个 TechUI-Scifi 工程的最小启动工程，内部仅有少量组件的简单 Demo。
• testcases 目录是 TechUI-Scifi 工程的测试用例，内部包含绝大多数组件的演示 Demo。

🖥️ TechUI组件库

• @techui/prime: 闭源 付费
• @techui/admin: 闭源 免费
• @techui/base: 闭源 免费
• @techui/scifi: 闭源 免费

📦 依赖项

该库依赖以下 TechUI 生态系统包:

• @techui/colors - 色彩系统
• @techui/lessmixins - LESS 混入
• @techui/locales - 国际化
• @techui/themes - 主题系统
• @techui/libs - 工具库
• @techui/utils - 工具函数

📄 许可证

UNLICENSED

👨‍💻 作者

aYin

• 邮箱：[e-mail]
• 微信：jay1986cn
• 中国站：https://techui.cn/
• 全球站：https://techui.net/

🏷️ Keywords

@techui techui-prime vue3 admin-panel dashboard sci-fi data-visualization responsive adaptive GIS Cesium workspace portal