{"id":1465,"date":"2014-05-01T15:15:25","date_gmt":"2014-05-01T15:15:25","guid":{"rendered":"http:\/\/bitmap2lcd.com\/blog\/?p=1465"},"modified":"2017-09-06T09:00:30","modified_gmt":"2017-09-06T09:00:30","slug":"about-the-small-graphic-lcd-glcd-programming","status":"publish","type":"post","link":"https:\/\/bitmap2lcd.com\/blog\/about-the-small-graphic-lcd-glcd-programming\/","title":{"rendered":"About the small graphic LCD (GLCD Programming)"},"content":{"rendered":"

I) A Brief History Leading up to Small Graphics <\/span><\/p>\n

With the ever increasing struggle to keep up with technology, more and more engineers
\nare given the difficult task of integrating state of the art optical devices into their products. And with this task comes the unpleasant job of coming up with the software to interface to these new devices. The most common optical device in the commercial marketplace is the Liquid Crystal Display (LCD). The LCD industry has broken down this technology into three main areas; Segmented, Alphanumeric, and Small Graphic Displays.<\/p>\n

Both the Segmented and Alphanumeric displays are very limited in their capabilities in
\nthe sense that they just display numbers and characters. Often times these types of displays are sufficient to meet the requirements of the product being manufactured. But with our current era of multimedia, the customer expects to see a lot more out of their new product.
\nThis brings us to an area of LCD\u2019s that currently has the attention of most of the world.
\nThis is the area of Small Graphic LCD Displays. While Small Graphic Displays have been
\naround for sometime, they have never been so compact and cost effective as they are today. A Small Graphic Display will usually range in resolution from 32×80 to 240×320 (240 pixels down and 320 across). The Small Graphic display is fully graphical, which means the pixels are configured tightly side by side, so as to resemble a miniature laptop computer screen. With a full graphic display there is no end to what you can visually represent. If your goal is to simply display text, you can do that in whatever font, size, and attribute you desire. As well as displaying things like logos, graphs, charts, or any other image that will differentiate your
\nproduct from the competition.<\/p>\n

II) Hurdles in Upgrading Your Display<\/span><\/p>\n

The main reason a lot of companies have not upgraded their display devices to a Small
\nGraphic Display is due to the misconception of the added cost and bulk of a larger display. But with new advancements in LCD technologies, Small Graphic Displays can now be found in sizes that are comparable with the other types of LCD displays and at roughly the same price. So you might ask yourself what other reason could there be to keep my company from upgrading our display to a more attractive and powerful Small Graphic LCD. The main hurdle in upgrading your display lies in the software.<\/p>\n

Most LCD displays have a built-in controller that maps their memory and controls the
\nsignals that are sent to the display drivers. These controllers are made to interface in a parallel fashion to a microprocessor. This means that all the software written for the display will be done in a low level language like C++ or Assembly code.<\/p>\n

If your display is Segmented or Alphanumeric, then the amount of data needed to control
\nthe display is relatively small, due to the fact that the controllers on these displays have a built in ROM that stores predefined numbers and characters. So all you have to do is place your cursor to the appropriate place on your display and define which character should be placed there.
\nBut if you upgraded to a Small Graphics Display (say 240×320) and you want to display a
\nscreen full of graphical images, then you would have a total of 76,800 pixels that must be either
\nturned on or off by your program. Now most companies will create small subroutines that
\nconstruct 8×8 or 8×16 character sizes, and refer to these subroutines when constructing their screen. But if that is the extent they are going to use their Small Graphics Display then they are no better off than if they went to a larger Alphanumeric Display. To take advantage of all 76,800 pixels would require a compilation of an extreme amount of data. And without the aid of any higher level language to help out, this data would have to come from manually created designs and drawings on special graph paper. Each picture would then have to be converted into 9,600 bytes of data. This time becomes exponential when we consider the amount of images most companies would like to create, along with the usual rework that will accompany this process.
\nBy the time the final software becomes complete, the end product might not be on the cutting edge anymore and they would have been better off staying with their old Alphanumeric Display.<\/p>\n

III) The Software Solution<\/span><\/p>\n

The solution explained in this document is in the combining of the high level language of
\nMicrosoft Windows\u2122 with the low level assembly code or C++ of the users program. The end
\nresult is perfect bitmap pictures on your LCD screen that are defined, edited, and brushed up in Microsoft Paint\u2122, or any other bitmap generating program.
\nThe unit shown above is Densitron\u2019s 240×320 Small Graphic Display along with their
\nHLX80C51 Prototyping kit. The HLX kit has an 8051 based microprocessor and 64K Bytes of
\nflash memory on board. The assembly code running this display is 400 lines long. This
\nincorporates the initialization code, display commands like clear, and the subroutines for
\npainting the display with the bitmap images. By using the technique outlined in this document to incorporate bitmap pictures onto the LCD display, the user program size will remain the same, about 400 lines, but the data will be extracted out of a bitmap image. Not only is this time reducing, but the pictures are more easily drawn, edited, and copied from other software applications available in Windows or on the Internet.
\nTo create your bitmaps you can use any bitmap program available to you. The program
\nwe are using to explain this procedure is MS Paint\u2122. After opening up this program, the
\n\u201cAttribute\u201d menu should be selected. At the prompt you can enter the LCD display size you will be using. Then choose the \u201cmonochrome bitmap\u201d option in this window. You can now close the \u201cAttribute\u201d window and start drawing, typing, or pasting in all the images you want to use. Once you have saved all of the pictures you will be using, then the bitmaps should be attached to the end of your assembled or compiled program in the order they are to be used. This can be done by using the COPY\/B command in DOS. The COPY\/B differs from the regular COPY command by copying directly as a binary format, and not adding an additional byte of data at the end as is done when using the COPY command for DOS text files.<\/p>\n

