×
↑
Logo
  • 入门指南
    • 源代码项目下载
    • 介绍
    • 软件架构
    • 安装在Windows操作系统上
      • 安装编译器
      • 安装 Python
      • 安装Scons
      • 通过CMD启动(Scons)
      • 通过CMD启动(CMake)
      • 通过VSCode启动
        • 安装VSCode
        • 打开项目
        • 运行项目
    • 显示
      • 手表工程
      • 仪表盘工程
  • GUI应用程序
    • C-APP 应用程序
      • 定义一个 C-APP
      • 创建一个C-APP的控件树
      • C-APP操作
      • C-APP 转场动画
        • 示例
      • API
        • gui_app_animation_t
        • gui_current_app()
        • gui_next_app()
        • gui_app_install()
        • gui_app_startup()
        • gui_app_shutdown()
        • gui_app_create()
        • gui_app_switch()
        • gui_app_layer_top()
        • gui_app_layer_buttom()
        • gui_app_get_layer()
        • gui_set_app_active_time()
        • gui_obj_tree_get_app()
        • gui_app_append()
        • gui_app_get_by_name()
        • gui_app
          • gui_app::screen
          • gui_app::xml
          • gui_app::window
          • gui_app::active_ms
          • gui_app::start_ms
          • gui_app::thread_id
          • gui_app::thread_entry
          • gui_app::server_hook
          • gui_app::ctor
          • gui_app::dtor
          • gui_app::ui_design
          • gui_app::startup_animation
          • gui_app::shutdown_animation
          • gui_app::lvgl
          • gui_app::arm2d
          • gui_app::close
          • gui_app::next
          • gui_app::close_sync
          • gui_app::startup_animation_flag
          • gui_app::shutdown_animation_flag
    • 使用可视化工具设计应用程序
      • RVisualDesigner
        • 概述
        • 示例
          • 示例1
          • 示例2
          • 烧录到 EVB
        • 功能面板
          • 工具箱/控件
            • 非容器化控件
              • 文本(Text)
              • 按钮(Button)
              • 单选按钮(RadioButton)
              • 图像(Image)
              • 图片影片(ImageMovie)
              • 滑动条(SeekBar)
              • 图像滑动条(Image SeekBar)
              • 单图片滑动条(SingleImage SeekBar)
              • 拇指滑动条(ThumbSeekBar)
              • 侧边栏(SideBar)
              • 滚轮(Roller)
              • 图表(Chart)
              • 下拉框(ComboBox)
              • 日历(Calendar)
              • 菜单(Menu)
              • 按键(Key)
              • 开关(Switch)
              • 圆弧(Arc)
            • 容器控件
              • 屏幕(Screen)
              • 选项卡视图(TabView)和选项卡(Tab)
              • 页面(Page)
              • 窗口(Win)
          • 设计视图/画布
            • 选项卡视图 - 创建/删除/插入选项卡
              • 创建选项卡
              • 删除选项卡
              • 插入选项卡
            • 选项卡视图概览图
            • 设计视图的缩放
          • 属性视图
          • 控件树
        • 事件设置
          • 触发事件简介
          • 动作简介
          • 事件设置示例
            • Text - OnTime - Set Time
            • Text - OnPeripheral - Set Peripheral
            • Button - OnClick - Jump
            • RadioButton - OnSelect - Jump
            • Image - OnTime - Set Time
            • Win - OnClick - Jump
            • ImageSeekBar - OnComplete - Jump
            • ImageSeekBar - OnValueChange - Set Text Property
            • Switch - OnOn - Animation
            • Key - OnClick - Jump
        • 动画设置
          • 动画类型简介
          • 动画示例
            • 旋转
            • 透明度
            • 高级平移
            • 高级透明度
            • 平移
            • 缩放
            • 进度
            • 多重动画设置
        • 资源管理
          • 图像资源管理
            • 添加图像
              • 移除图像/图像文件夹
              • 重命名图像文件夹
            • 预览图像
            • 刷新
          • 字体资源管理
            • 添加第三方字体
            • 移除第三方字体
        • 菜单栏
          • 文件
            • 起始页
            • 保存
            • 退出保存
          • 编辑
            • 复制/粘贴
            • 删除
            • 撤销/重做
            • 转换项目
            • 修改项目名称
          • 设置
          • 图像转换设置
            • 扫描模式
            • 颜色空间
            • 压缩
          • 字体转换设置
          • 导出
          • 模拟
        • 快速入门教程
          • 如何创建项目
          • 如何编写 JavaScript 代码
          • 如何打开项目
          • 如何打开/关闭项目
          • 如何导出/打包项目
          • 如何进行模拟
        • GUI 演示项目
      • JavaScript语法
        • 窗口 (Win)
          • 隐藏窗口
          • 监听手势
          • 切换窗口
          • API
        • 按钮 (Button)
          • 监听按钮按下事件
          • API
        • 文本 (Text)
          • 编辑文本
          • API
        • 拖动条 (Seekbar)
          • 显示当前进度
          • 一个拖动进度条从0增加到100%的动画
          • API
        • 开关 (Switch)
          • 监听两个事件
          • 打开一个LED (P1_1)
          • API
        • 图片 (Image)
          • API
        • 应用程序 (App)
          • API
        • 进度条 (Progressbar)
          • API
        • 选项卡 (Tab)
          • API
      • XML语法
        • 元素
        • 嵌套
          • 规格
          • 示例
        • 窗口
        • 图片
      • 中间件
        • 包
        • 启动器
        • XML
        • JavaScript
        • 示例
          • 进度条 API
          • 定义一个进度条对象
          • 向进度条对象添加两个函数
          • 定义两个函数
          • 灯控制
          • 灯开关数据
          • GPIO 灯开关
          • MATTER 灯开关
          • MESH 灯开关
  • 控件
    • 窗口 (Window)
      • 使用方法
        • 创建窗口控件
        • 设定动画
        • 注册回调函数
        • 设置触摸保持状态
        • 获取进度
        • 缩放设定
        • 允许/禁止
        • 不透明度
        • 动画检查
        • 启动动画
        • 停止动画
        • 准备
        • 添加动画
      • API
        • gui_win_create()
        • gui_win_set_animate()
        • gui_win_left()
        • gui_win_right()
        • gui_win_up()
        • gui_win_down()
        • gui_win_press()
        • gui_win_release()
        • gui_win_long()
        • gui_win_click()
        • gui_win_hold_tp()
        • gui_win_get_animation_progress_percent()
        • gui_win_set_scale_rate()
        • gui_win_set_scope()
        • gui_win_set_opacity()
        • gui_win_is_animation_end_frame()
        • gui_win_start_animation()
        • gui_win_stop_animation()
        • gui_win_prepare()
        • gui_win_append_animate()
        • gui_win_move()
        • gui_win_get_x()
        • gui_win_get_y()
        • gui_win_t
          • gui_win_t::base
          • gui_win_t::animate
          • gui_win_t::animate_array
          • gui_win_t::scale
          • gui_win_t::scale_y
          • gui_win_t::checksum
          • gui_win_t::press_flag
          • gui_win_t::long_flag
          • gui_win_t::release_flag
          • gui_win_t::enter_auto_scale
          • gui_win_t::event5_flag
          • gui_win_t::scope
          • gui_win_t::hold_tp
          • gui_win_t::load
          • gui_win_t::animate_array_length
    • 图像 (Img)
      • 用法
        • 创建控件
        • 更新位置
        • 设定属性
        • 获取高度/宽度
        • 刷新大小
        • 混合模式
        • 移动
        • 旋转
        • 缩放
        • 不透明度
        • 动画效果
        • 质量
        • 截屏
      • 示例
      • API
        • gui_img_get_width()
        • gui_img_get_height()
        • gui_img_refresh_size()
        • gui_img_set_location()
        • gui_img_set_mode()
        • gui_img_set_attribute()
        • gui_img_rotation()
        • gui_img_scale()
        • gui_img_translate()
        • gui_img_skew_x()
        • gui_img_skew_y()
        • gui_img_set_opacity()
        • gui_img_set_tp_block()
        • gui_img_create_from_mem()
        • gui_img_create_from_ftl()
        • gui_img_create_from_fs()
        • gui_img_set_animate()
        • gui_img_set_quality()
        • gui_img_tree_convert_to_img()
        • gui_img_tree_convert_to_img_root_size()
        • gui_img_get_transform_scale_x()
        • gui_img_get_transform_scale_y()
        • gui_img_get_transform_degrees()
        • gui_img_get_transform_c_x()
        • gui_img_get_transform_c_y()
        • gui_img_get_transform_t_x()
        • gui_img_get_transform_t_y()
        • gui_img_append_animate()
        • gui_img_set_image_data()
        • gui_img_get_image_data()
        • gui_img_transform_t
          • gui_img_transform_t::degrees
          • gui_img_transform_t::c_x
          • gui_img_transform_t::c_y
          • gui_img_transform_t::scale_x
          • gui_img_transform_t::scale_y
          • gui_img_transform_t::t_x
          • gui_img_transform_t::t_y
          • gui_img_transform_t::t_x_old
          • gui_img_transform_t::t_y_old
        • gui_img_t
          • gui_img_t::base
          • gui_img_t::draw_img
          • gui_img_t::transform
          • gui_img_t::data
          • gui_img_t::filename
          • gui_img_t::ftl
          • gui_img_t::animate
          • gui_img_t::scope_x1
          • gui_img_t::scope_x2
          • gui_img_t::scope_y1
          • gui_img_t::scope_y2
          • gui_img_t::ax
          • gui_img_t::ay
          • gui_img_t::opacity_value
          • gui_img_t::blend_mode
          • gui_img_t::src_mode
          • gui_img_t::high_quality
          • gui_img_t::press_flag
          • gui_img_t::release_flag
          • gui_img_t::scope
          • gui_img_t::scope_flag
          • gui_img_t::tp_block
          • gui_img_t::load
          • gui_img_t::simple
          • gui_img_t::checksum
          • gui_img_t::animate_array_length
    • 文本 (Text)
      • 特性
      • 用法
        • 初始化字体文件
        • 创建文本控件
        • 设置文本属性
          • 设置文本
          • 字体类型
          • 文本内容
          • 文本编码
          • 文本转换为图片
          • 文本输入设置
          • 设置文本点击事件
          • 文本模式
          • 文本移动
          • 设置动画
      • 示例
        • 多文本控件
        • 动画文本控件
      • API
        • TEXT_MODE
          • TEXT_MODE::LEFT
          • TEXT_MODE::CENTER
          • TEXT_MODE::RIGHT
          • TEXT_MODE::MULTI_LEFT
          • TEXT_MODE::MULTI_CENTER
          • TEXT_MODE::MULTI_RIGHT
          • TEXT_MODE::MID_LEFT
          • TEXT_MODE::MID_CENTER
          • TEXT_MODE::MID_RIGHT
          • TEXT_MODE::SCROLL_X
          • TEXT_MODE::SCROLL_Y
          • TEXT_MODE::SCROLL_Y_REVERSE
          • TEXT_MODE::SCROLL_X_REVERSE
          • TEXT_MODE::VERTICAL_LEFT
          • TEXT_MODE::VERTICAL_RIGHT
        • FONT_SRC_TYPE
          • FONT_SRC_TYPE::GUI_FONT_SRC_BMP
          • FONT_SRC_TYPE::GUI_FONT_SRC_STB
          • FONT_SRC_TYPE::GUI_FONT_SRC_IMG
          • FONT_SRC_TYPE::GUI_FONT_SRC_MAT
          • FONT_SRC_TYPE::GUI_FONT_SRC_FT
          • FONT_SRC_TYPE::GUI_FONT_SRC_TTF
        • FONT_SRC_MODE
          • FONT_SRC_MODE::FONT_SRC_MEMADDR
          • FONT_SRC_MODE::FONT_SRC_FILESYS
          • FONT_SRC_MODE::FONT_SRC_FTL
        • T_GUI_TEXT_EVENT
          • T_GUI_TEXT_EVENT::TXT_EVENT_CLICK
          • T_GUI_TEXT_EVENT::TXT_EVENT_PSWD_DONE
        • gui_text_click()
        • gui_text_pswd_done()
        • gui_text_set()
        • gui_text_set_animate()
        • gui_text_mode_set()
        • gui_text_input_set()
        • gui_text_wordwrap_set()
        • gui_text_use_matrix_by_img()
        • gui_text_rendermode_set()
        • gui_text_set_min_scale()
        • gui_text_move()
        • gui_text_size_set()
        • gui_text_font_mode_set()
        • gui_text_type_set()
        • gui_text_emoji_set()
        • gui_text_encoding_set()
        • gui_text_set_matrix()
        • gui_text_content_set()
        • gui_text_convert_to_img()
        • gui_text_create()
        • gui_text_t
          • gui_text_t::base
          • gui_text_t::color
          • gui_text_t::animate
          • gui_text_t::scale_img
          • gui_text_t::emoji_path
          • gui_text_t::min_scale
          • gui_text_t::content
          • gui_text_t::data
          • gui_text_t::path
          • gui_text_t::matrix
          • gui_text_t::len
          • gui_text_t::font_len
          • gui_text_t::active_font_len
          • gui_text_t::char_width_sum
          • gui_text_t::char_height_sum
          • gui_text_t::char_line_sum
          • gui_text_t::offset_x
          • gui_text_t::offset_y
          • gui_text_t::mode
          • gui_text_t::charset
          • gui_text_t::font_type
          • gui_text_t::font_mode
          • gui_text_t::font_height
          • gui_text_t::emoji_size
          • gui_text_t::checksum
          • gui_text_t::layout_refresh
          • gui_text_t::content_refresh
          • gui_text_t::use_img_blit
          • gui_text_t::inputable
          • gui_text_t::ispasswd
          • gui_text_t::wordwrap
          • gui_text_t::scope
          • gui_text_t::rendermode
        • gui_text_line_t
          • gui_text_line_t::line_char
          • gui_text_line_t::line_dx
    • 选项卡容器 (Tabview)
      • 用法
        • 创建选项卡容器
        • 选项卡切换
        • 设置选项卡切换风格
        • 设置选项卡循环显示
      • 示例
      • API
        • T_SLIDE_STYLE
          • T_SLIDE_STYLE::CLASSIC
          • T_SLIDE_STYLE::REDUCTION
          • T_SLIDE_STYLE::FADE
          • T_SLIDE_STYLE::REDUCTION_FADE
          • T_SLIDE_STYLE::STACKING
          • T_SLIDE_STYLE::TAB_ROTATE
          • T_SLIDE_STYLE::TAB_CUBE
          • T_SLIDE_STYLE::TAB_PAGE
          • T_SLIDE_STYLE::TAB_ROTATE_BOOK
        • T_GUI_TABVIEW_EVENT
          • T_GUI_TABVIEW_EVENT::TABVIEW_EVENT_TAB_CHANGE
        • gui_tabview_create()
        • gui_tabview_jump_tab()
        • gui_tabview_set_style()
        • gui_tabview_loop_x()
        • gui_tabview_loop_y()
        • gui_tabview_tp_disable()
        • gui_tabview_enable_pre_load()
        • gui_tabview_tab_change()
        • gui_tabview_tab_id_t
          • gui_tabview_tab_id_t::x
          • gui_tabview_tab_id_t::y
        • gui_index_t
          • gui_index_t::x
          • gui_index_t::y
        • gui_jump_t
          • gui_jump_t::jump_flag
          • gui_jump_t::jump_id
        • gui_tabview_t
          • gui_tabview_t::base
          • gui_tabview_t::tab_cnt
          • gui_tabview_t::tab_cnt_left
          • gui_tabview_t::tab_cnt_right
          • gui_tabview_t::tab_cnt_up
          • gui_tabview_t::tab_cnt_down
          • gui_tabview_t::cur_id
          • gui_tabview_t::last_id
          • gui_tabview_t::jump
          • gui_tabview_t::style
          • gui_tabview_t::release_x
          • gui_tabview_t::release_y
          • gui_tabview_t::loop_x
          • gui_tabview_t::loop_y
          • gui_tabview_t::enable_pre_load
          • gui_tabview_t::tab_change_ready
          • gui_tabview_t::tab_need_pre_load
          • gui_tabview_t::tp_disable
          • gui_tabview_t::initial
          • gui_tabview_t::left_shot
          • gui_tabview_t::center_shot
          • gui_tabview_t::right_shot
          • gui_tabview_t::checksum
    • 选项卡 (Tab)
      • 用法
        • 创建选项卡控件
        • 设置选项卡切换风格
      • 示例
        • 选项卡控件
        • 选项卡容器控件翻转
        • 选项卡循环显示
      • API
        • gui_tab_create()
        • gui_tab_get_rte_obj()
        • gui_tab_set_style()
        • gui_tab_update_preload()
        • gui_tab_rotate()
        • gui_tab_reduction()
        • gui_tab_reduction_fade()
        • gui_tab_fade()
        • gui_tab_cube()
        • gui_tab_rotate_book()
        • gui_tab_id_t
          • gui_tab_id_t::x
          • gui_tab_id_t::y
          • gui_tab_id_t::z
        • gui_tab_t
          • gui_tab_t::base
          • gui_tab_t::id
          • gui_tab_t::style
          • gui_tab_t::normal
          • gui_tab_t::shot_obj
          • gui_tab_t::shot_pave_obj
          • gui_tab_t::rte_obj
        • gui_tab_stacking_t
          • gui_tab_stacking_t::scale
          • gui_tab_stacking_t::location
          • gui_tab_stacking_t::opacity
    • 幕布容器 (Curtainview)
      • 用法
        • 创建幕布容器控件
        • 回调函数
      • 示例
      • API
        • T_GUI_CURTAIN_ENUM
          • T_GUI_CURTAIN_ENUM::CURTAIN_UNDEFINED
          • T_GUI_CURTAIN_ENUM::CURTAIN_UP
          • T_GUI_CURTAIN_ENUM::CURTAIN_DOWN
          • T_GUI_CURTAIN_ENUM::CURTAIN_LEFT
          • T_GUI_CURTAIN_ENUM::CURTAIN_RIGHT
          • T_GUI_CURTAIN_ENUM::CURTAIN_MIDDLE
        • gui_curtainview_create()
        • gui_curtainview_set_done_cb()
        • gui_curtain_ext_id_t
          • gui_curtain_ext_id_t::x
          • gui_curtain_ext_id_t::y
        • gui_curtain_bool_t
          • gui_curtain_bool_t::up
          • gui_curtain_bool_t::down
          • gui_curtain_bool_t::left
          • gui_curtain_bool_t::right
        • gui_curtain_float_t
          • gui_curtain_float_t::up
          • gui_curtain_float_t::down
          • gui_curtain_float_t::left
          • gui_curtain_float_t::right
        • gui_curtainview_t
          • gui_curtainview_t::base
          • gui_curtainview_t::curtain_cnt
          • gui_curtainview_t::style
          • gui_curtainview_t::cur_curtain
          • gui_curtainview_t::scopes
          • gui_curtainview_t::orientations
          • gui_curtainview_t::scope_up
          • gui_curtainview_t::scope_down
          • gui_curtainview_t::scope_left
          • gui_curtainview_t::scope_right
          • gui_curtainview_t::down_flag
          • gui_curtainview_t::left_flag
          • gui_curtainview_t::init_flag
          • gui_curtainview_t::release_flag
          • gui_curtainview_t::spring_value
          • gui_curtainview_t::done_cb
          • gui_curtainview_t::has_center_curtain
          • gui_curtainview_t::has_left_curtain
          • gui_curtainview_t::has_right_curtain
          • gui_curtainview_t::has_up_curtain
          • gui_curtainview_t::has_down_curtain
          • gui_curtainview_t::cur_curtain_flag
          • gui_curtainview_t::middle_flag
          • gui_curtainview_t::middle_flag_left
          • gui_curtainview_t::middle_flag_up
          • gui_curtainview_t::up_flag
          • gui_curtainview_t::checksum
          • gui_curtainview_t::release_y
          • gui_curtainview_t::release_x
    • 幕布 (Curtain)
      • 用法
        • 创建幕布控件
        • 幕布控件方向
      • 示例
      • API
        • gui_curtain_create()
        • gui_curtain_t
          • gui_curtain_t::base
          • gui_curtain_t::orientation
          • gui_curtain_t::scope
    • 页面 (Page)
      • 用法
        • 创建页面控件
      • 示例
      • API
        • T_PAGE_REBOUND_TYPE
          • T_PAGE_REBOUND_TYPE::PAGE_REBOUND_NOT
          • T_PAGE_REBOUND_TYPE::PAGE_REBOUND_UP
          • T_PAGE_REBOUND_TYPE::PAGE_REBOUND_DOWN
        • gui_page_update()
        • gui_page_destroy()
        • gui_page_ctor()
        • gui_page_create()
        • gui_page_create_horizontal()
        • gui_page_add_scroll_bar()
        • gui_page_set_offset()
        • gui_page_get_offset()
        • gui_page_set_animate()
        • gui_page_rebound()
        • gui_page_rebound_horizontal()
        • gui_page_center_alignment()
        • gui_page_set_only_top_slide()
        • gui_page_t
          • gui_page_t::base
          • gui_page_t::current_id
          • gui_page_t::widget_count
          • gui_page_t::width
          • gui_page_t::yold
          • gui_page_t::recode
          • gui_page_t::speed
          • gui_page_t::target
          • gui_page_t::start_x
          • gui_page_t::start_y
          • gui_page_t::align_hight
          • gui_page_t::scroll_bar
          • gui_page_t::get_yend
          • gui_page_t::animate
          • gui_page_t::ctor
          • gui_page_t::release
          • gui_page_t::press
          • gui_page_t::gesture_flag
          • gui_page_t::top_slide_only
          • gui_page_t::status
          • gui_page_t::src_mode
          • gui_page_t::checksum
    • 页面列表 (Page List)
      • 用法
        • 增加页面控件
        • 减少页面控件
        • 添加回调函数
        • 设定属性
        • 增加图片
        • 创建控件
          • 示例
          • API
            • gui_pagelist_update_cb_t
            • gui_pagelist_increase_real_list_max()
            • gui_pagelist_decrease_real_list_max()
            • gui_pagelist_add_list_update_cb()
            • gui_pagelist_set_att()
            • gui_pagelist_add_scroll_bar()
            • gui_pagelist_create()
            • gui_pagelist_t
              • gui_pagelist_t::base
              • gui_pagelist_t::show_list_max
              • gui_pagelist_t::real_list_max
              • gui_pagelist_t::list_first
              • gui_pagelist_t::list_last
              • gui_pagelist_t::scroll_bar
              • gui_pagelist_t::x_init
              • gui_pagelist_t::y_init
              • gui_pagelist_t::x_stop_scroll
              • gui_pagelist_t::y_stop_scroll
              • gui_pagelist_t::list_gap_y
              • gui_pagelist_t::show_border_top
              • gui_pagelist_t::show_border_bottom
              • gui_pagelist_t::h_set_done
              • gui_pagelist_t::update_list_first_cb
              • gui_pagelist_t::update_list_last_cb
              • gui_pagelist_t::list_count
              • gui_pagelist_t::src_mode
    • 开关(Switch)
      • 用法
        • 创建控件
        • 开/关
        • 更新开关状态
        • 改变开关控件状态
      • 示例
      • API
        • T_GUI_SWITCH_EVENT
          • T_GUI_SWITCH_EVENT::SWITCH_EVENT_TURN_ON
          • T_GUI_SWITCH_EVENT::SWITCH_EVENT_TURN_OFF
          • T_GUI_SWITCH_EVENT::SWITCH_EVENT_PRESSED
          • T_GUI_SWITCH_EVENT::SWITCH_EVENT_RELEASED
        • gui_switch_create()
        • gui_switch_create_from_fs()
        • gui_switch_create_from_ftl()
        • gui_switch_turn_on()
        • gui_switch_turn_off()
        • gui_switch_is_on()
        • gui_switch_is_off()
        • gui_switch_change_state()
        • _gui_api_for_gui_switch_t
        • gui_switch
          • gui_switch::base
          • gui_switch::switch_picture
          • gui_switch::on_pic_addr
          • gui_switch::off_pic_addr
          • gui_switch::on_hl_pic_addr
          • gui_switch::off_hl_pic_addr
          • gui_switch::long_touch_state_pic_addr
          • gui_switch::long_touch_state_hl_pic_addr
          • gui_switch::data
          • gui_switch::animate
          • gui_switch::src_mode
          • gui_switch::style
          • gui_switch::ifon
          • gui_switch::long_touch_state
          • gui_switch::long_touch_enable
          • gui_switch::press_flag
          • gui_switch::long_flag
          • gui_switch::release_flag
          • gui_switch::touch_disable
          • gui_switch::checksum
          • gui_switch::load
        • _gui_api_gui_switch_t
          • _gui_api_gui_switch_t::turn_off
          • _gui_api_gui_switch_t::turn_on
          • _gui_api_gui_switch_t::on_turn_on
          • _gui_api_gui_switch_t::on_turn_off
          • _gui_api_gui_switch_t::on_press
          • _gui_api_gui_switch_t::on_release
          • _gui_api_gui_switch_t::ctor
          • _gui_api_gui_switch_t::animate
          • _gui_api_gui_switch_t::turn_off_no_event
          • _gui_api_gui_switch_t::turn_on_no_event
    • 网格 (Grid)
      • 用法
        • 创建网格组件
        • 设置网格样式
      • 示例
        • 经典样式
      • API
        • T_GUI_GRID_STYLE
          • T_GUI_GRID_STYLE::GRID_CLASSIC
          • T_GUI_GRID_STYLE::GRID_SCALE
        • gui_grid_create()
        • gui_grid_style()
        • gui_grid_t
          • gui_grid_t::base
          • gui_grid_t::row
          • gui_grid_t::col
          • gui_grid_t::gap_col
          • gui_grid_t::gap_row
          • gui_grid_t::gap_col_scale
          • gui_grid_t::gap_row_scale
          • gui_grid_t::scale
          • gui_grid_t::yold
          • gui_grid_t::start_x
          • gui_grid_t::start_y
          • gui_grid_t::id_offset
          • gui_grid_t::row_count
          • gui_grid_t::row_count_flag
          • gui_grid_t::col_count_flag
          • gui_grid_t::style
          • gui_grid_t::col_count
          • gui_grid_t::change_threshold
    • 进度条 (Progressbar)
      • 用法
        • 创建水平方向控件
        • 创建垂直方向控件
        • 创建电影风格控件
        • 进度
        • 百分比
        • 获取最大值
      • 示例
      • API
        • gui_progressbar_img_h_create()
        • gui_progressbar_img_h_create_from_ftl()
        • gui_progressbar_img_v_create()
        • gui_progressbar_img_v_create_from_ftl()
        • gui_progressbar_movie_create()
        • gui_progressbar_movie_create_from_fs()
        • gui_progressbar_set_progress()
        • gui_progressbar_get_progress()
        • gui_progressbar_set_percentage()
        • gui_progressbar_get_percentage()
        • gui_progressbar_get_max()
        • gui_progressbar_thumb_h_create()
        • gui_progressbar_t
          • gui_progressbar_t::base
          • gui_progressbar_t::c
          • gui_progressbar_t::color
          • gui_progressbar_t::color_hl
          • gui_progressbar_t::max
          • gui_progressbar_t::per
          • gui_progressbar_t::per_history
          • gui_progressbar_t::ctor
          • gui_progressbar_t::src_mode
          • gui_progressbar_t::image_type
          • gui_progressbar_t::thumb_width
    • 画布 (Canvas)
      • 用法
        • 创建控件
        • 添加回调函数
      • 示例
        • 圆角矩形
        • 圆弧动画
      • API
        • Nanovg API
        • RealGUI API
          • gui_canvas_render_function
          • gui_canvas_create()
          • gui_canvas_set_canvas_cb()
          • gui_canvas_output()
          • gui_canvas_output_buffer()
          • gui_canvas_output_buffer_blank()
          • gui_canvas_output_buffer_blank_close()
          • gui_canvas_t
            • gui_canvas_t::base
            • gui_canvas_t::vg
            • gui_canvas_t::nanovg_canvas_cb
            • gui_canvas_t::checksum
            • gui_canvas_t::render
    • 返回 (Return)
      • 用法
        • 创建返回控件
      • 示例
      • API
        • gui_return_create()
        • gui_return_t
          • gui_return_t::base
          • gui_return_t::ignore_gesture_widget
  • 移植
    • 平台移植
      • 加速
      • 显示设备
      • 支持接口类型
      • 已验证屏幕驱动
      • 文件系统
      • 闪存转换层
      • 输入设备
      • 触摸芯片
      • 操作系统
        • 休眠管理
    • 字库移植
      • 点阵字库移植
        • 字形加载
          • 文本编码转换
          • 字库索引
        • 排版
        • 字符绘制
      • API
        • gui_font_mem_init()
        • gui_font_mem_init_ftl()
        • gui_font_mem_init_fs()
        • gui_font_mem_init_mem()
        • gui_font_mem_destroy()
        • gui_font_mem_load()
        • gui_font_mem_draw()
        • gui_font_mem_unload()
        • gui_font_mem_obj_destroy()
        • gui_get_mem_char_width()
        • gui_get_mem_utf8_char_width()
        • get_fontlib_by_size()
        • get_fontlib_by_name()
        • gui_font_mem_layout()
        • gui_font_get_dot_info()
        • gui_font_refresh_font_size()
        • GUI_CHAR_HEAD
          • GUI_CHAR_HEAD::char_y
          • GUI_CHAR_HEAD::baseline
          • GUI_CHAR_HEAD::char_w
          • GUI_CHAR_HEAD::char_h
        • mem_char_t
          • mem_char_t::unicode
          • mem_char_t::x
          • mem_char_t::y
          • mem_char_t::w
          • mem_char_t::h
          • mem_char_t::char_y
          • mem_char_t::char_w
          • mem_char_t::char_h
          • mem_char_t::dot_addr
          • mem_char_t::buf
          • mem_char_t::emoji_img
        • MEM_FONT_LIB
          • MEM_FONT_LIB::font_file
          • MEM_FONT_LIB::font_size
          • MEM_FONT_LIB::type
          • MEM_FONT_LIB::data
        • GUI_FONT_HEAD_BMP
          • GUI_FONT_HEAD_BMP::head_length
          • GUI_FONT_HEAD_BMP::file_type
          • GUI_FONT_HEAD_BMP::version
          • GUI_FONT_HEAD_BMP::font_size
          • GUI_FONT_HEAD_BMP::rendor_mode
          • GUI_FONT_HEAD_BMP::bold
          • GUI_FONT_HEAD_BMP::italic
          • GUI_FONT_HEAD_BMP::scan_mode
          • GUI_FONT_HEAD_BMP::index_method
          • GUI_FONT_HEAD_BMP::crop
          • GUI_FONT_HEAD_BMP::rsvd
          • GUI_FONT_HEAD_BMP::index_area_size
          • GUI_FONT_HEAD_BMP::font_name_length
          • GUI_FONT_HEAD_BMP::font_name
        • TEXT_CHARSET
          • TEXT_CHARSET::UTF_8
          • TEXT_CHARSET::UTF_16
          • TEXT_CHARSET::UTF_16LE
          • TEXT_CHARSET::UNICODE_ENCODING
          • TEXT_CHARSET::UTF_16BE
          • TEXT_CHARSET::UTF_32LE
          • TEXT_CHARSET::UTF_32BE
        • process_content_by_charset()
        • get_len_by_char_num()
        • generate_emoji_file_path_from_unicode()
        • gui_text_rect_t
          • gui_text_rect_t::x1
          • gui_text_rect_t::y1
          • gui_text_rect_t::x2
          • gui_text_rect_t::y2
          • gui_text_rect_t::xboundleft
          • gui_text_rect_t::xboundright
          • gui_text_rect_t::yboundtop
          • gui_text_rect_t::yboundbottom
    • HoneyGUI移植
      • 注意事项
        • 环境配置
        • 编译器选择
        • 路径配置
        • 常见问题处理
      • 编译环境要求
      • Armcc 编译
      • Armclang 编译
      • 工程移植示例
  • 示例
    • 计算器
      • 源文件
      • 操作步骤
        • 1. 声明 APP 的结构体
        • 2. 定义 APP :func:ui_design 函数
    • 86Box
      • 源文件
      • UI设计
        • RVisualDesigner
      • Javascript
        • 交互
          • 灯光控制 switch
          • Tab 跳转 switch
    • LiteGFX
      • 趣戴介绍
      • 源文件
        • 控件适配层
        • 平台适配层
        • 核心lib
    • 状态栏
      • 实现
        • 文件
        • 设计
    • 水果忍者
      • 环境需求
      • 源文件
      • 配置
      • 调用步骤
        • 步骤 1: Declare the app ui design function
        • 步骤 2: Call function
      • 设计思路
    • 音乐播放器
      • 实现
        • 代码
        • 控件树设计
    • 计时器
      • 实现
        • 代码
        • 控件树设计
    • 表盘市场
      • 实现
        • 代码
        • 控件树设计
  • 工具
    • 图像转换工具
      • 图像格式转换
        • 配置
        • 颜色空间
      • 输出文件
    • 字体转换工具
      • 生成字体bin文件
      • FontConfig.json参数说明
      • Setting.ini 参数说明
    • 打包工具
      • RTL87x2G and RTL8762D
      • RTL8763E and RTL8773DO
      • RTL8773E
        • 生成用户数据
        • 添加头部信息
    • 烧录工具
      • 下载到EVB中
  • 设计说明
    • RealUI系统概述
      • RealUI工作流程
        • 系统
        • GUI服务器
        • GUI应用程序
        • GUI服务器任务
    • 输入子系统
      • 触摸板
        • 触摸板硬件和驱动程序
        • 获取触摸板数据
        • 触摸板算法处理器
        • 控件响应
      • 键盘
        • 硬件和驱动程序
        • 获取键盘数据
        • 键盘算法处理器
        • 响应
    • 显示子系统
      • 显示工作流程
        • Flash文件系统
        • UI控件
        • 加速层
        • 缓冲区
    • 软件加速
      • 总体流程图
      • 无RLE覆盖模式概述
        • 无RLE覆盖模式(不带矩阵变换)
        • 无RLE覆盖模式(带矩阵变换)
      • 无RLE旁路模式概述
        • 无RLE旁路模式(不带矩阵变换)
        • 无RLE旁路模式(带矩阵变换)
      • 无RLE滤黑模式概述
        • 无RLE滤黑模式(不带矩阵变换)
        • 无RLE旁路模式(带矩阵变换)
      • 无RLE混合模式概述
        • 无RLE混合覆盖模式(不带矩阵变换)
        • 无RLE混合覆盖模式(带矩阵变换)
      • RLE覆盖模式概述
        • RLE覆盖模式(不带矩阵变换)
        • RLE覆盖模式(带矩阵变换)
      • RLE旁路模式概述
        • RLE旁路模式(不带矩阵变换)
        • RLE旁路模式(带矩阵变换)
      • RLE滤黑模式概述
        • RLE滤黑模式(不带矩阵变换)
        • RLE滤黑模式(带矩阵变换)
      • RLE混合模式概述
        • RLE混合模式(不带矩阵变换)
        • RLE源覆盖模式(带矩阵变换)
      • 支持的输入类型和输出类型
  • 第三方支持
    • 使用 ARM-2D 设计应用程序
      • ARM-2D介绍
  • 常见问题
    • 开发环境
      • 在VSCode中使用模拟器
        • 安装适当版本的工具链
        • 添加工具链到系统环境变量
    • 移植
      • 用户数据
      • JS分配堆内存
      • 喂狗
      • 不支持FPU
      • 文件系统
      • Flash设置
      • CPU频率
      • SCONS版本
    • 规格
      • 图形
      • 内存使用量
        • RTL8772F示例
        • 控件内存使用量
    • 帧率
      • 像素格式
      • 硬件加速
      • 数据传输速度
      • UI设计
      • 图像压缩
      • 字体
        • 自定义二进制文件
        • 标准TTF文件
    • 显示
      • 字体抗锯齿
  • 专业术语
  • 版本说明
    • Major Changes
      • v1.0.6.6
    • Change Logs
      • v1.0.6.6
