LVGL7.0高级界面开发-2

自定义键盘

系统定义的键盘不喜欢，反正代码开源，可以自己定制,还可以移动哦。

键盘代码.c文件

#include "lvgl/lvgl.h"
#include "../inc/user_keyboard.h"
#include <stdio.h>

User_Keyboard_info  User_Keyboard_t;
User_Keyboard_def  User_Keyboard_d;
lv_obj_t* label2; 

static const char* btnm_num_map[] = { LV_SYMBOL_LEFT, LV_SYMBOL_RIGHT, LV_SYMBOL_BACKSPACE,"\n",
                                                                  "1", "2", "3","\n",
                                                                  "4", "5", "6", "\n",
                                                                  "7", "8", "9", "\n",
                                                                  "+/-","0", ".","" };

static const char* btnm_map[] = { LV_SYMBOL_CLOSE, "" };

static void event_handler(lv_obj_t* obj, lv_event_t event)
{
    if (event == LV_EVENT_VALUE_CHANGED)
    {
        lv_label_set_text(label2, lv_textarea_get_text(User_Keyboard_d.testta));
        lv_obj_align(label2, User_Keyboard_t.cont, LV_ALIGN_IN_TOP_MID, 0, 0);
    }
}

//创建一个测试文本域
void Create_test_taxta(void)
{
    User_Keyboard_d.testta = lv_textarea_create(lv_scr_act(), NULL);
    lv_cont_set_fit2(User_Keyboard_d.testta, LV_FIT_PARENT, LV_FIT_NONE);
    lv_textarea_set_text(User_Keyboard_d.testta, "");
    lv_textarea_set_one_line(User_Keyboard_d.testta, true);
    lv_textarea_set_cursor_hidden(User_Keyboard_d.testta, true);
    lv_obj_set_event_cb(User_Keyboard_d.testta, event_handler);
}



static void del_event_handler(lv_obj_t* obj, lv_event_t event)
{
    if (event == LV_EVENT_RELEASED)
    {
        lv_obj_del(User_Keyboard_t.cont);
    }
}
//初始化键盘的参数
void Init_Keyboard_Param(void)
{
    User_Keyboard_d.num_length = 5;
    User_Keyboard_d.cursor_en = true;
}

