Category Archives: Configuration Settings

Font Editor and Generator for Graphic LCD (GLCD)

Leave a reply

About : Font panel and font generator data structures

Font Panel ( SVG / ANSI / UNICODE and Editable Fonts )

4 different font categories are available : ANSI and Unicode international System fonts (installed on Windows) , the SVG fonts (for grayscale 256) based on vector graphics for a better anti-aliasing quality, and Freely Editable Font, for customized bitmap glyphs.

^

Unicode block selection (green frame)

Font Panel ( EDITABLE Font )

An Editable Font can be an import of a system font + edits or created from scratch.

In this example only 5 chars

List of the existing Editable Fonts (blue frame)

Font Panel ( ANSI Font )

Font Settings in 3 panels : Structure, Header, and Data (green frames)

The parameters can be edited (when green background) in these 3 fields (red frame)

The chars selected in the Grid (blue frame) will be exported to data

Font panel > Structure Parameters

The Parameters in the green frame are separated for each Data Structure (1st Parameter of this list) These data are then present or not in the Descriptor blocs of the output data.

Font panel > Data Parameters

Font panel > Headers Parameters

The font headers such as the description and the font header code exported at the top of the data output.

Font panel > Font Data Structure

>.<

Data Structures :

Raw Data, Font Bloc, Structured and DMD struct are different outputs layouts for fonts.

The differences in headers, bitmap glyphs and descriptors

Example for “RAW Data” structure

Optional descriptors at the end

 

/*  >>> Code Header   */

 /* ( Bitmap Glyphs )  */

 /* @ 0 Char:’A’ Width in bits :10 */

 
 0x08 , 0x00 ,     /*  ____#___________  */

 0x14 , 0x00 ,     /*  ___#_#__________  */

 0x14 , 0x00 ,     /*  ___#_#__________  */

 0x14 , 0x00 ,     /*  ___#_#__________  */

 0x22 , 0x00 ,     /*  __#___#_________  */

 0x22 , 0x00 ,     /*  __#___#_________  */

 0x7F , 0x00 ,     /*  _#######________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x80 , 0x80 ,     /*  #_______#_______  */

 0x80 , 0x80 ,     /*  #_______#_______  */

 
 /* @ 20 Char:’B’ Width in bits :10 */

 
 0x7E , 0x00 ,     /*  _######_________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x7E , 0x00 ,     /*  _######_________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x7E , 0x00      /*  _######_________  */

 

};
                                          
 const uint8_t Arial_10_1252_(ANSI_-_latin_I)_Descriptors[][] PROGMEM = {                       
                                                              
  
 {0x41,0,10,10,100,160,0,30},                            /* ‘A’ */ 
 {0x42,20,10,10,100,160,0,30}                            /* ‘B’ */ 

>.<

Example for “Font BLOC” data structure

Optional Font Header at the top

Optional descriptors at the top of every bitmap glyph

const unsigned char Arial_10_1252_(ANSI_-_latin_I)_Bitmaps[] = {)                              
                                                                  

 0x00,0x3E,13,16,0x00,2, (font header)
 
 /* ‘A’ */

 0x41,0,10,10,100,160,0,30,
 0x08 , 0x00 ,     /*  ____#___________  */

 0x14 , 0x00 ,     /*  ___#_#__________  */

 0x14 , 0x00 ,     /*  ___#_#__________  */

 0x14 , 0x00 ,     /*  ___#_#__________  */

 0x22 , 0x00 ,     /*  __#___#_________  */

 0x22 , 0x00 ,     /*  __#___#_________  */

 0x7F , 0x00 ,     /*  _#######________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x80 , 0x80 ,     /*  #_______#_______  */

 0x80 , 0x80 ,     /*  #_______#_______  */

 
 
 /* ‘B’ */

 0x42,20,10,10,100,160,0,30,
 0x7E , 0x00 ,     /*  _######_________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x7E , 0x00 ,     /*  _######_________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x7E , 0x00       /*  _######_________  */

 

};

