Skip to content

Flip-flop button

The flip-flop button is an input element and a variant of the button which keeps the state, off or on.

Configure

Warning

Ensure the GUI library is included and initialised according to the configuration procedure.

button myButton;

The constructor creates a flip-flop button.

1
2
3
myButton.dDefine(10, 10, 80, 50,
    setItem(0x0001, "Flip-flop"),
    fontSizeAutomatic);

dDefine() defines the flip-flop button with vector coordinates.

The required parameters are

  • The first line specifies the vector coordinates: top-left coordinates x-y then width and height in pixels;

  • The second line contains the item, here built with setItem() with an index and a text;

The optional parameters are

  • The third line is optional: the size of the font, by default fontSizeAutomatic for automatic.

By default, the button is standard and enabled according to the GUI setting, with value set to zero.

Then,

myButton.setOption(optionFlipFlop);
myButton.setState(stateEnabled);
myButton.setValue(false);

setOption() needs to be set to optionFlipFlop or true to turn the button into a flip-flop button.

setState() defines whether touch is enabled for the element.

Select

  • stateDisabled or false for touch disabled;
  • stateEnabled or true for touch enabled.

Default is false for touch disabled.

setValue() sets the initial value of the flip-flop element:

  • false for flip-flop turned off;
  • true for flip-flop turned on.

Use

myButton.draw();
bool result = myButton.check();
uint32_t index = myButton.getIndex();
bool result = myButton.getValue();

draw() displays the button.

check() polls the touch controller and returns true is the button is pressed.

An optional parameter defines the mode of how the element is checked:

  • checkNormal or false for normal check mode;
  • checkInstant or true for instant check mode.

Default mode is normal check mode.

In normal check mode, the element raises the event when the finger is released from the element. Additionally, the element goes through a cinematic sequence.

From off to on: start, press, hold, release

From on to off: start, press, hold, release

In instant check mode, the element raises the event when the finger touches the element. No cinematic sequence is performed.

From off to on: start, press

From on to off: start, press

getIndex() returns the index of the button, set at dDefine().

getValue() gets the value of the flip-flop element:

  • false for flip-flop turned off;
  • true for flip-flop turned on.

Example

This is the core of the code from example GUI_Button.ino.

void displayCursor()
{
    myScreen.setOrientation(myOrientation);
    uint16_t x, y, dx, dy;

    x = myScreen.screenSizeX();
    y = myScreen.screenSizeY();
    dx = x / 7;
    dy = y / 4;

    myGUI.delegate(false);

    dLabel(0, 0, x, dy, "Flip-flop ", myColours.black, myColours.white, -1, 1, fontLarge);

    text myText1;
    myText1.dDefine(dx, dy, dx * 2, dy, 0, 0, fontMedium);
    myText1.draw("OFF");

    text myText2;
    myText2.dDefine(dx * 4, dy, dx * 2, dy, 0, 0, fontMedium);
    myText2.draw("OFF");

    button myFlipFlop1;
    myFlipFlop1.dDefine(dx, dy * 2, dx * 2, dy, setItem(0x0001, "Normal"), fontMedium);
    myFlipFlop1.setOption(optionFlipFlop);
    myFlipFlop1.setState(stateEnabled);
    myFlipFlop1.draw();

    button myFlipFlop2;
    myFlipFlop2.dDefine(dx * 4, dy * 2, dx * 2, dy, setItem(0x0002, "Instant"), fontMedium);
    myFlipFlop2.setOption(optionFlipFlop);
    myFlipFlop2.setState(stateEnabled);
    myFlipFlop2.draw();

    drawNext();
    myScreen.flushFast();

    myGUI.delegate(true);

    while (!checkNext())
    {
        if (myFlipFlop1.check())
        {
            myText1.draw(myFlipFlop1.getValue() ? "ON" : "OFF");
        }
        else if (myFlipFlop2.check(checkInstant))
        {
            myText2.draw(myFlipFlop2.getValue() ? "ON" : "OFF");
        }
        else
        {
            hV_HAL_delayMilliseconds(10);
        }
    }
}