找回密码
 加入
搜索
AUTOIT CN»论坛 › AU3交流 › 『 GUI 交流 』 › AUI界面库
12
返回列表 发新帖
楼主: 繁星

[皮肤] AUI界面库

[复制链接]
繁星
 楼主| 发表于 3 小时前 | 显示全部楼层
3131210 发表于 2026-6-15 07:52
创建tab的时候，在gui里面怎么编辑每个tab下面的控件？出个例子吧

顶部导航
#AutoIt3Wrapper_UseX64=n
#include "AUI.au3"

; ─── AUI 控件示例：Tabs导航标签页切换 ───  演示：点击顶部 Tabs 标签，下方内容区切换到对应界面（首页 / 数据 / 设置 / 关于）
Global $g_hWin = _UI_WindowCreate("AUI 示例 — Tabs顶部标签页切换", 900, 580)
Global $g_aPages[4]                       ; 4 个内容面板的 id（回调里切换）

; 根容器是纵向 Column：标题 → Tabs（在上）→ 内容区（在下）依次堆叠
Global $idRoot = _UI_Column($g_hWin, 0)
_UI_SetPadding($g_hWin, $idRoot, 24)
_UI_SetGap($g_hWin, $idRoot, 14)
_UI_Heading($g_hWin, $idRoot, "顶部标签页切换", 1, 0, 0, 0, 44)

; Tabs 全宽放在内容上方
Global $idTabs = _UI_Tabs($g_hWin, $idRoot, "首  页|数  据|设  置|关  于", 100, 0, 0, 0, 40)
_UI_OnValue($g_hWin, $idTabs, "OnNav")

; 内容区在 Tabs 下方，用 flex_grow 填满剩余高度；4 个面板叠在这里
Global $idContent = _UI_Column($g_hWin, $idRoot, 0, 0, 0, 0)
_UI_SetFlexGrow($g_hWin, $idContent, 1)

; 页 0：首页 / 概览
Global $page0 = _UI_Column($g_hWin, $idContent, 0, 0, 0, 0)
_UI_SetFlexGrow($g_hWin, $page0, 1)
_UI_SetGap($g_hWin, $page0, 12)
_UI_Heading($g_hWin, $page0, "首页 / 概览", 2, 0, 0, 0, 36)
_UI_Text($g_hWin, $page0, "这是首页面板。点击上方标签即可切换到不同的界面。", 0, 0, 0, 24)
Global $rowStat = _UI_Row($g_hWin, $page0, 0, 0, 0, 80)
_UI_SetGap($g_hWin, $rowStat, 12)
Global $st1 = _UI_Statistic($g_hWin, $rowStat, "今日访客", "1,284", "人", 0, 0, 0, 72)
Global $st2 = _UI_Statistic($g_hWin, $rowStat, "订单", "326", "单", 0, 0, 0, 72)
Global $st3 = _UI_Statistic($g_hWin, $rowStat, "转化率", "12.3", "%", 0, 0, 0, 72)
_UI_SetFlexGrow($g_hWin, $st1, 1)
_UI_SetFlexGrow($g_hWin, $st2, 1)
_UI_SetFlexGrow($g_hWin, $st3, 1)

; 页 1：数据
Global $page1 = _UI_Column($g_hWin, $idContent, 0, 0, 0, 0)
_UI_SetFlexGrow($g_hWin, $page1, 1)
_UI_SetGap($g_hWin, $page1, 12)
_UI_Heading($g_hWin, $page1, "数据统计", 2, 0, 0, 0, 36)
_UI_Text($g_hWin, $page1, "本周完成度：", 0, 0, 0, 22)
_UI_Progress($g_hWin, $page1, 72, 0, 0, 0, 10)
_UI_Text($g_hWin, $page1, "每日订单量：", 0, 0, 0, 22)
_UI_Chart($g_hWin, $page1, $AUI_CHART_BAR, "12|19|8|15|22|7|18", "一|二|三|四|五|六|日", 0, 0, 0, 200)

; 页 2：设置
Global $page2 = _UI_Column($g_hWin, $idContent, 0, 0, 0, 0)
_UI_SetFlexGrow($g_hWin, $page2, 1)
_UI_SetGap($g_hWin, $page2, 12)
_UI_Heading($g_hWin, $page2, "设置", 2, 0, 0, 0, 36)
_UI_Switch($g_hWin, $page2, "开启桌面通知", True, 0, 0, 0, 28)
_UI_Switch($g_hWin, $page2, "自动检查更新", False, 0, 0, 0, 28)
_UI_Text($g_hWin, $page2, "主题：", 0, 0, 0, 22)
_UI_Combo($g_hWin, $page2, "跟随系统|浅色|深色", 0, 0, 0, 220, 36)