//创建用户自定义数字输入键盘
void Create_User_Keyboard(void)
{ 
    int i;
    Init_Keyboard_Param();
    lv_style_init(&User_Keyboard_t.cont_style);//初始化容器风格

    /*Set a background color and a radius*/
    lv_style_set_radius(&User_Keyboard_t.cont_style, LV_STATE_DEFAULT, 0);//设置页面圆角度数
    lv_style_set_bg_opa(&User_Keyboard_t.cont_style, LV_STATE_DEFAULT, LV_OPA_70);
    lv_style_set_bg_color(&User_Keyboard_t.cont_style, LV_STATE_DEFAULT, LV_COLOR_BLACK);//设置页面底色
    lv_style_set_border_opa(&User_Keyboard_t.cont_style, LV_STATE_DEFAULT, LV_OPA_TRANSP);
 //   lv_style_set_border_color(&User_Keyboard_t.cont_style, LV_STATE_FOCUSED, LV_COLOR_WHITE);//页面聚焦边线色
 //   lv_style_set_border_color(&User_Keyboard_t.cont_style, LV_STATE_DEFAULT, LV_COLOR_WHITE);//页面默认边线色

    User_Keyboard_t.cont = lv_cont_create(lv_scr_act(), NULL);//在当前活跃层，创建键盘基板页面
    lv_obj_set_auto_realign(User_Keyboard_t.cont, true);
    lv_obj_set_size(User_Keyboard_t.cont, 400, 360);//设置容器大小
    lv_obj_align(User_Keyboard_t.cont, NULL, LV_ALIGN_CENTER, 0, 0);//中心对齐
    lv_obj_add_style(User_Keyboard_t.cont, LV_CONT_PART_MAIN, &User_Keyboard_t.cont_style);//添加风格
    lv_obj_set_drag(User_Keyboard_t.cont, true);//使能页面拖拽

    lv_style_init(&User_Keyboard_t.del_btn_style);//初始化按键风格
    lv_style_set_radius(&User_Keyboard_t.del_btn_style, LV_STATE_DEFAULT, 0);//设置页面圆角度数
    lv_style_set_bg_opa(&User_Keyboard_t.del_btn_style, LV_STATE_DEFAULT, LV_OPA_70);
    lv_style_set_bg_color(&User_Keyboard_t.del_btn_style, LV_STATE_DEFAULT, LV_COLOR_BLACK);//设置页面底色
    lv_style_set_border_opa(&User_Keyboard_t.del_btn_style, LV_STATE_DEFAULT, LV_OPA_TRANSP);

    lv_style_init(&User_Keyboard_t.label_style);//初始化文本风格
    lv_style_set_text_opa(&User_Keyboard_t.label_style, LV_STATE_DEFAULT, LV_OPA_COVER);//全覆盖
    lv_style_set_text_color(&User_Keyboard_t.label_style, LV_STATE_DEFAULT, LV_COLOR_WHITE);//设置文本颜色
    lv_style_set_text_font(&User_Keyboard_t.label_style, LV_STATE_DEFAULT, &lv_font_montserrat_44);//设置文本大小

    lv_style_init(&User_Keyboard_t.ta_style);//初始化按键风格
    lv_style_set_bg_opa(&User_Keyboard_t.ta_style, LV_STATE_DEFAULT, LV_OPA_TRANSP);;//默认背景颜色覆盖
//    lv_style_set_bg_color(&User_Keyboard_t.ta_style, LV_STATE_DEFAULT, LV_COLOR_GRAY);//设置默认背景颜色
    lv_style_set_border_opa(&User_Keyboard_t.ta_style, LV_STATE_DEFAULT, LV_OPA_TRANSP);//边线颜色覆盖
    lv_style_set_text_font(&User_Keyboard_t.ta_style, LV_STATE_DEFAULT, &lv_font_montserrat_42);//设置字体
    lv_style_set_text_color(&User_Keyboard_t.ta_style, LV_STATE_DEFAULT, LV_COLOR_WHITE);//设置字体颜色
    //创建预显文本
    label2 = lv_label_create(User_Keyboard_t.cont, NULL);
    lv_obj_set_width(label2, 150);
    lv_label_set_text(label2, " ");
    lv_obj_align(label2, User_Keyboard_t.cont, LV_ALIGN_IN_TOP_MID, 0, 0);
    lv_obj_add_style(label2, LV_TEXTAREA_PART_BG, &User_Keyboard_t.ta_style);//添加键盘风格
/*   User_Keyboard_t.ta = lv_textarea_create(User_Keyboard_t.cont, NULL);
    lv_textarea_set_max_length(User_Keyboard_t.ta, 5);//设置输入最大长度
    lv_textarea_set_cursor_hidden(User_Keyboard_t.ta, true); //关闭光标
    lv_obj_add_style(User_Keyboard_t.ta, LV_TEXTAREA_PART_BG, &User_Keyboard_t.ta_style);//添加键盘风格
    lv_obj_align(User_Keyboard_t.ta, User_Keyboard_t.cont, LV_ALIGN_IN_TOP_MID, 0,0);
    lv_textarea_set_one_line(User_Keyboard_t.ta, true);
    lv_obj_set_auto_realign(User_Keyboard_t.ta, true);
    lv_textarea_set_text(User_Keyboard_t.ta, "");
    lv_textarea_set_text_align(User_Keyboard_t.ta, LV_LABEL_ALIGN_CENTER);//设置文本域中的文本对齐
    lv_obj_set_event_cb(User_Keyboard_t.ta, event_handler);
    */
    lv_style_init(&User_Keyboard_t.kb_bg_style);//初始化键盘背景风格
    lv_style_set_bg_opa(&User_Keyboard_t.kb_bg_style, LV_STATE_DEFAULT, LV_OPA_TRANSP);//设置键盘背景色
    lv_style_set_border_opa(&User_Keyboard_t.kb_bg_style, LV_STATE_DEFAULT, LV_OPA_TRANSP);//边线颜色覆盖
    lv_style_set_pad_left(&User_Keyboard_t.kb_bg_style, LV_STATE_DEFAULT, LV_DPX(5));//键盘整体距左侧边线宽度
    lv_style_set_pad_right(&User_Keyboard_t.kb_bg_style, LV_STATE_DEFAULT, LV_DPX(5));//键盘整体距右侧边线宽度
    lv_style_set_pad_top(&User_Keyboard_t.kb_bg_style, LV_STATE_DEFAULT, LV_DPX(5));//键盘整体距上侧边线宽度
    lv_style_set_pad_bottom(&User_Keyboard_t.kb_bg_style, LV_STATE_DEFAULT, LV_DPX(5));//键盘整体距下侧边线宽度
    lv_style_set_pad_inner(&User_Keyboard_t.kb_bg_style, LV_STATE_DEFAULT, LV_DPX(5));//键盘内的按键间距

    lv_style_init(&User_Keyboard_t.kb_btn_style);//初始化按键风格
    lv_style_set_bg_opa(&User_Keyboard_t.kb_btn_style, LV_STATE_DEFAULT, LV_OPA_COVER);;//默认背景颜色覆盖
    lv_style_set_bg_color(&User_Keyboard_t.kb_btn_style, LV_STATE_DEFAULT, LV_COLOR_GRAY);//设置默认背景颜色
    lv_style_set_bg_opa(&User_Keyboard_t.kb_btn_style, LV_STATE_PRESSED, LV_OPA_50);//按压背景颜色覆盖
    lv_style_set_bg_color(&User_Keyboard_t.kb_btn_style, LV_STATE_PRESSED, LV_COLOR_BLACK);//设置按压背景颜色
    lv_style_set_border_opa(&User_Keyboard_t.kb_btn_style, LV_STATE_DEFAULT, LV_OPA_TRANSP);//边线颜色覆盖
    //   lv_style_set_border_color(&User_Keyboard_t.cont_style, LV_STATE_FOCUSED, LV_COLOR_WHITE);//页面聚焦边线色
    //   lv_style_set_border_color(&User_Keyboard_t.cont_style, LV_STATE_DEFAULT, LV_COLOR_WHITE);//页面默认边线色

    User_Keyboard_t.kb = lv_keyboard_create(User_Keyboard_t.cont, NULL);//创建键盘
    lv_obj_set_size(User_Keyboard_t.kb, 400, 300);//设置键盘尺寸
    lv_obj_align(User_Keyboard_t.kb, User_Keyboard_t.cont, LV_ALIGN_IN_TOP_MID, 0, 60);//基于容器对齐
    lv_keyboard_set_cursor_manage(User_Keyboard_t.kb, User_Keyboard_d.cursor_en);//关闭键盘光标管理
    lv_keyboard_set_mode(User_Keyboard_t.kb, LV_KEYBOARD_MODE_NUM);//设置为数字键盘
    lv_keyboard_set_map(User_Keyboard_t.kb, LV_KEYBOARD_MODE_NUM, btnm_num_map);//设置为自定义键盘布局
    lv_keyboard_set_textarea(User_Keyboard_t.kb, User_Keyboard_d.testta);//关联文本域
    for (i = 0; i < sizeof(btnm_num_map)/sizeof(char *); i++)//设置每一个按键的宽度
    {
        lv_btnmatrix_set_btn_width(User_Keyboard_t.kb, i, 1);
    }
    lv_obj_add_style(User_Keyboard_t.kb, LV_KEYBOARD_PART_BG, &User_Keyboard_t.kb_bg_style);//添加键盘风格
    lv_obj_add_style(User_Keyboard_t.kb, LV_KEYBOARD_PART_BTN, &User_Keyboard_t.kb_btn_style);//添加键盘按键风格

    lv_obj_t* btnm1 = lv_btnmatrix_create(User_Keyboard_t.cont, NULL);
    lv_btnmatrix_set_map(btnm1, btnm_map);
    lv_obj_set_size(btnm1, 50, 50);//设置键盘尺寸
    lv_obj_align(btnm1, User_Keyboard_t.cont, LV_ALIGN_IN_TOP_RIGHT, 0, 0);
    lv_obj_set_event_cb(btnm1, del_event_handler);
    lv_obj_add_style(btnm1, LV_BTNMATRIX_PART_BG, &User_Keyboard_t.kb_bg_style);//添加键盘风格
    lv_obj_add_style(btnm1, LV_BTNMATRIX_PART_BTN, &User_Keyboard_t.kb_btn_style);//添加键盘按键风格
}

