NewEmoji 93个组件演示，支持emoji，支持易语言/火山/C#/Python

口径说明：本文档以 Python 为准，易语言/火山/C# 同样可做到一样的效果

非Webui，非Webui，非Webui，重要的事情说三遍
视频演示：https://www.bilibili.com/video/BV17XLP67Euu/

• 开源仓库多语言接入矩阵

目录

• 基础布局（17 个）
• 表单输入（15 个）
• 选择媒体（14 个）
• 数据展示（17 个）
• 图表导航（14 个）
• 反馈流程（16 个）

new_emoji 是一个 Windows 原生 UI DLL，已提供易语言、Python ctypes、C# 对象式封装

开源仓库：https://github.com/mosheng20205/new-emoji

还提供商业版可视化设计器，一键导出易语言、C#

基础布局

面板、容器、区域、间距和基础视觉元素，适合快速理解单 HWND + D2D 的布局风格。

Python gallery 原始说明：面板、容器、区域、间距和基础视觉元素，适合快速理解单 HWND + D2D 的布局风格。

01. 🧱 面板 (Panel)

功能简介：
面板容器

状态/版本： 已完成 | 创建导出： EU_CreatePanel

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

02. 🚀 按钮 (Button)

功能简介：
按钮交互

状态/版本： 已完成 | 创建导出： EU_CreateButton

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

03. 💡 信息框 (InfoBox)

功能简介：
信息提示

状态/版本： 已完成 | 创建导出： EU_CreateInfoBox

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

04. 🔤 文本 (Text)

功能简介：
文本渲染

状态/版本： 已完成 | 创建导出： EU_CreateText

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

05. 🔗 链接 (Link)

功能简介：
链接状态

状态/版本： 已完成 | 创建导出： EU_CreateLink

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

06. ⭐ 图标 (Icon)

功能简介：
图标/emoji

状态/版本： 已完成 | 创建导出： EU_CreateIcon

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

07. ↔️ 间距 (Space)

功能简介：
占位间距

状态/版本： 已完成 | 创建导出： EU_CreateSpace

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

08. 📦 容器套件 (Container)

功能简介：
内容容器

状态/版本： 已完成 | 创建导出： EU_CreateContainer

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

09. 📌 顶栏 (Header)

功能简介：
顶栏容器

状态/版本： 已完成 | 创建导出： EU_CreateHeader

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

10. 🧭 侧边栏 (Aside)

功能简介：
侧边栏容器

状态/版本： 已完成 | 创建导出： EU_CreateAside

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

11. 📄 主要区域 (Main)

功能简介：
主要区域容器

状态/版本： 已完成 | 创建导出： EU_CreateMain

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

12. ✅ 底栏 (Footer)

功能简介：
底栏容器

状态/版本： 已完成 | 创建导出： EU_CreateFooter

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

13. 🧭 布局 (Layout)

功能简介：
自动布局

状态/版本： 已完成 | 创建导出： EU_CreateLayout

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

14. ▣ 边框 (Border)

功能简介：
边框区域

状态/版本： 已完成 | 创建导出： EU_CreateBorder

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

15. ➖ 分割线 (Divider)

功能简介：
分割线

状态/版本： 已完成 | 创建导出： EU_CreateDivider

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

16. 📌 固钉 (Affix)

功能简介：
固钉区域

状态/版本： 已完成 | 创建导出： EU_CreateAffix

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

17. 💧 水印 (Watermark)

功能简介：
水印背景

状态/版本： 已完成 | 创建导出： EU_CreateWatermark

📸 点击查看 UI 截图 (共2张)

深色模式

浅色模式

---

表单输入

输入、选择、评分和候选建议组件，重点展示键鼠交互与状态读回能力。

Python gallery 原始说明：输入、选择、评分和候选建议组件，重点展示键鼠交互与状态读回能力。

18. ☑️ 复选框 (Checkbox)

功能简介：
复选框

状态/版本： 已完成 | 创建导出： EU_CreateCheckbox

📸 点击查看 UI 截图 (共3张)

深色模式

点击/悬停状态

浅色模式

---

19. 🔘 单选框 (Radio)

功能简介：
单选项

状态/版本： 已完成 | 创建导出： EU_CreateRadio

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

20. 🎚️ 开关 (Switch)

功能简介：
开关

状态/版本： 已完成 | 创建导出： EU_CreateSwitch

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

21. 🎛️ 滑块 (Slider)

功能简介：
滑块

状态/版本： 已完成 | 创建导出： EU_CreateSlider

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

22. 🔢 数字输入框 (InputNumber)

功能简介：
数字输入