RTKIOT GUI
  • 蜂窝菜单 (Menu cellular)
  • EN/中文

蜂窝菜单 (Menu cellular)

蜂窝菜单组件以蜂窝形状显示一组图标。

用法

创建蜂窝菜单组件

要创建蜂窝菜单组件,使用 gui_menu_cellular_create() 函数。用户需要提供代表图标集的图像文件数组。

配置偏移

使用 gui_menu_cellular_offset() 函数可以调整水平和垂直偏移以获得更好的显示效果。

示例


GUI_APP_ENTRY(APP_MENU)
{
    /**
     * @link https://docs.realmcu.com/Honeygui/latest/widgets/gui_menu_cellular.html#example
    */
    gui_win_t *win = gui_win_create(GUI_APP_ROOT_SCREEN, APP_MENU_WIN_NAME, 0, 0, 0, 0);
    /* app swap animation configration of the next app*/
    uint32_t *array[] =
    {
        I4500009_BIN,
        I4500011_BIN,
        I4500015_BIN,
        I4500020_BIN,
        I4500028_BIN,
        I4500034_BIN,
        I4500035_BIN,
        I4500037_BIN,
        I4500040_BIN,
        I4500042_BIN,
        I4500047_BIN,
        I4500049_BIN,
        I4500052_BIN,
        I4500064_BIN,
        I4500009_BIN,
        I4500011_BIN,
        I4500015_BIN,
        I4500020_BIN,
        I4500028_BIN,
        I4500034_BIN,
        I4500035_BIN,
        I4500037_BIN,
        I4500040_BIN,
        I4500042_BIN,
        I4500047_BIN,
        I4500049_BIN,
        I4500052_BIN,
        I4500064_BIN,
        I4500009_BIN,
        I4500011_BIN,
        I4500015_BIN,
        I4500020_BIN,
        I4500028_BIN,
        I4500034_BIN,
        I4500035_BIN,
        I4500037_BIN,
        I4500040_BIN,
        I4500042_BIN,
        I4500047_BIN,
        I4500049_BIN,
        I4500052_BIN,
        I4500064_BIN,
        I4500009_BIN,
        I4500011_BIN,
        I4500015_BIN,
        I4500020_BIN,

    };

    gui_menu_cellular_t *cell = gui_menu_cellular_create(win, 100, array,
                                                         sizeof(array) / sizeof(uint32_t *));
    gui_menu_cellular_offset((void *)cell, -36, -216);
    {
        struct gui_menu_cellular_gesture_parameter gesture_parameter_array[] =
        {
            {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1},
            {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1},
            {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1},
            {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1},
            {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1},
            {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1},
            {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1},
            {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1},
            {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1}, {app_menu_cb, (void *)1},
            {app_menu_cb, (void *)1},
        };
        gui_menu_cellular_on_click(cell, gesture_parameter_array,
                                   sizeof(gesture_parameter_array) / sizeof(gesture_parameter_array[0]));

    }
    //status_bar(win, (void *)cell);
    gui_return_create(win, gui_app_return_array,
                      sizeof(gui_app_return_array) / sizeof(uint32_t *), win_cb, (void *)cell);
}


