顶部导航
- #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
复制代码
|