状态/版本： 已完成 | 创建导出： EU_CreateInputNumber

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

23. ⌨️ 输入框 (Input)

功能简介：
增强输入

状态/版本： 已完成 | 创建导出： EU_CreateInput

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

24. 🏷️ 标签输入 (InputTag)

功能简介：
标签输入

状态/版本： 已完成 | 创建导出： EU_CreateInputTag

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

25. 📋 选择器 (Select)

功能简介：
下拉选择

状态/版本： 已完成 | 创建导出： EU_CreateSelect

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

26. 🧾 虚拟选择器 (SelectV2)

功能简介：
虚拟选择

状态/版本： 已完成 | 创建导出： EU_CreateSelectV2

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

27. ⭐ 评分 (Rate)

功能简介：
评分

状态/版本： 已完成 | 创建导出： EU_CreateRate

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

28. 🎨 颜色选择器 (ColorPicker)

功能简介：
颜色选择

状态/版本： 已完成 | 创建导出： EU_CreateColorPicker

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

29. 🔎 自动补全 (Autocomplete)

功能简介：
自动完成

状态/版本： 已完成 | 创建导出： EU_CreateAutocomplete

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

30. @ 提及 (Mentions)

功能简介：
提及输入

状态/版本： 已完成 | 创建导出： EU_CreateMentions

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

31. 🧭 级联选择 (Cascader)

功能简介：
级联选择

状态/版本： 已完成 | 创建导出： EU_CreateCascader

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

32. 🔗 组合输入 (InputGroup)

功能简介：
组合输入

状态/版本： 已完成 | 创建导出： EU_CreateInputGroup

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

选择媒体

日期时间、树形选择、穿梭框、上传、图片和轮播等较完整的业务组件。

Python gallery 原始说明：日期时间、树形选择、穿梭框、上传、图片和轮播等较完整的业务组件。

33. 📅 日历 (Calendar)

功能简介：
日历全样式

状态/版本： 已完成 | 创建导出： EU_CreateCalendar

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

34. 🌳 树 (Tree)

功能简介：
树组件

状态/版本： 已完成 | 创建导出： EU_CreateTree

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

35. 🌲 树选择 (TreeSelect)

功能简介：
树选择

状态/版本： 已完成 | 创建导出： EU_CreateTreeSelect

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

36. 🔁 穿梭框 (Transfer)

功能简介：
穿梭框

状态/版本： 已完成 | 创建导出： EU_CreateTransfer

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

37. 📆 日期选择器 (DatePicker)

功能简介：
日期选择

状态/版本： 已完成 | 创建导出： EU_CreateDatePicker

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

38. 📅 日期范围选择器 (DateRangePicker)

功能简介：
日期范围

状态/版本： Gallery 演示项 | 创建导出： EU_CreateDatePicker + EU_SetDatePickerRangeSelect

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

39. 🕐 时间范围 (TimeRange)

功能简介：
时间范围

状态/版本： Gallery 演示项 | 创建导出： EU_CreateTimePicker + EU_SetTimePickerRangeSelect

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

40. 🗓️ 日期时间范围 (DateTimeRange)

功能简介：
日期时间范围

状态/版本： Gallery 演示项 | 创建导出： EU_CreateDateTimePicker + EU_SetDateTimePickerRangeSelect

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

41. ⏰ 时间选择器 (TimePicker)

功能简介：
时间选择

状态/版本： 已完成 | 创建导出： EU_CreateTimePicker

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

42. 🗓️ 日期时间选择器 (DateTimePicker)

功能简介：
日期时间

状态/版本： 已完成 | 创建导出： EU_CreateDateTimePicker

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

43. 🕘 时间选择 (TimeSelect)

功能简介：
时间候选

状态/版本： 已完成 | 创建导出： EU_CreateTimeSelect

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

44. 📤 上传 (Upload)

功能简介：
上传入口

状态/版本： 已完成 | 创建导出： EU_CreateUpload

📸 点击查看 UI 截图 (共4张)

正常状态

点击/悬停状态

---

45. 🖼️ 图片 (Image)

功能简介：
纯图片、边框、无边框、占位、懒加载、远程和预览列表

状态/版本： 已完成 | 创建导出： EU_CreateImage

📸 点击查看 UI 截图 (共7张)

正常状态

点击/悬停状态

浅色模式

---

46. 🎠 轮播 (Carousel)

功能简介：
轮播

状态/版本： 已完成 | 创建导出： EU_CreateCarousel

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

数据展示

状态、卡片、表格、统计指标和加载占位，适合后台工具与业务系统。

Python gallery 原始说明：状态、卡片、表格、统计指标和加载占位，适合后台工具与业务系统。