; 页 3：关于
Global $page3 = _UI_Column($g_hWin, $idContent, 0, 0, 0, 0)
_UI_SetFlexGrow($g_hWin, $page3, 1)
_UI_SetGap($g_hWin, $page3, 10)
_UI_Heading($g_hWin, $page3, "关于", 2, 0, 0, 0, 36)
_UI_Text($g_hWin, $page3, "AUI — 为 AutoIt 打造的现代化 Windows 界面库。", 0, 0, 0, 24)
_UI_Text($g_hWin, $page3, "版本：0.2.0 Beta", 0, 0, 0, 24)
_UI_Link($g_hWin, $page3, "访问 AutoIt 中文网", "https://autoitx.com", 0, 0, 0, 24)

; 收集面板 id，默认显示第 0 页（其余自动隐藏）
$g_aPages[0] = $page0
$g_aPages[1] = $page1
$g_aPages[2] = $page2
$g_aPages[3] = $page3
_UI_SwitchPanel($g_hWin, $g_aPages, 0)

_UI_WindowShow($g_hWin)
_UI_Run()

; ── 回调 ────────────────────────────────────────────────────────────────────
Func OnNav($id, $iValue)
        _UI_SwitchPanel($g_hWin, $g_aPages, $iValue)
EndFunc
左侧导航
#AutoIt3Wrapper_UseX64=n
#include "AUI.au3"

; ─── AUI 控件示例：左侧导航切换 ───  演示：点击左侧 Sidebar 导航项，右侧内容区切换到对应界面（首页 / 数据 / 设置 / 关于）
Global $g_hWin = _UI_WindowCreate("AUI 示例 — Sidebar导航与多页切换", 900, 600)
Global $g_aPages[4]                       ; 4 个内容面板的 id（回调里切换）

Global $idRoot = _UI_Column($g_hWin, 0)
_UI_SetPadding($g_hWin, $idRoot, 24)
_UI_SetGap($g_hWin, $idRoot, 14)
_UI_Heading($g_hWin, $idRoot, "导航与多页切换", 1, 0, 0, 0, 44)

; 主体：左 Sidebar + 右内容区（高度固定，撑满标题下方）
Global $idBody = _UI_Row($g_hWin, $idRoot, 0, 0, 0, 450)
_UI_SetGap($g_hWin, $idBody, 20)

; —— 左侧导航 ——
Global $sNav = _UI_Glyph($AUI_GLYPH_HOME, "首  页") & "|" & _
                _UI_Glyph($AUI_GLYPH_CHART, "数  据") & "|" & _
                _UI_Glyph($AUI_GLYPH_SETTINGS, "设  置") & "|" & _
                _UI_Glyph($AUI_GLYPH_INFO, "关  于")
Global $idNav = _UI_Sidebar($g_hWin, $idBody, $sNav, 0, 0, 120, 450)
_UI_OnValue($g_hWin, $idNav, "OnNav")

; —— 右侧内容区：4 个面板叠在同一区域，一次只显示一个 ——
Global $idContent = _UI_Column($g_hWin, $idBody, 0, 0, 0, 0)
_UI_SetFlexGrow($g_hWin, $idContent, 1)

; 页 0：首页 / 概览
Global $page0 = _UI_Column($g_hWin, $idContent, 0, 0, 0, 0)
_UI_SetFlexGrow($g_hWin, $page0, 1)
_UI_SetGap($g_hWin, $page0, 12)
_UI_Heading($g_hWin, $page0, "首页 / 概览", 2, 0, 0, 0, 36)
_UI_Text($g_hWin, $page0, "这是首页面板。点击左侧导航即可切换到不同的界面。", 0, 0, 0, 24)
Global $rowStat = _UI_Row($g_hWin, $page0, 0, 0, 0, 80)
_UI_SetGap($g_hWin, $rowStat, 12)
Global $st1 = _UI_Statistic($g_hWin, $rowStat, "今日访客", "1,284", "人", 0, 0, 0, 72)
Global $st2 = _UI_Statistic($g_hWin, $rowStat, "订单", "326", "单", 0, 0, 0, 72)
Global $st3 = _UI_Statistic($g_hWin, $rowStat, "转化率", "12.3", "%", 0, 0, 0, 72)
_UI_SetFlexGrow($g_hWin, $st1, 1)
_UI_SetFlexGrow($g_hWin, $st2, 1)
_UI_SetFlexGrow($g_hWin, $st3, 1)

