Any output of m2tklib is passed to a special procedure, which is called the "graphics handler". This graphic handler is assigned during the setup of the library. The graphic handler is responsible for the following tasks:

• Setup of the graphics subsystem
• Interaction with the graphics subsystem (e.g. draw text)
• Style and design definition (e.g. border style)

The remaining part of this document will describe the available graphics handler.

• Graphics Library: Liquid Crystal, shipped with the Arduino IDE
• WWW: http://arduino.cc/en/Reference/LiquidCrystal
• Graphics Hardware: Any character LCDs, supported by Liquid Crystal library
• Additional Include: #include "m2ghlc.h"

A generic Liquid Crystal handler.

It is required to setup the Liquid Crystal library and pass the library object to this handler with the help of the additional procedure m2_SetLiquidCrystal()

Properties of m2_gh_lc

• Support most character LCD sizes
• Field Focus: [ and ]
• Data Up Focus: < and >
• Highlight Text: Not supported
• Single Character Focus: Underline/no blink cursor

Steps are (Arduino Environment):

1. Include header files

#include "M2tk.h"
#include "m2ghlc.h"

1. Setup Liquid Crystal (Pin assignments might be changed)

LiquidCrystal lcd(12, 11, 5, 4, 3, 2);

1. Setup m2tklib and assign the Liquid Crystal graphics handler

M2tk m2(&root_element, m2_es_arduino, m2_eh_2bs, m2_gh_lc);

1. Pass lcd object to the graphics handler (see also m2_SetLiquidCrystal()

void setup() {
  m2_SetLiquidCrystal(&lcd, 16, 2);
  m2.setPin(M2_KEY_SELECT, uiKeySelectPin);
  m2.setPin(M2_KEY_NEXT, uiKeyNextPin);
}

The following complete example for the Arduino Environment implements some simple radio buttons:

#include "M2tk.h"
#include "m2ghlc.h"

LiquidCrystal lcd(12, 11, 5, 4, 3, 2);

uint8_t uiKeySelectPin = 10;
uint8_t uiKeyNextPin = 9;

uint8_t select_color = 0;

void fn_ok(m2_el_fnarg_p fnarg) {
  /* accept selection */
}

void fn_cancel(m2_el_fnarg_p fnarg) {
  /* discard selection */
}

M2_LABEL(el_label1, NULL, "red");
M2_RADIO(el_radio1, "v0", &select_color);

M2_LABEL(el_label2, NULL, "green");
M2_RADIO(el_radio2, "v1", &select_color);

M2_LABEL(el_label3, NULL, "blue");
M2_RADIO(el_radio3, "v2", &select_color);

M2_BUTTON(el_cancel, NULL, "cancel", fn_cancel);
M2_BUTTON(el_ok, NULL, "ok", fn_ok);

M2_LIST(list) = { 
    &el_label1, &el_radio1, 
    &el_label2, &el_radio2,  
    &el_label3, &el_radio3, 
    &el_cancel, &el_ok 
};
M2_GRIDLIST(list_element, "c2",list);
M2tk m2(&list_element, m2_es_arduino, m2_eh_2bs, m2_gh_lc);

void setup() {
  m2_SetLiquidCrystal(&lcd, 16, 4);
  m2.setPin(M2_KEY_SELECT, uiKeySelectPin);
  m2.setPin(M2_KEY_NEXT, uiKeyNextPin);
}

void loop() {
  m2.checkKey();
  m2.checkKey();
  if ( m2.handleKey() )
    m2.draw();
  m2.checkKey();
}

Obsolete.

This graphics handler does not require any external setup of the Liquid Crystal library. Instead it will always use

LiquidCrystal lcd(12, 11, 5, 4, 3, 2);
lcd.begin(16,4)

To change the current character: Move underline cursor to the position of the character.

If the data mode is active, "<" and ">" mark the "go up" status. If a field is in "go up" status, press SELECT to leave the data entry mode for this field.

"[" and "]" characters show the normal focus for fields and buttons.

• Graphics Library: Interface to the GLCD library.
• WWW: http://code.google.com/p/glcd-arduino/
• Graphics Hardware: KS0108 and others supported by the GLCD library.
• Additional Include: #include "m2ghglcd.h"

Common properties of the GLCD handler procedures:

• Setup of the GLCD device is done within the handler, no additional setup is requried.
• System 5x7 font is applied to f0
• Arial14 font is applied to f1
• Highlight is supported and mapped to f4 and f5 (corresponding to the fonts)

Input elements require minimal space on the output device. Input focus simply inverts the element.

Properties of m2_gh_glcd_bf

• Support all GLCD sizes (tested with 128x64)
• Field Focus: Inverted element
• Data Up Focus: Half inverted element
• Highlight Text: Frame around the element
• Single Character Focus: Inverted character
• f0: System5x7
• f1: Arial14

Produces some nicer graphics elements. Uses a shadowed frame for focus and highlight.

Properties of m2_gh_glcd_bf

• Support all GLCD sizes (tested with 128x64)
• Field Focus: Frame with shadow
• Data Up Focus: Half inverted element
• Highlight Text: Frame with shadow around the element
• Single Character Focus: Inverted character
• f0: System5x7
• f1: Arial14

See m2_gh_glcd_bf, however fonts are not preselected and must be assigned with setFont. Available fonts:

• m2_Arial14
• m2_System5x7
• m2_fixednums7x15
• m2_fixednums15x31

See m2_gh_glcd_ffs, however fonts are not preselected and must be assigned with setFont. Available fonts:

• m2_Arial14
• m2_System5x7
• m2_fixednums7x15
• m2_fixednums15x31

All pictures are generated with a KS0108 graphics Display and the m2_gh_glcd_ffs graphics handler.

To change the current character: Move underline cursor to the position of the character.

If the data mode is active, a half inverted field mark the "go up" status. If a field is in "go up" status, press SELECT to leave the data entry mode for this field.

A shadowed frame shows the normal focus for fields and buttons. The shadowed frame is also used for the highlight style. A highlighted button with focus is drawn with shadow and inverted text:

• Graphics Library: DOGM128 Library
• WWW: http://code.google.com/p/dogm128/
• Graphics Hardware: ST7565R, UC1610 Controllers (EA DOGM128, EA DOGS102, EA DOGM132, EA DOGXL160 and others)
• Additional Include: #include "m2ghdogm.h"

• Graphics Library: U8glib
• M2tklib Wiki Page
• WWW: http://code.google.com/p/u8glib/
• Graphics Hardware: http://code.google.com/p/u8glib/wiki/device
• Additional Include: #include "m2ghu8g.h"

• Wiki Start Page
• Project Home