lvgl-文本框学习篇(五)
学习材料/工具
-
QT Creator 5.12.3
学习内容/过程
-
零件和样式
-
用法
-
添加文字
-
占位符
-
删除字符
-
移动光标
-
隐藏光标
-
光标闪烁时间
-
单行模式
-
密码模式
-
文字对齐
-
字符过滤
-
最大文字长度
-
长文本
-
选择文字
-
滚动条
-
滚动传播
-
边缘闪烁
-
-
事件
-
按键处理
-
范例
-
简单的文本框
-
密码模式的文本区域
-
文字自动格式化
-
简介
文本框(lv_textarea) 是一个带有标签的页面(lv_page)。可以在其中添加文本或字符。长行被换行，并且当文本变得足够长时，可以滚动文本区域。
零件和样式
文本与界面(lv_page)具有相同的部分。期望LV_PAGE_PART_SCRL，因为它不能被引用并且始终是透明的。请参阅页面的详细文档。
除了Page部分之外，还存在虚拟’LV_TETAREA_PART_CURSOR’部分来绘制光标。光标的区域始终是当前字符的边界框。可以通过在LV_TEXTAREA_PART_CURSOR的样式中添加背景色和背景色来创建块光标。创建行光标使光标透明并设置border_side属性。
用法
- 添加文字
可以使用以下命令将文本或字符插入当前光标的位置：
-
lv_textarea_add_char(textarea, ‘c’);
-
lv_textarea_add_text(textarea, “insert this text”);
要添加宽字符，例如’á’，'ß’或 CJK字符(中日韩统一表意文字)，请使用
lv_textarea_add_text(textarea,“á”)。
lv_textarea_set_text(textarea, “New text”)更改整个文本。
- 占位符
可以使用lv_textarea_set_placeholder_text(textarea, “Placeholder text”)指定一个文本-当"文本"区域为空时显示。
- 删除字符
要从当前光标位置的左侧删除字符，请使用lv_textarea_del_char(textarea)。
要从右边删除，请使用lv_textarea_del_char(textarea)
- 移动光标
可以使用lv_textarea_set_cursor_pos(textarea,10)直接修改光标位置。0位置表示"在第一个字符之前"，LV_TA_CURSOR_LAST表示"在最后一个字符之后"
可以使用
- lv_textarea_cursor_right(textarea)
- lv_textarea_cursor_left(textarea)
- lv_textarea_cursor_up(textarea)
- lv_textarea_cursor_down(textarea)
如果调用lv_textarea_set_cursor_click_pos(textarea，true)，则光标将跳至单击"文本"区域的位置。
- 隐藏光标
可以使用lv_textarea_set_cursor_hidden(textarea, true)隐藏光标。
- 光标闪烁时间
光标的闪烁时间可以通过lv_textarea_set_cursor_blink_time(textarea,time_ms)进行调整.
- 单行模式
可以将"文本"区域配置为以lv_textarea_set_one_line(textarea,true)为一行。在此模式下，高度自动设置为仅显示一行，忽略换行符，并且禁用自动换行。
- 密码模式
文本区域支持可以通过lv_textarea_set_pwd_mode(textarea,true)启用的密码模式。
如果字体中存在(Bullet,U+2022)字符，则一段时间后或输入新字符后，输入的字符将转换为该字符。如果.u不存在，将使用*。
在密码模式下lv_textarea_get_text(textarea)给出真是文本，而不是项目符号字符。
可见时间可以使用lv_textarea_set_pwd_show_time(textarea, time_ms)进行调整。
- 文字对齐
可以使用lv_textarea_set_text_align(textarea, LV_TABEL_ALIGN_LET/CENTER/RIGHT)将文本左，中或右对齐。
- 字符过滤
可以使用lv_textarea_set_accepted_char(ta, “0123456789.±”)设置可接受字符的列表。其他字符将被忽略。
- 最大文本长度
最大字符可以通过lv_textarea_set_max_length(textarea, max_char_num)进行限制
- 长文本
如果"文本"区域中的文本很长(例如>20个字符)，则其滚动和绘制速度可能会很慢。但是，通过在lv_conf.h中启用LV_LABEL_LONG_TXT_HINT 1可以极大地改善它。它将保存z一些有关标签的信息，以加快其绘制速度。使用LV_LABEL_LONG_TXT_HIN，滚动和绘图将与使"普通"短文本一样块。
- 选择文字
如果通过lv_textarea_set_text_sel(textarea,true)启用，则可以选择一部分文本。就像用鼠标在PC上选择文本时一样。
- 滚动条
可以根据lv_textarea_set_scrollbar_mode(textarea, LV_SCRLBAR_MODE_…)设置的不同策略显示滚动条。在Page对象中了解更多信息。
- 滚动传播
当"文本"区域在另一个可滚对象(如"页面")上滚动并且滚动已到达"文本"区域的边缘时，滚动可以传播到父对象。也就是说，当"文本"区域可以进一步滚动时，父级将 被滚动。
- 边缘闪烁
当"文本"区域滚动到边缘时，如果通过lv_ta_set_edge_flash(ta,true)启用，则可以显示类似Flash动画的圆圈
事件
除了通用事件，文本框还支持以下特殊事件：
-
LV_EVENT_INSERT：在插入字符或文本之前发送。事件数据是计划插入的文本。lv_ta_set_insert_replac(ta,“新文本”)替换要插入的文本。新文本不能位于局部变量中，该全局变量会在事件回调存在时被销毁。""表示请勿插入任何内容。
-
LV_EVENT_VALUE_CHANGED：当文本区域的内容已更改时。
-
LV_EVENT_APPLY：当LV_EKY_ENTER发送到处于单行模式的文本y区域时。
按键处理
文本框可处理以下按键：
-
LV_KEY_UP/DOWN/LEFT/RIGHT 移动光标
-
Any character 将字符添加到当前光标位置
了解有关按键的更多内容。
范例
- 简单的文本框
/**
* @brief prvTextArea_Event_Handler
* @param e
*/
static void prvTextArea_Event_Handler(lv_event_t *e)
{
lv_obj_t *pGetEventTarget = lv_event_get_target(e);
LV_UNUSED(pGetEventTarget);
LV_LOG_USER("Enter was pressed. The current text is :%s",lv_textarea_get_text(pGetEventTarget));
}
/**
* @brief prvButton_Event_Handler
* @param e
*/
static void prvButton_Event_Handler(lv_event_t *e)
{
// 获取触发事件控件对象
lv_obj_t *pObj = lv_event_get_target(e);
// 读取到文本框对象中
lv_obj_t *pTextArea = lv_event_get_user_data(e);
// 获取触发对象的字符
const char *pTxt = lv_btnmatrix_get_btn_text(pObj, lv_btnmatrix_get_selected_btn(pObj));
if(strcmp(pTxt, LV_SYMBOL_BACKSPACE) == 0)
{
// 按下删除键，则文本框中文字
lv_textarea_del_char(pTextArea);
}else if (strcmp(pTxt, LV_SYMBOL_NEW_LINE) == 0) {
// 按下换行时，如果时NULL，文本框不会行
lv_event_send(pTextArea,LV_EVENT_READY,NULL);
}else {
// 把矩阵按钮按下的值添加到文本框中
lv_textarea_add_text(pTextArea, pTxt);
}
}
/**
* @brief prvSimpleTextArea
*/
static void prvSimpleTextArea(void)
{
// 创建文本框容器对象
lv_obj_t *pTextAreaSimple = lv_textarea_create(lv_scr_act());
// 文本框对象设置单行模式
lv_textarea_set_one_line(pTextAreaSimple,true);
// 文本框对象顶部居中对齐
lv_obj_align(pTextAreaSimple, LV_ALIGN_TOP_MID,0,10);
// 文本框添加事件回调函数
lv_obj_add_event_cb(pTextAreaSimple, prvTextArea_Event_Handler, LV_EVENT_READY,pTextAreaSimple);
// 确保文本框光标有效
lv_obj_add_state(pTextAreaSimple, LV_STATE_FOCUSED);
// 构造按钮矩阵
static const char *btnm_map[] = {"1", "2", "3", "\n",
"4", "5", "6", "\n",
"7", "8", "9", "\n",
LV_SYMBOL_BACKSPACE, "0", LV_SYMBOL_NEW_LINE, ""
};
// 创建按钮矩阵
lv_obj_t *pBtnm = lv_btnmatrix_create(lv_scr_act());
lv_obj_set_size(pBtnm,200,150);
lv_obj_align(pBtnm, LV_ALIGN_BOTTOM_MID,0,-10);
lv_obj_add_event_cb(pBtnm, prvButton_Event_Handler,LV_EVENT_VALUE_CHANGED,pTextAreaSimple);
// 当按下时，触发按钮聚焦
lv_obj_clear_flag(pBtnm, LV_OBJ_FLAG_CLICK_FOCUSABLE);
// 设置控制属性时可以通过一个map直接设置所有的按钮。
lv_btnmatrix_set_map(pBtnm, btnm_map);
}
- 密码文本框
// 键盘对象
static lv_obj_t *pKB_g;
/**
* @brief prvTextArea_Event_Handler
* @param e
*/
static void prvTextArea_Event_Handler(lv_event_t *e)
{
// 获取事件代码
lv_event_code_t pGetEventCode = lv_event_get_code(e);
// 获取事件对象
lv_obj_t *pGetEventTarget = lv_event_get_target(e);
LV_UNUSED(pGetEventTarget);
LV_LOG_USER("Enter was pressed. The current text is :%s",lv_textarea_get_text(pGetEventTarget));
if(pGetEventCode == LV_EVENT_CLICKED || pGetEventCode == LV_EVENT_FOCUSED)
{
if(pKB_g != NULL) lv_keyboard_set_textarea(pKB_g,pGetEventTarget);
}else if (pGetEventCode == LV_EVENT_READY) {
LV_LOG_USER("The current text is :%s",lv_textarea_get_text(pGetEventTarget));
}
}
/**
* @brief prvPwdFieldTextArea
*/
static void prvPwdFieldTextArea(void)
{
// 创建密码文本框
lv_obj_t *pPwdTextArea = lv_textarea_create(lv_scr_act());
lv_textarea_set_text(pPwdTextArea,"");
// 文本框设置成密码模式
lv_textarea_set_password_mode(pPwdTextArea,true);
// 文本框设置单行模式
lv_textarea_set_one_line(pPwdTextArea,true);
// 设置文本框的宽度
lv_obj_set_width(pPwdTextArea,lv_pct(40));
// 设置文本框的位置
lv_obj_set_pos(pPwdTextArea, 5, 20);
// 密码文本框添加事件
lv_obj_add_event_cb(pPwdTextArea,prvTextArea_Event_Handler,LV_EVENT_ALL,NULL);
// 创建标签容器对象
lv_obj_t *pPwdLbl = lv_label_create(lv_scr_act());
// 设置标签对象的文本值
lv_label_set_text(pPwdLbl, "PassWord:");
// 设置密码文本框和标签对象水平对齐
lv_obj_align_to(pPwdLbl, pPwdTextArea,LV_ALIGN_OUT_TOP_LEFT,0,0);
lv_obj_t *pTxtTextArea = lv_textarea_create(lv_scr_act());
lv_textarea_set_one_line(pTxtTextArea,true);
lv_textarea_set_password_mode(pTxtTextArea,true);
lv_obj_set_width(pTxtTextArea,lv_pct(40));
lv_obj_add_event_cb(pTxtTextArea,prvTextArea_Event_Handler,LV_EVENT_ALL,NULL);
lv_obj_align(pTxtTextArea, LV_ALIGN_TOP_RIGHT,-5,20);
lv_obj_t *pOnelineLbl = lv_label_create(lv_scr_act());
lv_label_set_text(pOnelineLbl, "Text:");
lv_obj_align_to(pOnelineLbl,pTxtTextArea, LV_ALIGN_OUT_TOP_LEFT,0,0);
// 创建键盘容器对象
pKB_g = lv_keyboard_create(lv_scr_act());
// 设置键盘大小
lv_obj_set_size(pKB_g, LV_HOR_RES, LV_VER_RES/2);
// 将密码文本框的聚焦在文本区域的开始
lv_keyboard_set_textarea(pKB_g,pPwdTextArea);
}
- 文字自动格式化
/**
* @brief prvAutoTextFmt_Handler
* @param e
*/
static void prvAutoTextFmt_Handler(lv_event_t *e)
{
lv_obj_t *pAtTxtFmtEventTarget = lv_event_get_target(e);
const char *pTxt = lv_textarea_get_text(pAtTxtFmtEventTarget);
if(pTxt[0] >= '0' && pTxt[0] <= '9' &&
pTxt[1] >= '0' && pTxt[1] <= '9' &&
pTxt[2] != ':') {
lv_textarea_set_cursor_pos(pAtTxtFmtEventTarget, 2);
lv_textarea_add_char(pAtTxtFmtEventTarget, ':');
}
}
/**
* @brief prvAutoTextFormatting
*/
static void prvAutoTextFormatting(void)
{
lv_obj_t *pAutoTextFmtting = lv_textarea_create(lv_scr_act());
lv_obj_add_event_cb(pAutoTextFmtting, prvAutoTextFmt_Handler,LV_EVENT_VALUE_CHANGED,NULL);
// 字符过滤
lv_textarea_set_accepted_chars(pAutoTextFmtting,"0123456789:");
// 设置文本最大长度
lv_textarea_set_max_length(pAutoTextFmtting,5);
lv_textarea_set_one_line(pAutoTextFmtting,true);
lv_textarea_set_text(pAutoTextFmtting,"");
pKB_g = lv_keyboard_create(lv_scr_act());
lv_obj_set_size(pKB_g, LV_HOR_RES, LV_VER_RES/2);
lv_keyboard_set_mode(pKB_g, LV_KEYBOARD_MODE_NUMBER);
lv_keyboard_set_textarea(pKB_g, pAutoTextFmtting);
// 设置文本最大长度
lv_textarea_set_max_length(pAutoTextFmtting,5);
lv_textarea_set_one_line(pAutoTextFmtting,true);
lv_textarea_set_text(pAutoTextFmtting,"");
pKB_g = lv_keyboard_create(lv_scr_act());
lv_obj_set_size(pKB_g, LV_HOR_RES, LV_VER_RES/2);
lv_keyboard_set_mode(pKB_g, LV_KEYBOARD_MODE_NUMBER);
lv_keyboard_set_textarea(pKB_g, pAutoTextFmtting);
}
学习结果
本篇文章主要记录了如何使用lv_textarea(文本框)。
341
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