>.<

Example for *Structured” data structure

Bitmap glyphs in blocks, Descriptors in blocks at the end

/*  >>> Code Header   */

 /* ( Bitmap Glyphs )  */

static const uint8_t image_data_Arial_10_1252_(ANSI_-_latin_I)_0x41[20] =
{
 
 0x08 , 0x00 ,     /*  ____#___________  */

 0x14 , 0x00 ,     /*  ___#_#__________  */

 0x14 , 0x00 ,     /*  ___#_#__________  */

 0x14 , 0x00 ,     /*  ___#_#__________  */

 0x22 , 0x00 ,     /*  __#___#_________  */

 0x22 , 0x00 ,     /*  __#___#_________  */

 0x7F , 0x00 ,     /*  _#######________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x80 , 0x80 ,     /*  #_______#_______  */

 0x80 , 0x80      /*  #_______#_______  */

};

static const uint8_t image_data_Arial_10_1252_(ANSI_-_latin_I)_0x42[26] =
{
 
 0x7E , 0x00 ,     /*  _######_________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x7E , 0x00 ,     /*  _######_________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x7E , 0x00      /*  _######_________  */

};


 /*  >>> Optional Char Descriptors   */
 /* ( Char Adress  Start adress  Width in bits  Height in bits  Char Bytes  Size in bits  X Offset  Y Offset  Char Spacing bits )  */

static const tImage Arial_10_1252_(ANSI_-_latin_I)_array_[] = {

// character : ‘A’
{0x41,0,10,10,100,160,0,30 , &Arial_10_1252_(ANSI_-_latin_I)_0x41},

// character : ‘B’
{0x42,20,10,10,100,160,0,30 , &Arial_10_1252_(ANSI_-_latin_I)_0x42}

};

const tfont  Arial_10_1252_(ANSI_-_latin_I) = { 2 , Arial_10_1252_(ANSI_-_latin_I)_array };

>.<

Example for “DMD Struct” data structure

Optional Font Header at the top

Descriptors in blocks at the top (Here widths only )

static const uint8_t Arial_10_1252_(ANSI_-_latin_I)_Bitmaps[2][] PROGMEM = {  
                                                             

 0x00,0x30,13,16,0x00,2, (font header)
 /*  >>> Code Header   */

 /* ( Width in bits )  */

 
 10,                            /* ‘A’ */ 
 10                            /* ‘B’ */ 
,
 /* ( Bitmap Glyphs )  */

 /* @ 0 Char:’A’ Width in bits :10 */

 
 0x08 , 0x00 ,     /*  ____#___________  */

 0x14 , 0x00 ,     /*  ___#_#__________  */

 0x14 , 0x00 ,     /*  ___#_#__________  */

 0x14 , 0x00 ,     /*  ___#_#__________  */

 0x22 , 0x00 ,     /*  __#___#_________  */

 0x22 , 0x00 ,     /*  __#___#_________  */

 0x7F , 0x00 ,     /*  _#######________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x80 , 0x80 ,     /*  #_______#_______  */

 0x80 , 0x80 ,     /*  #_______#_______  */

 
 /* @ 20 Char:’B’ Width in bits :10 */

 
 0x7E , 0x00 ,     /*  _######_________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x7E , 0x00 ,     /*  _######_________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x41 , 0x00 ,     /*  _#_____#________  */

 0x7E , 0x00      /*  _######_________  */

 

};


Bitmap2LCD : Project Folders and Project Management

Leave a reply

Bitmap2LCD is a programming tool for small Graphic LCDs in embedded systems.

Project Folders and Project Management

The current active project is displayed in the Windows Tab of the Main Menu (red frame) By clicking in this area, you have direct access to the Project Manager. There’s originally only 1 project called default.LCD

You can add other projects to the system. Every project is a separate set of settings, project folders, work canvas sizes etc.. To access the Project Manager, click on the Files/Projects Button (green frame) then Show Projects Explorer on the File explorer Window (blue frame)