47. 🏷️ 标签 (Tag)

功能简介：
标签

状态/版本： 已完成 | 创建导出： EU_CreateTag

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

48. 🔴 徽标 (Badge)

功能简介：
徽标

状态/版本： 已完成 | 创建导出： EU_CreateBadge

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

49. 📈 进度条 (Progress)

功能简介：
进度条

状态/版本： 已完成 | 创建导出： EU_CreateProgress

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

50. 😀 头像 (Avatar)

功能简介：
头像

状态/版本： 已完成 | 创建导出： EU_CreateAvatar

📸 点击查看 UI 截图 (共2张)

正常状态

浅色模式

---

51. 📭 空状态 (Empty)

功能简介：
空状态

状态/版本： 已完成 | 创建导出： EU_CreateEmpty

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

52. 💀 骨架屏 (Skeleton)

功能简介：
骨架屏

状态/版本： 已完成 | 创建导出： EU_CreateSkeleton

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

53. 📋 描述列表 (Descriptions)

功能简介：
描述列表

状态/版本： 已完成 | 创建导出： EU_CreateDescriptions

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

54. 📊 表格 (Table)

功能简介：
表格

状态/版本： 已完成 | 创建导出： EU_CreateTable

📸 点击查看 UI 截图 (共9张)

正常状态

点击/悬停状态

浅色模式

---

55. 📋 列表框 (ListBox)

功能简介：
列表框

状态/版本： 已完成 | 创建导出： EU_CreateListBox

📸 点击查看 UI 截图 (共7张)

正常状态

点击/悬停状态

浅色模式

---

56. ♾️ 无限滚动 (InfiniteScroll)

功能简介：
无限滚动

状态/版本： 已完成 | 创建导出： EU_CreateInfiniteScroll

📸 点击查看 UI 截图 (共6张)

正常状态

点击/悬停状态

浅色模式

---

57. 💳 卡片 (Card)

功能简介：
基础、列表、图片和插槽卡片

状态/版本： 已完成 | 创建导出： EU_CreateCard

📸 点击查看 UI 截图 (共3张)

正常状态

点击图片放大

浅色模式

---

58. 📂 折叠面板 (Collapse)

功能简介：
折叠面板

状态/版本： 已完成 | 创建导出： EU_CreateCollapse

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

59. 🕒 时间线 (Timeline)

功能简介：
时间线

状态/版本： 已完成 | 创建导出： EU_CreateTimeline

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

60. 📌 统计数值 (Statistic)

功能简介：
统计数值

状态/版本： 已完成 | 创建导出： EU_CreateStatistic

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

61. 🎯 指标卡 (KPI Card)

功能简介：
指标卡

状态/版本： Gallery 演示项 | 创建导出： EU_CreateKpiCard

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

62. 📈 趋势 (Trend)

功能简介：
趋势

状态/版本： 已完成 | 创建导出： EU_CreateTrend

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

63. 🟢 状态点 (StatusDot)

功能简介：
状态点

状态/版本： 已完成 | 创建导出： EU_CreateStatusDot

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

图表导航

图表、菜单、锚点、页头和标签页，展示复杂信息组织能力。

Python gallery 原始说明：图表、菜单、锚点、页头和标签页，展示复杂信息组织能力。

64. 🎯 仪表盘 (Gauge)

功能简介：
仪表盘

状态/版本： 已完成 | 创建导出： EU_CreateGauge

📸 点击查看 UI 截图 (共2张)

正常状态

浅色模式

---

65. ⭕ 环形进度 (RingProgress)

功能简介：
环形进度

状态/版本： 已完成 | 创建导出： EU_CreateRingProgress

📸 点击查看 UI 截图 (共5张)

正常状态

点击/悬停状态

浅色模式

---

66. 🧭 子弹进度 (BulletProgress)

功能简介：
子弹进度

状态/版本： 已完成 | 创建导出： EU_CreateBulletProgress

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

67. 📈 折线图 (LineChart)

功能简介：
折线图

状态/版本： 已完成 | 创建导出： EU_CreateLineChart

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

68. 📊 柱状图 (BarChart)

功能简介：
柱状图

状态/版本： 已完成 | 创建导出： EU_CreateBarChart

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

69. 🍩 环形图 (DonutChart)

功能简介：
环形图

状态/版本： 已完成 | 创建导出： EU_CreateDonutChart

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

70. 📂 下拉菜单 (Dropdown)

功能简介：
下拉菜单

状态/版本： 已完成 | 创建导出： EU_CreateDropdown

📸 点击查看 UI 截图 (共7张)

正常状态

