Prev: Inserting new menu at run time
Next: log(0) causing a crash on one particular windows XP (SP3) machine
From: Robby on 16 Apr 2010 10:58 Hello, I am creating my own icons/ pictures for an embedded system. Basically, I am storing these images (pictures and icons) into an external flash. I then fecth this information and have a grapics library (EasyGUI) display it onto an LCD screen. Having unique designs for icons and pictures I do have the choice of displaying them on three different LCD sizes... 1.5", 2.0" and 2.8". So if I fecth an icon for the 1.5" LCD screen, I display it as it as stored which fits exactly in this screen size. But if I then use a 2.0" screen with a wider pixel resolution, my same icon or pictures will display too small. The obvious solution would be to store every icon and picture three times each one corresponding to a screen size. But that's no good, I would be wasting a lot of memory. So I thought of storing the smallest icon or picture size in flash and depending on the LCD screen size being used, I would load the icon or pic and enlarge the image accordingly. But this brings up the following problem. For example if I have an icon with 5 pixels wide by 1 pixel high with the following colors: [red] [orange] [blue] [grey] [green] and lets suppose this icon fits perfectly for the 1.5" LCD. But if I need to display it for the 2.0" LCD, I can double the colors and display it like this: [red] [red] [orange] [orange] [blue] [blue] [grey] [grey] [green] [green] In terms of pixles lets bare in mind that the 1.5" LCD is 176 pixels wide and that the 2.0" LCD is 220 pixles wide. So in proportion we see that a 2.0" LCD is not double the pixel density size of the 1.5" LCD. Geting back to the 5 pixels wide icon (the original one) I would have to increase its width by approximately 1.25 times to proportionally display it on the 2.0" LCD which is about 7 pixels wide instead of 5. So the question is which pixels would I double in order to still maintain the same icon image. Okay, okay... in this case we might all agree to just double up any two pixels ... fro example the red and the blue. So I put it to the test. I opened a graphics editor and drew the simple 5 x 1 pixel icon and streched it one pixel to the right and this is what I got: [red] [orange] [blue] [grey] [green] [green] and then streched it one more pixle to the right, and to my surpise, this is what I got: [red] [orange] [orange] [blue] [grey][grey] [green] Now, why did the editor decide to remove a green, and add a grey and orange??? The reason I am asking this is, if I will store every icon and picture once in external flash, I need to know what pixles I need to double so that my icon or pics get enlarged but don't lose their graphical integrity or appearence. I might want to display these icons/pics in many different sizes, my question to you guy's, is their a certain algorithm or rule of thumb used when elarging or reducing graphics? All feedback appreciated. Rob
From: Igor Tandetnik on 16 Apr 2010 11:23 Robby <Robby(a)discussions.microsoft.com> wrote: > So I thought of storing the smallest icon or picture size in flash and > depending on the LCD screen size being used, I would load the icon or > pic and enlarge the image accordingly. But this brings up the > following problem. You are reinventing resampling http://en.wikipedia.org/wiki/Resampling_(bitmap) http://en.wikipedia.org/wiki/Upsampling http://en.wikipedia.org/wiki/Downsampling http://en.wikipedia.org/wiki/Antialiasing Any decent graphic library should be able to do this for you. It's probably better to store the image at the highest supported resolution and downsample it for lower resolutions, than the other way round. It's always easier to discard extra information than to synthesize missing information out of thin air. > In terms of pixles lets bare in mind that the 1.5" LCD is 176 pixels > wide > and that the 2.0" LCD is 220 pixles wide. So in proportion we see > that a 2.0" LCD is not double the pixel density size of the 1.5" LCD. > Geting back to the 5 pixels wide icon (the original one) I would have > to increase its width by approximately 1.25 times to proportionally > display it on the 2.0" LCD which is about 7 pixels wide instead of 5. Actually, 5*1.25=6.25 which is closer to 6 than to 7. > So the question is which pixels would I double in order to still > maintain > the same icon image. That's too simplistic and not how it's usually done. -- With best wishes, Igor Tandetnik With sufficient thrust, pigs fly just fine. However, this is not necessarily a good idea. It is hard to be sure where they are going to land, and it could be dangerous sitting under them as they fly overhead. -- RFC 1925
From: Victor Bazarov on 16 Apr 2010 11:28 Robby wrote: > I am creating my own icons/ pictures for an embedded system. Basically, I am > storing these images (pictures and icons) into an external flash. I then > fecth this information and have a grapics library (EasyGUI) display it onto > an LCD screen. > > Having unique designs for icons and pictures I do have the choice of > displaying them on three different LCD sizes... 1.5", 2.0" and 2.8". So if I > fecth an icon for the 1.5" LCD screen, I display it as it as stored which > fits exactly in this screen size. But if I then use a 2.0" screen with a > wider pixel resolution, my same icon or pictures will display too small. The > obvious solution would be to store every icon and picture three times each > one corresponding to a screen size. But that's no good, I would be wasting a > lot of memory. Here is a news flash for you: that is not "wasting a lot of memory", that's using memory to store the optimal image for every resolution instead of agonizing over how to scale your smallest image during run-time. It is commonly known as *a performance trade-off*. There is more to the performance than just speed of execution of your program. It's also the delivery of your final product to the customer, the quality (which if it is higher, leads to giving you more time to develop next version), etc. > So I thought of storing the smallest icon or picture size in flash and > depending on the LCD screen size being used, I would load the icon or pic and > enlarge the image accordingly. How about inverse? Store the largest and scale it down? Would you know which pixels to remove? > But this brings up the following problem. > > For example if I have an icon with 5 pixels wide by 1 pixel high with the > following colors: > > [red] [orange] [blue] [grey] [green] > > and lets suppose this icon fits perfectly for the 1.5" LCD. But if I need to > display it for the 2.0" LCD, I can double the colors and display it like this: > > [red] [red] [orange] [orange] [blue] [blue] [grey] [grey] [green] [green] > > In terms of pixles lets bare in mind that the 1.5" LCD is 176 pixels wide > and that the 2.0" LCD is 220 pixles wide. So in proportion we see that a 2.0" > LCD is not double the pixel density size of the 1.5" LCD. Geting back to the > 5 pixels wide icon (the original one) I would have to increase its width by > approximately 1.25 times to proportionally display it on the 2.0" LCD which > is about 7 pixels wide instead of 5. > > So the question is which pixels would I double in order to still maintain > the same icon image. You wouldn't. What you need to do is figure out an interpolation. Keep the end pixels the same, say, and recalculate the color of the other ones so the entire image *appears* close. It's not as simple as doubling the pixels at all. > Okay, okay... in this case we might all agree to just > double up any two pixels ... fro example the red and the blue. So I put it to > the test. I opened a graphics editor and drew the simple 5 x 1 pixel icon and > streched it one pixel to the right and this is what I got: > > [red] [orange] [blue] [grey] [green] [green] > > and then streched it one more pixle to the right, and to my surpise, this is > what I got: > > [red] [orange] [orange] [blue] [grey][grey] [green] > > Now, why did the editor decide to remove a green, and add a grey and orange??? Because they are in the middle, maybe? It's a perceptional thing, and really has nothing to do with programming or Visual C++, and you're asking in the wrong newsgroup. Try 'comp.graphics.algorithms'. > The reason I am asking this is, if I will store every icon and picture once > in external flash, I need to know what pixles I need to double so that my > icon or pics get enlarged but don't lose their graphical integrity or > appearence. I might want to display these icons/pics in many different sizes, > my question to you guy's, is their a certain algorithm or rule of thumb used > when elarging or reducing graphics? Again. Wrong newsgroup. See above. V -- Please remove capital 'A's when replying by e-mail I do not respond to top-posted replies, please don't ask
From: Tamas Demjen on 16 Apr 2010 19:50 Robby wrote: > The reason I am asking this is, if I will store every icon and picture once > in external flash, I need to know what pixles I need to double so that my > icon or pics get enlarged but don't lose their graphical integrity or > appearence. I might want to display these icons/pics in many different sizes, > my question to you guy's, is their a certain algorithm or rule of thumb used > when elarging or reducing graphics? You already got good answers, but I don't believe you'll be able to implement what you're hoping for. There are very good algorithms to scale palm-sized or larger images, but when it comes to ultra compact application icons, you won't be able to resize them with high quality, no matter how good your interpolation is. Each pixel contains so much information that you won't be able to reconstruct the original curves, which would be necessary for a really nice resize. It's about art and perception. The only way to go is to take the original artwork and re-render it. If the source is vector graphics, the artist can simply rasterize it at a different resolution. Another consideration is that a 40x40 icon may have an entirely different design than a 10x10 one. You can't possibly fit too much detail in a tiny size, so you have to simplify your design. This is more art than programming. You have to ask your artist to design all the icon sizes that you need at once, in which case they should all look very smooth yet sharp. It needs the eye of a human being, not a computer program, IMHO. If you must resize in program, use bicubic interpolation followed by some sharpening. Tom
From: Robby on 17 Apr 2010 07:02
Thanks guys for you feedback. I am shopping around for a set of graphics libraries and I will evaluate if the libraries can resample/resize graphics information for me before displaying it. I am looking into EasyGUI, but I don't think it does it.. but I will inquire. Thanks all for replying to my post even though it really isn't about VC++. Your insight was very appreciated. Rob |