The File explorer Window

The field at the top left side of the file explorer is the “Project Folders Management” and “the Project Management”.

With the buttons showing colored folder icons at the right side of the below blue arrow, you can define the folders where you want to convert, find and save the files of the current project.

By clicking on one of these colored folder icons, you define the currently active folder in the tree as the project folder for Graphics, Output files, Project Documents, Fonts or Touch Screen  files.

When clicking on the links inside the field, you have a quick access to the different project folders.

When for example clicking on “Graphics Library“, you switch the File List Filter to “all graphic files” excluding the other files type from the list. (This behavior can be enabled or disabled in the Filter pop-up menu)

These project folders and all the configuration settings (GLCD size, Data Direction, File Header etc..)  are saved to the disk as a set of project settings.

By clicking on the Show Projects Explorer button (orange star icon) in the menu bar (blue arrow) you can switch the view to the project management.

The Project Manager

The Project list shows the list of available projects. The list can be void in the case only the default project exists. Otherwise, like in this example, the list shows and the active project is marked with a red arrow. The other projects are marked with blue arrows.

The files attached to a project are are located in the documents/bitmap2LCD inits (version) folder.

With the Buttons in the Menu Bar at the top of the project list, you can Create, Activate, Rename and delete Projects.

>.<

Import Projects from previous versions

Copy the project files attached to a previous Project from the documents/bitmap2LCD inits (previous version) folder to the documents/bitmap2LCD inits (current version) folder.

>.<

Header Include Editors and Scripting Components

Leave a reply

Script Components

The script components [&***] can be included only once and will be replaced by the data or value when the data array is generated. Not needed script components can be deleted.

[&NAME]

The [$NAME] and the image size and position are optional and can be placed optionally anywhere in the header.

[&SIZE]

Same for Size of Data

[&TRUEORG]

This is the script component if present in the file, to indicate that you want to have the XPOS and YPOS origins of a reduced dynamic table of constants ( a part of the display you want to change ) given from the X0,Y0 corner you selected in the table translation manager window.

[&XPOS]

[&YPOS]

[&WIDTH]

[&HEIGHT]

The corner position on the Work Canvas and the size of the converted graphic area can be exported into the file.

There are more script components, for the font generation and the data compression. See the above default header script.

//** Example for for Images and Graphics Conversion!

#include <avr/pgmspace.h>