; 页 1：数据
Global $page1 = _UI_Column($g_hWin, $idContent, 0, 0, 0, 0)
_UI_SetFlexGrow($g_hWin, $page1, 1)
_UI_SetGap($g_hWin, $page1, 12)
_UI_Heading($g_hWin, $page1, "数据统计", 2, 0, 0, 0, 36)
_UI_Text($g_hWin, $page1, "本周完成度：", 0, 0, 0, 22)
_UI_Progress($g_hWin, $page1, 72, 0, 0, 0, 10)
_UI_Text($g_hWin, $page1, "每日订单量：", 0, 0, 0, 22)
_UI_Chart($g_hWin, $page1, $AUI_CHART_BAR, "12|19|8|15|22|7|18", "一|二|三|四|五|六|日", 0, 0, 0, 220)

; 页 2：设置
Global $page2 = _UI_Column($g_hWin, $idContent, 0, 0, 0, 0)
_UI_SetFlexGrow($g_hWin, $page2, 1)
_UI_SetGap($g_hWin, $page2, 12)
_UI_Heading($g_hWin, $page2, "设置", 2, 0, 0, 0, 36)
_UI_Switch($g_hWin, $page2, "开启桌面通知", True, 0, 0, 0, 28)
_UI_Switch($g_hWin, $page2, "自动检查更新", False, 0, 0, 0, 28)
_UI_Text($g_hWin, $page2, "主题：", 0, 0, 0, 22)
_UI_Combo($g_hWin, $page2, "跟随系统|浅色|深色", 0, 0, 0, 220, 36)
_UI_Text($g_hWin, $page2, "缓存上限（%）：", 0, 0, 0, 22)
_UI_Slider($g_hWin, $page2, 60, 0, 100, 0, 0, 0, 28)

; 页 3：关于
Global $page3 = _UI_Column($g_hWin, $idContent, 0, 0, 0, 0)
_UI_SetFlexGrow($g_hWin, $page3, 1)
_UI_SetGap($g_hWin, $page3, 10)
_UI_Heading($g_hWin, $page3, "关于", 2, 0, 0, 0, 36)
_UI_Text($g_hWin, $page3, "AUI — 为 AutoIt 打造的现代化 Windows 界面库。", 0, 0, 0, 24)
_UI_Text($g_hWin, $page3, "版本：0.2.0 Beta", 0, 0, 0, 24)
_UI_Link($g_hWin, $page3, "访问 AutoIt 中文网", "https://autoitx.com", 0, 0, 0, 24)

; 收集面板 id，默认显示第 0 页（其余自动隐藏）
$g_aPages[0] = $page0
$g_aPages[1] = $page1
$g_aPages[2] = $page2
$g_aPages[3] = $page3
_UI_SwitchPanel($g_hWin, $g_aPages, 0)

_UI_WindowShow($g_hWin)
_UI_Run()

; ── 回调 ────────────────────────────────────────────────────────────────────
; Sidebar / Tabs 点击都会回调 OnValue($id, $iValue)，$iValue 是选中项的 0 基索引
Func OnNav($id, $iValue)
        _UI_SwitchPanel($g_hWin, $g_aPages, $iValue)
EndFunc
回复

举报

繁星
 楼主| 发表于 3 小时前 | 显示全部楼层
life999 发表于 2026-6-14 16:24
新手怎么入门~~~~~~能解决新手入门的问题就好了

马上会添加每个控件的实例，以及更多应用实例
回复

举报

繁星
 楼主| 发表于 2 小时前 | 显示全部楼层
记得下载最新UDF
回复

举报

you74222
发表于 2 小时前 | 显示全部楼层
进度条的进度更新，怎么弄呢？
回复

举报

12
返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 加入

本版积分规则

QQ|手机版|小黑屋|AUTOIT CN ( 鲁ICP备19019924号-1 )谷歌 百度

GMT+8, 2026-6-15 16:01 , Processed in 0.069704 second(s), 14 queries .

Powered by Discuz! X3.5 Licensed

© 2001-2026 Discuz! Team.

快速回复 返回顶部 返回列表