purpose

LittlevGL learn to use "key" model.

Functional Description

For the button, there are two types littlevGL in. As a key, as a switch.

Button , that button like a normal keyboard or a remote controller, like the press, after the hand release, this button will restore the state of the release, expressed with a single click.

Switch , some of the buttons corresponding to a number of DIP switches, or some power, after pressing, the pressed holding state, press, restore the state released.

By default, button is the key feature, only enabled switch function, in order to make switching action.

Switch can be bound to some of the events. That is, when the switch is pressed, some signals generated immediately, then the function corresponding to the wake-up event, in this function, depending on the specific event processing corresponding to the response. Like actual gpu io interruption of a kind.

Button five states: pressed and released, dynamic press release, is not enabled.

LV_BTN_STATE_REL Released state
LV_BTN_STATE_PR Pressed state
LV_BTN_STATE_TGL_REL Toggled released state
LV_BTN_STATE_TGL_PR Toggled pressed state
LV_BTN_STATE_INA Inactive state

Users can use

lv_btn_set_state (BTN, LV_BTN_STATE_TGL_REL) setting the state of buttons

Users can be controlled by way of the key design style style, design may not, use the default settings. See in particular cases and follow-correlation function introduction.

The main features Function Description

Button to create

    lv_obj_t *lv_btn_create(lv_obj_t *par, constlv_obj_t *copy)

    同其他部件对象一样：

    par：为当前要创建按钮的父类，即父窗口，按键将显示的地方；

    copy：模拟的对象，即要创建出的btn可以复制已用的按键特性，如果为NULL，则是默认继承父类部分属性；

Property set function keys and a switch state configuration and acquisition

    void lv_btn_set_toggle(lv_obj_t *btn, bool tgl)//设置

    前文已述，按键有两中功能，一个就是按键，一个是开关。具体见前文。默认情况下，按键就是按键功能。

    btn:要配置的按键；
    tgl:如果为true，则是开关功能，如果是false，则是按键功能。

    bool lv_btn_get_toggle(constlv_obj_t *btn)//获取配置

    void lv_btn_toggle(lv_obj_t *btn)//反转一次，即当使能toggle时，每调用一次此函数，按键状态会发生翻转一次

Key set and get style

    void lv_btn_set_style(lv_obj_t *btn, lv_btn_style_ttype, const lv_style_t *style)
    这里不再累述，前面章节已经有所描述。
    中间的变量为配置那种state下的风格，即是按下时的按钮风格还是释放时，还是动态时。

    const lv_style_t *lv_btn_get_style(constlv_obj_t *btn, lv_btn_style_ttype)//获取

Subelements inner frame and key set and get

    static void lv_btn_set_layout(lv_obj_t *btn, lv_layout_tlayout)//设置其内部框架
            按键内部元素的显示框架
    staticlv_layout_tlv_btn_get_layout(constlv_obj_t *btn)


    static void lv_btn_set_fit4(lv_obj_t *btn, lv_fit_tleft, lv_fit_tright, lv_fit_ttop, lv_fit_tbottom)
           为按键4个方向的改变规则，这种改变是根据内部元素来自动完成
    

    static void lv_btn_set_fit2(lv_obj_t *btn, lv_fit_thor, lv_fit_tver)
            为水平和垂直两个

    static void lv_btn_set_fit(lv_obj_t *btn, lv_fit_tfit)
            为4个方向一个规则

    staticlv_fit_tlv_btn_get_fit_left(constlv_obj_t *btn)
    staticlv_fit_tlv_btn_get_fit_right(constlv_obj_t *btn)
    staticlv_fit_tlv_btn_get_fit_top(constlv_obj_t *btn)
    staticlv_fit_tlv_btn_get_fit_bottom(constlv_obj_t *btn)

Case and Design Source

Design of two buttons, a key depression operation, a reverse switching operation realized.

Process design

Create a key -----> Properties switching function is enabled --------> -------- label showing the configuration> ------- configure Style> setting key the position of the size --------> set its callback function.

Design code

创建了ljy_button.h和ljy_button.c两个文件，并在main函数调用DrawButton。具体怎么使用见前面章节。


#include "ljy_button.h"

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

static lv_obj_t * label2;



static void BttonEventCb(lv_obj_t * obj, lv_event_t event)
{
    if(event == LV_EVENT_CLICKED) {//点击事件
        printf("Clicked\n");
    }
    else if(event == LV_EVENT_VALUE_CHANGED) {//开关切换事件
        printf("Toggled\n");
		if(lv_btn_get_state(obj) == LV_BTN_STATE_REL){
			lv_label_set_text(label2, "OFF");
		}else{
			lv_label_set_text(label2, "ON");
		}
    }
}	



void DrawButton()
{
	//1. 按键1
    lv_obj_t * btn1 = lv_btn_create(lv_scr_act(), NULL);//在当前screen对象上创建btn1
    lv_obj_set_event_cb(btn1, BttonEventCb);//设置当前按键的 事件回调函数
    lv_obj_align(btn1, NULL, LV_ALIGN_CENTER, 0, -40);//配置btn1在其父类（screen）中显示位置
	
	
    lv_obj_t * label1;//创建按键1上面显示的label1
    label1 = lv_label_create(btn1, NULL);//在父类btn1中创建label1实体
    lv_label_set_text(label1, "Button");//配置label的text	

	//2. 按键2
    lv_obj_t * btn2 = lv_btn_create(lv_scr_act(), NULL);
    lv_obj_set_event_cb(btn2, BttonEventCb);
    lv_obj_align(btn2, NULL, LV_ALIGN_CENTER, 0, 40);

    lv_btn_set_toggle(btn2, true);	//使能其为开关按钮，非按键按钮，默认为释放状态
	lv_btn_toggle(btn2); //变为按下状态，每调用一次此函数，状态state会发生反转
	lv_btn_set_fit2(btn2, LV_FIT_NONE, LV_FIT_TIGHT);//配置btn的自适应大小，其子对象都适应其高度

	
   
    label2 = lv_label_create(btn2, NULL);
    lv_label_set_text(label2, "Toggled");	



}