API

Functions

gui_menu_cellular_t *gui_menu_cellular_create(void *parent, int icon_size, uint32_t *icon_array[], int array_size)

Create a honeycomb effect widget.

参数:
  • parent – The father widget nested in.

  • icon_size – Icon’s width(px).

  • icon_array – Icons set’s file address array.

  • array_size – The array’s size.

返回:

gui_menu_cellular_t*

void gui_menu_cellular_offset(gui_obj_t *menu_cellular, int offset_x, int offset_y)

Config offset.

参数:
  • menu_cellular – The menu_cellular pointer.

  • offset_x – Offset_x.

  • offset_y – Offset_y.

void gui_menu_cellular_on_click(gui_menu_cellular_t *menu_cellular, struct gui_menu_cellular_gesture_parameter *para_array, int array_length)

Listen to click events on the cellular menu.

It processes the click event based on the given gesture parameters.

参数:
  • menu_cellular – Pointer to the cellular menu structure.

  • para_array – Array of gesture parameters corresponding to the click event.

  • array_length – Length of the gesture parameters array.

gui_menu_cellular_t *gui_menu_cellular_create_ftl(void *parent, int icon_size, uint32_t *icon_array[], int array_size)

Create a honeycomb effect widget (ftl address mode).

参数:
  • parent – The father widget nested in.

  • icon_size – Icon’s width(px).

  • icon_array – Icons set’s file address array (ftl address mode).

  • array_size – The array’s size.

返回:

gui_menu_cellular_t*

struct gui_menu_cellular_t

Menu_cellular structure.

Public Members

gui_win_t base

base structure

void *overwrite
int x
int y
int16_t speed[2]
int16_t left
int16_t right
int16_t top
int16_t bottom
int16_t left_offset
int16_t right_offset
int16_t top_offset
int16_t bottom_offset
int16_t touch_y
bool render
struct gui_menu_cellular_gesture_parameter

Public Members

gui_event_cb_t callback_function
void *parameter

Copyrights ©瑞晟微电子有限公司 2025. All rights reserved. 苏ICP备10062199号-8