Home  |  Contents 
Microcontroller and PC projects
  Forum Index : Microcontroller and PC projects         Section
Subject Topic: MM LCD Color Selector Utility Post ReplyPost New Topic
Message << Prev Topic | Next Topic >>

Joined: 03 May 2016
Location: Australia
Online Status: Offline
Posts: 37
Posted: 04 December 2017 at 8:03pm | IP Logged Quote erbp

Attached is a zip file 2017-12-04_194640_MMColorSelect_v1.0.5.zip containing the code for a "Micromite Color Selector / Comparator Utility" that some may find useful when selecting specific colors or color combinations to display on MM LCD Panels. I am not trying to take anything away from TassyJim's TFTColor program (which I have used a lot), but the problem I find with it is that the colors are displayed on a PC screen and then when you get them displayed on a MM LCD, many times they don't look like the ones you saw on the PC. My utility displays the colors and lets you compare two colors (including text overlayed in the other color) directly on the MM LCD - so what you see will be what you will get when you use that color in your program as long as it runs on the same screen or at least the same model screen.

The program has been tested on MM2's and MM+'s and I see no reason why it wouldn't work on a MMX as well - just that I don't have a MMX to test on. I have also tested a variety of LCD panels - 2.8" SPI LCD, 4" IPS SPI LCD, 5" and 7" SSD1963 LCDs. The program requires a minimum of 320 x 240 pixels. It will not run on smaller LCDs. On larger LCDs the horizontal will continue to use only 320 pixels, but the vertical will expand the size of the area displaying the selected color from 65 pixels high (@ 240 VRes) up to a max 160 pixels high (@ >= 335 VRes).

Below is a screen shot of the main screen on a 2.8" 320 x 240 LCD, displaying the minimum sized Color Panel. Please note that many (most) of the colors displayed in the following images are distorted from what the actual screens looks like - I can't get the colors to display properly in the photos.

All following screen shots are using a 4" IPS LCD running in Portrait mode, giving a res of 320 x 400, thus displaying the maximum size Color Panel.

Before proceeding, I must point out that due to being designed for a small screen, the controls are mostly too small to operate with a finger touch - you really need a stylus with a fine tip. Please DON'T use a pencil, a biro, a screwdriver, etc., - you WILL scratch your screen! I use these and although the ebay site captions them for capacitive touch use, I have had no problems using the fine tipped end with any of my MM LCD screens, in fact I find them ideal!!

Following is a brief run though on how to use the utility, but it is hopefully fairly intuitive.

When the program is started, the color displayed defaults to black. There are 3 ways to select a different color:-

1. Use the Decrease / Increase buttons associated with each of the Color Components (Red, Green & Blue) as displayed on the upper portion of the main screen. As these buttons are used the pointer on the associated Color Component horizontal bar will move left or right to indicate the relative % of the maximum brightness. The pointers show in Red when at either the Minimum or Maximum limit, and Yellow for any value in-between.

These buttons are not really intended to be used for setting up a new color (although they can be, but it might be tedious). They are intended for "tweaking" a color already selected -e.g. what if there was a bit more Red in the color, or a bit less Blue, etc. They decrement or increment the associated Color Component value by the step value appropriate for the colordepth used to communicate with the LCD connected to the MM (more on this later).

2. Use a "numeric keyboard" that will be displayed if you touch one of the color value buttons on the upper right of the main screen. This allows a value to be directly entered via the on-screen keyboard for the Color Component you selected. Repeat the process to set each of the other Color Component values as necessary.

The example below is for touching the 3rd (Blue) button.

This screen shows which Color Component has been selected, although the screenshot just shows a White box (upper right) it is actually Blue, the current Value for it and allows a new value to be entered via the keypad. Values 0 - 255 are valid, any value over 255 will display an error and the "Done" button will be disabled. When you have entered the value you want, touch the "Done" button to return to the main screen with the current value for the selected Color Component now displayed in the associated button. Note: The value displayed **may** not be exactly the value you entered via the keypad. It will be adjusted based on colordepth if necessary. This is explained later.

There are also "Clear" and "Cancel" buttons available on the keypad to allow re-entry of a value if a mistake was made, or to return to the main screen without changing the color value.

3. Select from the "Named Colors" list, displayed by touching the "Named Colors" button on the right above the Color Panel. The Named Colors list allows you to select one of the standard 140 HTML colors supposedly supported by all web browsers. The screen shown below will be displayed.

The 140 standard HTML colors are grouped into 10 Color Groups to make navigation easier - Red, Pink, Orange, Yellow, Purple, Green, Blue, Brown, Gray (incl Black) and White. When initially displayed, the list starts at the top - the Red group. You can use the PgUp / PgDn buttons (top left on the screen) to navigate up / down the list - the list displays 10 entries at a time and may include a Color Group header which can't be selected. The 10 color patches down the right side of the screen are shortcuts to the corresponding Color Groups in the list (although the colors in the screenshot are way off) - so if you are looking for a Blue color, instead of having to PgDn from Red to Blue, just touch the Blue color patch and the list will display from the start of the Blue Color Group.

When you find the color you want, touch anywhere in that entry, the part of the screen showing that colored background. A "Selected" pointer will be displayed to the right of the entry touched, and the "Done" button will be enabled - touching it will return to the main screen with the selected color displayed and values displayed in the current Color Component value buttons. As in the previous section, the actual Color Component values **may** not be identical to those that were shown for the Named Color you selected (explained later).

If you select a color on the Named Colors screen but change your mind before touching the "Done" button, you can just touch another entry to select a different color. Also touching any of the PgUp, PgDn or Color Patch buttons will cancel the previous selection and disable the "Done" button until you make a new selection from the section of the list now displayed.