For these attached bitmaps to be of use you must have a subroutine in your program that
\ncan pull the data out of the lower memory and send it to the display. This requires knowledge of how the bitmap information is stored.
\nFor a bitmap program, the first 62 bytes of data call out the protocol for the rest of the
\nbitmap code (like the type, size, and layout of the bitmap). Since this information will already be known (monochrome and layout dimensions), the first 62 bytes can be skipped. The 63rd byte will define the first eight pixels in the lower left hand corner of the display. The following bytes will then be sent sequentially to the screen until you hit the right hand edge of your display. The next byte will either be the first byte on the next row up (on the left hand side), or it will be a padded zero that the bitmap program has placed in there to maintain certain integers for row length.
\nPadded zeros are used when the number of bytes in a row are not divisible by 4. So if you
\nhad 16 bytes of data per row (16×8 = 128 pixel across), then you would have no padded zeros
\nbecause 16 is divisible by 4. But if your number of bytes of data per row was 30 (30×8 = 240
\npixels across), then 4 would not go evenly into 30. At this point we would round up the number to the nearest integer that 4 will go into. This number would be 32. And since we have 30 bytes of data, 32-30 = 2; so there are 2 bytes of padded zeros in your bitmap before the next line of data begins. Your internal program will have to reflect this and disregard these zeros before going on with the 33rd byte of data. (see Table 1 for quick reference to your display) So for example, if you had a 128×240 display, you would set up your assembly code so it would strip off the first 62 bytes of data from the bitmap file and discard that information. The 63rd byte would be the first byte in the lower left hand side of the LCD display. Then the next 29 bytes of data (240\u00f78 = 30) would get placed directly to the display. Now the next 2 bytes (the padded zeros – see Table 1) must be discarded. The next byte of data will then be placed in the next row up and over on the left hand side. The user will continue this process until he has walked up the display all 128 lines.
\nTable 1 – Correlation between bitmap resolution and padded zeros<\/p>\n

Bitmap Resolution – Bytes Per Row – Padded Zeros Per Row – Totals Divisible By 4<\/p>\n

32×80\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 10\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 2\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 12
\n32×202\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 26\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 4\u00a0\u00a0 \u00a0\u00a0 \u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 30
\n33×100\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 13\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 3\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 16
\n64×128\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 16\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 16
\n64×240\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 30\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 2\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 32
\n64×480\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 60\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 60
\n128×128\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 16\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 16
\n128×240\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 30\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 2\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 32
\n128×256\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 32\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 32
\n200×640\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 80\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 80
\n240×320\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 40\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 \u00a0 \u00a0\u00a0\u00a0\u00a0 0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0\u00a0 40<\/p>\n

If you access the upper bitmap memory by using the data pointer address in your
\nmicroprocessor, then once you paint the first page and increment the data pointer, you will be looking at the first byte of the next picture in your list. There is one thing to remember about a bitmap that is different from a LCD display. In bitmap programs, a 1 in binary is an \u201coff\u201d pixel and a 0 in binary is an \u201con\u201d pixel. This is the opposite on the LCD. So the user will need to perform an \u201cExclusive-Or\u201d with the number \u201cFF Hex\u201d and the data to be placed on the display.
\nThis operation will turn the bytes around so they may be viewed properly. If you don\u2019t do this
\noperation, your picture will be the inverse image of your original picture.
\nFor an example of the subroutine that extracted the bitmap data to produce the picture
\nabove, please see the 8051 assembly code listed below. The display above is a 240×320 Small
\nGraphics Display with a SED1330 controller chip. If you are using a display that is not using the SED1330 controller chip, this same code can be used with modifications to the WRCMD and WRDATA subroutines and possibly some alterations on the direction the data is clocked in. The direction used in the SED1330 is the same as the T6963 controller chip. If you are using the HD61830 you will need to switch the direction of the data being clocked in (i.e. D7 becomes D0,D6 becomes D1, etc.)<\/p>\n

Note : Please read the article source at the end of this message to find the assembly program example ! <\/span><\/p>\n

There are a lot more tricks associated with the individual controller that you choose to
\nuse. Some of them write the data left to right, some go right to left, and some go up to down.
\nYou will have to slightly vary your address pointer on the LCD display to accommodate this.
\nThere are also other tricks with using the pictures to act as your display background while you move discrete bytes of data around inside the image (like in a video game). Densitron
\nCorporation has more information on these processes and how they can be implemented in your particular display. If you would like more information on anything in this application note,please contact Todd Fitzsimmons at Densitron Corporation America at 562-941-5000×247.<\/p>\n

Submitted by Todd Fitzsimmons
\nElectrical Engineer
\nDensitron Corporation America
\n4\/23\/98<\/p>\n

( Source Densitron )<\/p>\n\t

\r\n\t