const uint8_t [&NAME][] PROGMEM = {
[&TRUEORG]

[&XPOS],
[&YPOS],
[&WIDTH],
[&HEIGHT],


//** These are the X and Y position
//** and the Width and Height of an
//** exported graphic (optional)

//** for graphics conversion with data compression
[&COMPRESSION]
const uint8_t [&CNAME][&CSIZE] PROGMEM = {

Header Include for Fonts

[&FONT INCLUDE]

/* // Structured Font Output Include
typedef struct {
long int code;
const tImage *image;
} tChar;
typedef struct {
int length;
const tChar *chars;
} tFont;
*/


[&/FONT INCLUDE]

[&FONT BITMAPS]


const uint8_t [&FNAME][&FNUMBEROFCHARS][&FBYTESPERCHAR] PROGMEM = {

[&FONT DESCRIPTORS]


const uint8_t [&DNAME][][2] PROGMEM = {

[&FONT END]

Bitmap2LCD Software Update

Bitmap2LCD is a tool for programming small Graphic LCDs in embedded systems and a programmable graphic and text processing tool.

Standard and Extended Editions can automatically be updated by the user.

From version V3.9H

1. Click the [ ? ] button at the left of the main menu : The About window is showed.

2. Update tab , check latest and current versions.

3. If active, Download and Install Latest …

4.The current version installs the update.

5.The current version will not be uninstalled !

6. You’ll find both the current and latest versions as icons on the desktop.

>.<

Work Canvas Export to Data Settings

Leave a reply

Bitmap2LCD is a tool for programming small Graphic LCDs in embedded systems and a programmable graphic and text processing tool.

Work Canvas Export to Data Settings

Update >V3.9a

From Version V3.9a the Configuration Settings have been moved to a single panel accessible from the main menu. (red Arrow)

The Monochrome / Grayscale / Color Setting can be found in the same Window

 

Versions V3.8a – V3.8z

From V3.8a, the parameters (blue arrow) located inside the right panel of the Work Canvas ( hide/ show > red arrow ) are editable.

The Export To Data Settings are the same as those located on the Configuration Settings Windows. (purple arrow)

Note : Some of these settings are also valid for the Fonts Generator !

You can change the export settings from there (blue) . Their value will be copied to the Configuration Settings Windows (purple)

If changes are made in the Configuration Settings Windows, the values might be refreshed (Refresh Values from Settings > green) on the Work Canvas Panel

bitmap2lcd-wk-settings

Data Export Settings Examples

  • Hex Data Bytes without Prefix (a) nor Suffix, (b)  Without spaces nor separator between them

bitmap2lcd-wk-settings_2

  • Intel Hex Data Output Format (File.hex)

bitmap2lcd-wk-settings_3

  • Binary File Format (File.bin)

bitmap2lcd-wk-settings_4

  • Format  = 0X Hex data / separator = , / End of Line = ;  / 4 bytes per line

bitmap2lcd-wk-settings_5

  • Format  = Prefix (a) + Hex data + Suffix (b) / separator = , / End of Line = ;  / 6 bytes per line / Data lines Prefix = DATA

bitmap2lcd-wk-settings_6

 

Getting Started > Basic Settings

Leave a reply

Bitmap2LCD is a tool for programming small Graphic LCDs in embedded systems and a programmable text processing tool.

Update V4.7b >

Presentation of Bitmap2LCD (Youtube)

 Getting Started > Basic Settings

  • Define the project name and the filenames for Graphic, data output and touch panel data output
  • Configuration Settings window (red frame)
  • Current basic Settings (red frame)
  • Work Canvas size (green arrow)

Configuration Settings : Monochrome, Color and Grayscale, Data formats etc…

The Data Format Settings are also located in the right panel of the Work Canvas. (blue arrow and frames)

  • Edit the Output File Header syntax  (green arrow)

Output File Header

  • The Output File Header is optionally copied to the top of the Text Editor when an export to data as text is performed .

Note : the variables with the [&xxxxx]  syntax are optional script components, replaced by their value on export. (details at the end of this article)

Header Include Editors and Scripting Components

Bitmap2LCD : General info about Configuration Settings

Leave a reply

Bitmap2LCD is a tool for programming small Graphic LCDs in embedded systems and a programmable text processing tool.

Bitmap2LCD : General info about Configuration Settings

OBSOLETE Article : For older versions

To open the various configuration settings Panel, click one of the button in the main form (red arrows)

Bitmap2lcd_Config Settings

At the right side, you can define the data syntax (green arrow) and the access the output file header (red arrow)

To edit the header, click on the top right button (blue arrow)

bitmap2lcd Configuration Settings

bitmap2lcd Header Settings

 

A set of configuration settings can be saved as a project , for example in the case you manage different projects and different Graphic LCD

Bitmap2lcd Project Folders

 

 

Bitmap2LCD : The Configuration Settings Window

Leave a reply

Bitmap2LCD is a tool for programming small Graphic LCDs in embedded systems.

OBSOLETE Article : For older versions

All the configuration settings of the Bitmap2LCD tool have been reorganized and grouped in one single window :

The main settings, the output file header syntax settings, the pixel to data array orientation setting , the optional postprocessing and a new user friendly pixel to data array organisation display.

 

Bitmap2LCD Configuration Settings

 

Let’s see how to configure the GLCD data output settings :

The generated data array file can be configured to meet the syntax requests of your compiler or assembler. There are many possible settings, to make it possible to match the tool with most of the compilers of the market.

At first, you define the table data settings

  • Data Width format. ( 8,16 or 32 bits data)
  • Binary, Hex or decimal format.
  • Syntax of Data Byte/Word (make it compatible with your favorite compiler, assembler)
  • Type of file (extension)

 

 

bitmap2lcd output settings

 

As next, you define the header syntax ( output file header tab)

>>  To edit file header blue arrow )

  • Click on the edit button and the header script is loaded into the editor. Modify it to meet your requirements.
  • When ready, quit the header editor by clicking the same button.
  • Find more about the header syntax at the end of this article.

As next, you define the way the data arrays are arranged to correctly fit in the DDRAM of your LCD controller. ( Data orientation ) These settings must be compatible with the LCD display functions in the GLCD Library you use in your project.

  • The origin corner X0,Y0
  • Data direction (The direction in which the pixels slices are taken from the work canvas and converted to GLCD data, for example in slices or in full canvas height or full canvas width. A slice is 8 pixels in monochrome mode and 2 pixels in 4bpp grayscale mode)
  • The Endianness (Most Significant Bit is first or last)
  • Special settings

More about File Header syntax ( output file header tab )

The script components [&***] can be included only once and will be replaced by the data or value when the data array is generated. Not needed script components can be erased.

[&NAME]

The [$NAME] and the image size and position are optional and can be placed optionally anywhere in the header.

[&SIZE]

Same for Size of Data

[&TRUEORG]

This is the script component if present in the file, to indicate that you want to have the XPOS and YPOS origins of a reduced dynamic table of constants ( a part of the display you want to change ) given from the X0,Y0 corner you selected in the table translation manager window.

[&XPOS]

[&YPOS]

[&WIDTH]

[&HEIGHT]

The corner position on the Work Canvas and the size of the converted graphic area can be exported into the file.

There are additional script components for font generation and data compression.

GLCD Data Output Settings in Bitmap2LCD

Leave a reply

Bitmap2LCD is a tool for programming small Graphic LCDs in embedded systems.

This article is only for releases before V2.5

Let’s look how to configure the GLCD data output settings :

The generated data array file (orange arrow, in the picture below) can be configured to meet the syntax requests of your compiler or assembler. There are many possible settings, to make it possible to match the tool with most of the compilers of the market.

At first, you define the table data settings (red arrow)

  • Data Width format. ( 8,16 or 32 bits data)
  • Binary, Hex or decimal format.
  • Syntax of Data Byte/Word (make it compatible with your favorite compiler, assembler)
  • Type of file (extension)

As next, you define the header syntax (green arrow)

  • Click on the button and the header script is loaded into the editor. Modify it to meet your requirements.
  • When ready, quit the header editor by clicking the same button (green arrow at the right) or the quit button. (script is auto-saved)
  • Find more about the header syntax at the end of this article.

 

As next, you define the way the data arrays are arranged to correctly fit in the DDRAM of your LCD controller. These settings must be compatible with the LCD display functions in the GLCD Library you use in your project (blue arrow)

  • The origin corner X0,Y0
  • Data direction (The direction in which the pixels slices are taken from the work canvas and converted to GLCD data, for example in slices or in full canvas height or full canvas width. A slice is 8 pixels in monochrome mode and 2 pixels in 4bpp grayscale mode)
  • The Endianness (Most Significant Bit is first or last)
  • Special settings

 

More about File Header syntax (green arrow)

The script components [&***] can be included only once and will be replaced by the data or value when the data array is generated. Not needed script components can be erased.

[&NAME]

The [$NAME] and the image size and position are optional and can be placed optionally anywhere in the header.

[&SIZE]

Same for Size of Data

[&TRUEORG]

This is the script component if present in the file, to indicate that you want to have the XPOS and YPOS origins of a reduced dynamic table of constants ( a part of the display you want to change ) given from the X0,Y0 corner you selected in the table translation manager window.

[&XPOS]

[&YPOS]

[&WIDTH]

[&HEIGHT]

The corner position on the Work Canvas and the size of the converted graphic area can be exported into the file.

There are additional script components for font generation and data compression.