Note the value shown in the Red Color Component value is 248 not 255 as was the value shown for the Red color I selected on the Named Colors screen (see details about ColorDepth below).

Compare Option.
If you want to see how one color looks beside a different one, select one of the colors first (as explained above), then with that color showing in the Color Panel on the main screen, touch the "Compare" button. The Color Panel will be split into 2 halves - left and right. The color you had selected will be shown on the left side, the right side will initially be Black. You can now use the controls to select the second color which will be displayed on the right side, thus allowing you to see how they look side by side.

While in "Compare" mode, all the controls ONLY affect the color on the right side, the original color on the left side is locked. If you want to change the original color, touch the "Compare" button to cancel Compare mode. The Color Panel will revert to showing only the original color and all controls now affect it only. After making the adjustment, touching the "Compare" button again will return to Compare mode with the split Color Panel - the right side will have remembered the color you last selected on it and that will be re-displayed. The controls will now only affect the right side again.

Text Overlay Option.
When "Compare" mode is enabled the "Text Overlay" button will also be anabled. Touching it will cause the string "Sample Text" to be displayed in the center of each Color Panel, using the font color of the opposite panel - thus you can judge how text in one color looks when displayed on a different color background - see example below.

Adjusted Color Component Values and ColorDepth.
ColorDepth refers to the number of bits used to define a given color. Most screens (certainly those used with MMs) define colors using a RGB code (Red, Green, Blue). ColorDepth determines how many bits and therefore the granularity of the brightness values for these 3 colors:

- 24 bit uses a full 8 bits for each color - this gives 256 different levels of Red, Green and Blue which equates to over 16 million different colors (probably more correctly shades). This is also referred to as RGB888.

- 16 bit uses less bits for each of the Red, Green and Blue brightness levels - 5 bits for Red, 6 bits for Green and 5 bits for Blue = 16 bits in total. This gives 65,536 different colors or shades that can be specified and is referred to as RGB565.

All MM LCD's EXCEPT those using the SSD1963 controller use RGB565 encoding to pass the color information from the MM to the LCD display. The conversion from RGB888 which is what the RGB command in the MM supports to the RGB565 encoding is handled invisibly by the MM firmware / screen driver for the SPI connected LCD screens. Some of these screens may not actually support 65K colors and further downscaling may take place within the device itself (I have no information about which devices, if any, do this).

The LCDs using the SSD1963 controller use RGB888 encoding to pass the color information from the MM to the LCD display - this uses 3 bytes and no conversion from the RGB code specified by the MM program is needed. Again some devices may downscale the full 24 bit color code before display.

If the firmware / driver handles this - why is it important? Well it might be if you are using a screen limited to 16 bit ColorDepth and you are trying to adjust a color to get the "perfect" balance you are after. For example suppose the Red value was currently specified as 128 and you want a touch more Red, so you increase it to 132 thinking this will achieve your desired shade - wrong!! With only 5 bits used for Red, the minimum increment is 8, so changing Red from 128 to 132 will be negated by the driver converting to RGB565 and the screen will still see 128 as the Red value. In fact in this example you need to change the Red value to 136 or above for any change to be effective. For Green, since it uses 1 more bit, the minimum increment is 4.

This utility program determines the type of screen connected to the MM it is running on, and if a SSD1963 type, works in full 24 bit ColorDepth. In this case there will be NO adjustments made to the Color Component values you enter or the standard values assigned to the Named Colors. Also the "tweak" Decrement / Increment buttons will change in steps of 1, since all values from 0 - 255 are valid.

If the LCD screen connected does not use a SSD1963 controller, then the program will work in 16 bit ColorDepth. Although there is no need to modify RGB values sent to the screen (the firmware/driver will do this for you), the program does it so you can see the impact of the downscaling that is occurring. Also the "tweak" Decrement / Increment buttons will work in increments appropriate for the color - steps of 8 for Red and Blue, steps of 4 for Green.

I have found this utility to be useful when trying to select colors to use on the LCD screens, I hope some other shedders may also find it helpful.


Back to Top View erbp's Profile Search for other posts by erbp
Regular Member
Regular Member

Joined: 05 August 2014
Location: Australia
Online Status: Offline
Posts: 85
Posted: 05 December 2017 at 10:03am | IP Logged Quote Bill7300

Thanks Phil, both for the utility and for the pointer to the stylus device. The latter should solve an issue I have with driving a small touchscreen on another project.

Back to Top View Bill7300's Profile Search for other posts by Bill7300

Joined: 02 October 2012
Location: Australia
Online Status: Offline
Posts: 411
Posted: 05 December 2017 at 1:32pm | IP Logged Quote panky

Great job Phil, very extensive detail there that I will use and I am sure will be helpful to other shedders.


DonTSM1,Duinomite,CGCMM1,CGCMM2,2xDimitech,3xWWuMites,MicksMuP,Grogster1A,4xPeterMuM+,Zonker DIP-600,3xCGuKits,CGuBoard2,SnadPic100,SCBP64 & Exp100,PMMZ144,PMMZ100 .. and loving it![:D
Back to Top View panky's Profile Search for other posts by panky

If you wish to post a reply to this topic you must first login
If you are not already registered you must first register

  Search the forums using Google.
In the news...
Post ReplyPost New Topic
Printable version Printable version
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot delete your posts in this forum
You cannot edit your posts in this forum
You cannot create polls in this forum
You cannot vote in polls in this forum

Powered by Web Wiz Forums version 7.8
Copyright ©2001-2004 Web Wiz Guide

This page was generated in 0.1250 seconds.
Privacy Policy     Process times : 0.03, 0, 0, 0.09