点击/悬停状态

浅色模式

---

71. 🧭 菜单 (Menu)

功能简介：
菜单

状态/版本： 已完成 | 创建导出： EU_CreateMenu

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

72. ⚓ 锚点 (Anchor)

功能简介：
锚点

状态/版本： 已完成 | 创建导出： EU_CreateAnchor

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

73. ⬆️ 回到顶部 (Backtop)

功能简介：
返回顶部

状态/版本： 已完成 | 创建导出： EU_CreateBacktop

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

74. 🔀 分段控制器 (Segmented)

功能简介：
分段控制

状态/版本： 已完成 | 创建导出： EU_CreateSegmented

📸 点击查看 UI 截图 (共5张)

正常状态

点击/悬停状态

浅色模式

---

75. 📄 页头 (PageHeader)

功能简介：
页头

状态/版本： 已完成 | 创建导出： EU_CreatePageHeader

📸 点击查看 UI 截图 (共5张)

正常状态

点击/悬停状态

浅色模式

---

76. 🍞 面包屑 (Breadcrumb)

功能简介：
面包屑

状态/版本： 已完成 | 创建导出： EU_CreateBreadcrumb

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

77. 📑 标签页 (Tabs)

功能简介：
标签页

状态/版本： 已完成 | 创建导出： EU_CreateTabs

📸 点击查看 UI 截图 (共6张)

正常状态

点击/悬停状态

浅色模式

---

反馈流程

提示、弹层、确认、引导、分页和步骤条，覆盖常见业务反馈流程。

Python gallery 原始说明：提示、弹层、确认、引导、分页和步骤条，覆盖常见业务反馈流程。

78. 📚 分页 (Pagination)

功能简介：
分页

状态/版本： 已完成 | 创建导出： EU_CreatePagination

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

79. 👣 步骤条 (Steps)

功能简介：
步骤条全样式

状态/版本： 已完成 | 创建导出： EU_CreateSteps

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

80. 🚨 警告提示 (Alert)

功能简介：
警告提示

状态/版本： 已完成 | 创建导出： EU_CreateAlert / EU_CreateAlertEx

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

81. ✅ 结果页 (Result)

功能简介：
结果页

状态/版本： 已完成 | 创建导出： EU_CreateResult

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

82. 💬 消息提示 (Message)

功能简介：
消息提示

状态/版本： 已完成 | 创建导出： EU_ShowMessage

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

83. 📬 消息框 (MessageBox)

功能简介：
消息框

状态/版本： 已完成 | 创建导出： EU_ShowMessageBoxEx

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

84. 🔔 通知 (Notification)

功能简介：
通知

状态/版本： 已完成 | 创建导出： EU_CreateNotification

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

85. ⏳ 加载 (Loading)

功能简介：
加载

状态/版本： 已完成 | 创建导出： EU_CreateLoading

📸 点击查看 UI 截图 (共4张)

正常状态

点击/悬停状态

浅色模式

---

86. 💬 对话框 (Dialog)

功能简介：
对话框

状态/版本： 已完成 | 创建导出： EU_CreateDialog

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

87. 📚 抽屉 (Drawer)

功能简介：
抽屉

状态/版本： 已完成 | 创建导出： EU_CreateDrawer

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

88. 💭 文字提示 (Tooltip)

功能简介：
文字提示

状态/版本： 已完成 | 创建导出： EU_CreateTooltip

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

---

89. 🗯️ 弹出框 (Popover)

功能简介：
气泡卡片

状态/版本： 已完成 | 创建导出： EU_CreatePopover

📸 点击查看 UI 截图 (共4张)

正常状态

点击/悬停状态

浅色模式

---

90. 💭 气泡卡片 (ElementPopover)

功能简介：
反馈流程.气泡卡片

状态/版本： Gallery 演示项 | 创建导出： ElementPopover

📸 点击查看 UI 截图 (共8张)

正常状态

点击/悬停状态

浅色模式

--- ### 91.💬元素弹层 (Popup) **功能简介：** 右键弹层绑定 **状态/版本：** 已完成 | **创建导出：** `EU_SetElementPopup` 📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

92. ❓ 气泡确认框 (Popconfirm)

功能简介：
确认气泡

状态/版本： 已完成 | 创建导出： EU_CreatePopconfirm

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

---

93. 🧭 漫游引导 (Tour)

功能简介：
引导

状态/版本： 已完成 | 创建导出： EU_CreateTour

📸 点击查看 UI 截图 (共3张)

正常状态

点击/悬停状态

浅色模式

Python打包程序UI演示exe下载：https://mscloak.lanzouv.com/iJIGT3ps4t7c