键盘代码.h文件

#ifndef __USER_KEYBOARD_H_
#define __USER_KEYBOARD_H_

#include "lvgl/lvgl.h"

//用户自定义选项
typedef struct {
	unsigned int num_length;//数字输入最大长度
	unsigned int kb_w;//键盘的宽度
	unsigned int kb_h;//键盘的高度
	lv_obj_t* testta;
	bool cursor_en;//文本域光标管理
}User_Keyboard_def;

typedef struct {
	lv_obj_t* cont;
	lv_style_t cont_style;
	lv_obj_t* label;
	lv_obj_t* btn1;
	lv_style_t label_style;
	lv_obj_t* ta;//文本域创建
	lv_style_t ta_style;//文本域背景风格
	lv_obj_t* kb;//键盘创建
	lv_style_t kb_bg_style;//键盘背景风格
	lv_style_t kb_btn_style;//键盘按键风格
	lv_style_t del_btn_style;
//-----------文本键盘
	lv_obj_t* text_kb;//键盘创建
	lv_style_t text_kb_bg_style;//键盘背景风格
	lv_style_t text_kb_btn_style;//键盘按键风格
}User_Keyboard_info;

extern User_Keyboard_info  User_Keyboard_t;
extern User_Keyboard_def  User_Keyboard_d;

void Create_User_Keyboard(void);
void Create_test_taxta(void);

#endif

main.c

void main()
{
//省去若干代码
Create_test_taxta();
Create_User_Keyboard();
//省去若干代码

}