Switch(开关) (lv_switch)

Overview(概述)

查看原文

The Switch looks like a little slider and can be used to turn something on and off.

开关看起来像一个小滑块,开关的功能类似于按钮,也可以用来打开和关闭某些东西。

Parts and Styles(零件和样式)

查看原文

  • LV_PART_MAIN The background of the switch uses all the typical background style properties. padding makes the indicator smaller in the respective direction.

  • LV_PART_INDICATOR The indicator that shows the current state of the switch. Also uses all the typical background style properties.

  • LV_PART_KNOB A rectangle (or circle) drawn at left or right side of the indicator. Also uses all the typical background properties to describe the knob(s). By default the knob is square (with a optional corner radius) with side length equal to the smaller side of the slider. The knob can be made larger with the padding values. Padding values can be asymmetric too.

开关包括以下3个零件:

  • LV_PART_MAIN 背景。 修改其 padding 会让下面的(指示器和旋钮)在相应方向上的大小发生变化。

  • LV_PART_INDICATOR 显示开关状态的指示器。

  • LV_PART_KNOB 在指标左侧或右侧的旋钮。 默认情况下,旋钮是圆形的,边长等于滑块的较小边。 可以修改 padding 值使旋钮变大,填充值可以是不对称的。

示例:

// 修改开关背景部分的颜色
lv_obj_set_style_bg_color(sw, lv_color_hex(0xc43e1c), LV_PART_MAIN);

// 修改开关状态指示器部分,关闭状态时的背景颜色
lv_obj_set_style_bg_opa(sw, 100, LV_PART_INDICATOR);
lv_obj_set_style_bg_color(sw, lv_color_hex(0xc43e1c), LV_PART_INDICATOR);

// 修改开关状态指示器部分,打开状态时的背景颜色
lv_obj_set_style_bg_color(sw, lv_color_hex(0x7719aa), LV_PART_INDICATOR | LV_STATE_CHECKED);

// 修改开关旋钮部分的颜色
lv_obj_set_style_bg_color(sw, lv_color_hex(0xc43e1c), LV_PART_KNOB);

Usage(用法)

Change state(改变状态)

查看原文

When the switch is turned on it goes to LV_STATE_CHECKED. To get the current satte of the switch use lv_obj_has_state(switch, LV_STATE_CHECKED). To manually turn the switch on/off call lvobj_add/clear_state(switch, LV_STATE_CHECKED).

当开关被打开时,开关的状态会变为 LV_STATE_CHECKED 。我们可以通过下面这个接口获取开关当前的状态:

lv_obj_has_state(switch, LV_STATE_CHECKED);   // 返回 bool 类型, 开-1 ; 关-2

一般我们通过触摸或按键控制让开关打开/关闭,其实我们还可以通过下面这个接口来主动 打开/关闭 开关:

lv_obj_add_state(switch, LV_STATE_CHECKED);	// 开
lv_obj_clear_state(switch, LV_STATE_CHECKED);	// 关

我们可以通过下面的接口让按钮处于不可更改状态:

lv_obj_add_state(sw, LV_STATE_DISABLED); 		                // 当前状态是关,并且不可更改
lv_obj_add_state(sw, LV_STATE_CHECKED | LV_STATE_DISABLED);  // 当前状态是开,并且不可更改

要让按钮恢复可以更改的状态,我们只要将 LV_STATE_DISABLED 清除即可:

lv_obj_clear_state(switch, LV_STATE_ DISABLED);		          // 清除禁用状态,按钮可正常使用

Events(事件)

查看原文

  • LV_EVENT_VALUE_CHANGED Sent when the switch changes state.

See the events of the Base object too.

Learn more about Events.

正常情况下,当开关被点击并且状态发生改变时,会触发 LV_EVENT_VALUE_CHANGED 事件类型。也就是说我们可以在 LV_EVENT_VALUE_CHANGED 事件类型中处理事件。

参见 Base object 的事件。

详细了解 事件

Keys(按键)

查看原文

  • LV_KEY_UP/RIGHT Turns on the slider

  • LV_KEY_DOWN/LEFT Turns off the slider

  • LV_KEY_ENTER Toggles the switch

Learn more about Keys.

  • LV_KEY_UP/RIGHT

  • LV_KEY_DOWN/LEFT

  • LV_KEY_ENTER 切换开关

了解有关 按键 的更多信息。

Example

Simple Switch

C code  

 GitHub
#include "../../lv_examples.h"
#if LV_USE_SWITCH && LV_BUILD_EXAMPLES

static void event_handler(lv_event_t * e)
{
    lv_event_code_t code = lv_event_get_code(e);
    lv_obj_t * obj = lv_event_get_target(e);
    if(code == LV_EVENT_VALUE_CHANGED) {
        LV_LOG_USER("State: %s\n", lv_obj_has_state(obj, LV_STATE_CHECKED) ? "On" : "Off");
    }
}

void lv_example_switch_1(void)
{
    lv_obj_set_flex_flow(lv_scr_act(), LV_FLEX_FLOW_COLUMN);
    lv_obj_set_flex_align(lv_scr_act(), LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_CENTER);

    lv_obj_t * sw;

    sw = lv_switch_create(lv_scr_act());
    lv_obj_add_event_cb(sw, event_handler, LV_EVENT_ALL, NULL);

    sw = lv_switch_create(lv_scr_act());
    lv_obj_add_state(sw, LV_STATE_CHECKED);
    lv_obj_add_event_cb(sw, event_handler, LV_EVENT_ALL, NULL);

    sw = lv_switch_create(lv_scr_act());
    lv_obj_add_state(sw, LV_STATE_DISABLED);
    lv_obj_add_event_cb(sw, event_handler, LV_EVENT_ALL, NULL);

    sw = lv_switch_create(lv_scr_act());
    lv_obj_add_state(sw, LV_STATE_CHECKED | LV_STATE_DISABLED);
    lv_obj_add_event_cb(sw, event_handler, LV_EVENT_ALL, NULL);
}

#endif

MicroPython code  

 GitHub Simulator
def event_handler(e):
    code = e.get_code()
    obj = e.get_target()
    if code == lv.EVENT.VALUE_CHANGED:
        if obj.has_state(lv.STATE.CHECKED):
            print("State: on")
        else:
            print("State: off")


lv.scr_act().set_flex_flow(lv.FLEX_FLOW.COLUMN)
lv.scr_act().set_flex_align(lv.FLEX_ALIGN.CENTER, lv.FLEX_ALIGN.CENTER, lv.FLEX_ALIGN.CENTER)

sw = lv.switch(lv.scr_act())
sw.add_event_cb(event_handler,lv.EVENT.ALL, None)

sw = lv.switch(lv.scr_act())
sw.add_state(lv.STATE.CHECKED)
sw.add_event_cb(event_handler, lv.EVENT.ALL, None)

sw = lv.switch(lv.scr_act())
sw.add_state(lv.STATE.DISABLED)
sw.add_event_cb(event_handler, lv.EVENT.ALL, None)

sw = lv.switch(lv.scr_act())
sw.add_state(lv.STATE.CHECKED | lv.STATE.DISABLED)
sw.add_event_cb(event_handler, lv.EVENT.ALL, None)


API

Functions

lv_obj_t *lv_switch_create(lv_obj_t *parent)

Create a switch objects

参数

parent -- pointer to an object, it will be the parent of the new switch

返回

pointer to the created switch

Variables

const lv_obj_class_t lv_switch_class
struct lv_switch_t

Public Members

lv_obj_t obj
int32_t anim_state