{"id":62,"date":"2016-11-01T00:00:41","date_gmt":"2016-11-01T00:00:41","guid":{"rendered":"http:\/\/bitmap2lcd.com\/blog\/?p=62"},"modified":"2016-11-01T12:12:13","modified_gmt":"2016-11-01T12:12:13","slug":"animations-on-graphic-lcd-glcd","status":"publish","type":"post","link":"https:\/\/bitmap2lcd.com\/blog\/animations-on-graphic-lcd-glcd\/","title":{"rendered":"Animations on Graphic LCD (GLCD)"},"content":{"rendered":"<h2>Animations on Graphic LCD (GLCD)<\/h2>\n<p style=\"text-align: justify;\">With Bitmap2LCD, you can easily\u00a0<strong>edit<\/strong> and <strong>play<\/strong>\u00a0GLCD\u00a0<strong>animations<\/strong>.<\/p>\n<p style=\"text-align: justify;\">The goal is to create buttons with status dependent graphic effects, device power on and power off splash screens, animated logos, moving icons, display of analog gauges, creating impressive GLCD demos, symbolic\u00a0displays of actions\u00a0in progress or to show the\u00a0current machine operation,\u00a0\u00a0or an animated\u00a0hourglass cursor to name a few.<\/p>\n<p style=\"text-align: justify;\">One of the many interesting features of Bitmap2LCD is the support\u00a0of\u00a0GIF files.<\/p>\n<p style=\"text-align: justify;\">To summarize , the <strong>GIF format<\/strong> supports up to 8 colors per pixel depth (max <strong>256 colors)<\/strong> and also supports animations and allows a separate palette of 256 colors for each frame.<\/p>\n<p style=\"text-align: justify;\"><a href=\"https:\/\/en.wikipedia.org\/wiki\/GIF\" target=\"_blank\">wikipedia about GIF<\/a><\/p>\n<p style=\"text-align: justify;\">Here&#8217;s an example of a short animation made with Bitmap2LCD called HalfEmptyGlass.gif ( Monochrome, 28 frames )<\/p>\n<h6 style=\"text-align: center;\">Click on the image if you want to\u00a0play the animation<\/h6>\n<p><a href=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/HalfEmptyGlass28.gif\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-68\" title=\"HalfEmptyGlass[28]\" src=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/HalfEmptyGlass28.gif\" alt=\"\" width=\"128\" height=\"128\" \/><\/a><\/p>\n<p>The animation sequence is made of frames that you can handle inside\u00a0Bitmap2LCD as single images.<\/p>\n<p>There&#8217;s a built in animation sequence player ,\u00a0similar to a video player with <strong>Play<\/strong>\/ <strong>Stop<\/strong> \/ <strong>pause<\/strong> \/<strong>rewind<\/strong> \/<strong>next<\/strong> frame \/ <strong>previous<\/strong> frame buttons.<\/p>\n<p>When the <strong>animation<\/strong> is ready, you can<strong> export the animation<\/strong> in one run and click to a set of data arrays, with or without <strong>data compression, <\/strong>in case of a monochrome data output.<\/p>\n<h2><\/h2>\n<h2>A GIF animation is a collection of images<\/h2>\n<p>&nbsp;<\/p>\n<h2>Animation features of Bitmap2LCD<\/h2>\n<ul>\n<li>Import all frames of a GIF file inside the Work Canvas<\/li>\n<li>Import a single frame of a GIF file as graphic<\/li>\n<li>Import single images one by one into an animation and save it as a GIF<\/li>\n<li>Create an animation from scratch<\/li>\n<li>Remove, insert, add\u00a0 frames in the animation<\/li>\n<li>Play the animation sequence<\/li>\n<li>Export animation to data arrays in one run<\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<h2>Import a GIF animation<\/h2>\n<p>When clicking inside the <strong>File Explorer<\/strong> <a href=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/File-explorer.bmp\"><img decoding=\"async\" class=\"alignnone size-full wp-image-2279\" src=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/File-explorer.bmp\" alt=\"file-explorer\" \/><\/a> on the filename of a GIF file, You can 1) import a single frame from inside a GIF as a single graphic, or 2) import all of the frames of the animations inside the Work Canvas (<strong>GIF Import button<\/strong> -&gt; <span style=\"color: #0000ff;\"><strong>blue arrow<\/strong><\/span>)<\/p>\n<p>In the Graphics Preview Window, you can also play the animation (<strong><span style=\"color: #ff00ff;\">purple arrow<\/span><\/strong>) , find a specific frame using the track bar (<span style=\"color: #008000;\"><strong>green arrow<\/strong><\/span>) or browse the GIF using the GIF Components Browser (<strong><span style=\"color: #ff0000;\">red arrow<\/span><\/strong>)<\/p>\n<p><span style=\"color: #ffffff;\">P57BU2H9V2FH<\/span><\/p>\n<p><a href=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2277\" src=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_1.png\" alt=\"bitmap2lcd-glcd-animation_1\" width=\"925\" height=\"672\" srcset=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_1.png 925w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_1-300x218.png 300w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_1-768x558.png 768w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_1-624x453.png 624w\" sizes=\"auto, (max-width: 925px) 100vw, 925px\" \/><\/a><\/p>\n<p><strong>1) <em>Graphic Preview<\/em> ) GIF Import button<\/strong> -&gt; <span style=\"color: #0000ff;\"><strong>blue arrow<\/strong><\/span><\/p>\n<p><a href=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_2.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2281\" src=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_2.png\" alt=\"bitmap2lcd-glcd-animation_2\" width=\"1232\" height=\"927\" srcset=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_2.png 1232w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_2-300x226.png 300w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_2-768x578.png 768w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_2-1024x770.png 1024w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_2-624x470.png 624w\" sizes=\"auto, (max-width: 1232px) 100vw, 1232px\" \/><\/a><\/p>\n<p><strong>2) <em>Work Canvas<\/em> ) Paste button<\/strong> -&gt; <span style=\"color: #008000;\"><strong>green arrow<\/strong><\/span><\/p>\n<p><a href=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_3.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2283\" src=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_3.png\" alt=\"bitmap2lcd-glcd-animation_3\" width=\"1232\" height=\"927\" srcset=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_3.png 1232w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_3-300x226.png 300w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_3-768x578.png 768w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_3-1024x770.png 1024w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_3-624x470.png 624w\" sizes=\"auto, (max-width: 1232px) 100vw, 1232px\" \/><\/a><\/p>\n<p><strong>3) <em>Work Canvas<\/em> ) Edit Animation<\/strong> -&gt; <span style=\"color: #ff6600;\"><strong>Yellow arrow -&gt; <span style=\"color: #ff0000;\">Red frame<\/span><br \/>\n<\/strong><\/span><\/p>\n<p><strong>4)<\/strong> <a href=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2015\/11\/Start.bmp\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2068\" src=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2015\/11\/Start.bmp\" alt=\"Start\" width=\"16\" height=\"16\" \/><\/a> <strong>Export<\/strong> animation to data arrays<\/p>\n<p><a href=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_Data_Array_1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2287\" src=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_Data_Array_1.png\" alt=\"bitmap2lcd-glcd-animation_data_array_1\" width=\"926\" height=\"543\" srcset=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_Data_Array_1.png 926w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_Data_Array_1-300x176.png 300w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_Data_Array_1-768x450.png 768w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_Data_Array_1-624x366.png 624w\" sizes=\"auto, (max-width: 926px) 100vw, 926px\" \/><\/a><\/p>\n<p><strong>5)<em> Text editors<\/em> ) Browse data array files<\/strong> (<span style=\"color: #0000ff;\"><strong>blue arrow<\/strong><\/span>)<\/p>\n<p><a href=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_Data_Array_2.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2288\" src=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_Data_Array_2.png\" alt=\"bitmap2lcd-glcd-animation_data_array_2\" width=\"926\" height=\"543\" srcset=\"https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_Data_Array_2.png 926w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_Data_Array_2-300x176.png 300w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_Data_Array_2-768x450.png 768w, https:\/\/bitmap2lcd.com\/blog\/wp-content\/uploads\/2012\/05\/bitmap2LCD-GLCD-Animation_Data_Array_2-624x366.png 624w\" sizes=\"auto, (max-width: 926px) 100vw, 926px\" \/><\/a><\/p>\n<p><strong>6) <em>Text editors<\/em> ) Check the clip unit\u00a0 <\/strong><\/p>\n<p><strong>( Filename format : clip_ArtWorkName_NumberOfFrames.h )<\/strong><\/p>\n\t<div class=\"quickshare-container\">\r\n\t<ul class=\"quickshare-genericons quickshare-effect-round quickshare-effect-expand quickshare-small\">\r\n\t\t<li class=\"quickshare-share\"><\/li> \r\n\t\t<li><a href=\"https:\/\/facebook.com\/sharer.php?u=https%3A%2F%2Fbitmap2lcd.com%2Fblog%2Fanimations-on-graphic-lcd-glcd%2F&amp;t=Animations+on+Graphic+LCD+%28GLCD%29+<+Bitmap2LCD+Software+Tool+Blog+%3A%3A+about+GLCD+displays+and+Programming\" target=\"_blank\" title=\"Share on Facebook\"><span class=\"quickshare-facebook\">Facebook<\/span><\/a><\/li>\t\t<li><a href=\"https:\/\/twitter.com\/intent\/tweet?url=https%3A%2F%2Fbitmap2lcd.com%2Fblog%2Fanimations-on-graphic-lcd-glcd%2F&amp;text=Animations+on+Graphic+LCD+%28GLCD%29+<+Bitmap2LCD+Software+Tool+Blog+%3A%3A+about+GLCD+displays+and+Programming\" target=\"_blank\" title=\"Share on Twitter\"><span class=\"quickshare-twitter\">Twitter<\/span><\/a><\/li>\t\t<li><a href=\"http:\/\/pinterest.com\/pin\/create\/button\/?url=https%3A%2F%2Fbitmap2lcd.com%2Fblog%2Fanimations-on-graphic-lcd-glcd%2F&amp;media=https%3A%2F%2Fbitmap2lcd.com%2Fblog%2Fwp-content%2Fuploads%2F2012%2F05%2Fbitmap2LCD-GLCD-Animation_Data_Array_2-300x176.png&amp;description=Animations+on+Graphic+LCD+%28GLCD%29+With+Bitmap2LCD%2C+you+can+easily%C2%A0edit+and+play%C2%A0GLCD%C2%A0animations.+The+goal+is+to+create+buttons+with+status+dependent+graphic+effects%2C+device+power+on+and+power+off+splash+screens%2C+animated+logos%2C+moving+icons%2C+display+of+analog+gauges%2C+creating%26hellip%3B\" target=\"_blank\" title=\"Share on Pinterest\"><span class=\"quickshare-pinterest\">Pinterest<\/span><\/a><\/li>\t\t<li><a href=\"http:\/\/linkedin.com\/shareArticle?mini=true&amp;url=https%3A%2F%2Fbitmap2lcd.com%2Fblog%2Fanimations-on-graphic-lcd-glcd%2F&amp;title=Animations+on+Graphic+LCD+%28GLCD%29&amp;source=Bitmap2LCD+Software+Tool+Blog+%3A%3A+about+GLCD+displays+and+Programming&amp;summary=Animations+on+Graphic+LCD+%28GLCD%29+With+Bitmap2LCD%2C+you+can+easily%C2%A0edit+and+play%C2%A0GLCD%C2%A0animations.+The+goal+is+to+create+buttons+with+status+dependent+graphic+effects%2C+device+power+on+and+power+off+splash+screens%2C+animated+logos%2C+moving+icons%2C+display+of+analog+gauges%2C+creating%26hellip%3B\" title=\"Share on Linkedin\" target=\"_blank\"><span class=\"quickshare-linkedin\">Linkedin<\/span><\/a><\/li>\t\t<li><a href=\"https:\/\/plus.google.com\/share?url=https%3A%2F%2Fbitmap2lcd.com%2Fblog%2Fanimations-on-graphic-lcd-glcd%2F\" target=\"_blank\" title=\"Share on Google+\"><span class=\"quickshare-googleplus\">Google+<\/span><\/a><\/li>\t\t\t\t\t\t\t\t<li><a href=\"mailto:?subject=Bitmap2LCD+Software+Tool+Blog+%3A%3A+about+GLCD+displays+and+Programming:+Animations+on+Graphic+LCD+%28GLCD%29&amp;body=https%3A%2F%2Fbitmap2lcd.com%2Fblog%2Fanimations-on-graphic-lcd-glcd%2F\" target=\"_blank\" title=\"Share via Email\"><span class=\"quickshare-email\">Email<\/span><\/a><\/li>\t<\/ul>\r\n\t<\/div>\r\n","protected":false},"excerpt":{"rendered":"<p>Animations on Graphic LCD (GLCD) With Bitmap2LCD, you can easily\u00a0edit and play\u00a0GLCD\u00a0animations. The goal is to create buttons with status dependent graphic effects, device power on and power off splash screens, animated logos, moving icons, display of analog gauges, creating impressive GLCD demos, symbolic\u00a0displays of actions\u00a0in progress or to show the\u00a0current machine operation,\u00a0\u00a0or an animated\u00a0hourglass [&hellip;]<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"categories":[17],"tags":[716,719,718,714,214,717,712,713,715],"class_list":["post-62","post","type-post","status-publish","format-standard","hentry","category-animations-and-glcd","tag-analog-gauges","tag-animated-cursor","tag-animated-hourglass","tag-animated-logos","tag-glcd-animation","tag-glcd-demos","tag-glcd-gif","tag-graphic-lcd-anim","tag-moving-icons"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/bitmap2lcd.com\/blog\/wp-json\/wp\/v2\/posts\/62","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/bitmap2lcd.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/bitmap2lcd.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/bitmap2lcd.com\/blog\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/bitmap2lcd.com\/blog\/wp-json\/wp\/v2\/comments?post=62"}],"version-history":[{"count":32,"href":"https:\/\/bitmap2lcd.com\/blog\/wp-json\/wp\/v2\/posts\/62\/revisions"}],"predecessor-version":[{"id":2301,"href":"https:\/\/bitmap2lcd.com\/blog\/wp-json\/wp\/v2\/posts\/62\/revisions\/2301"}],"wp:attachment":[{"href":"https:\/\/bitmap2lcd.com\/blog\/wp-json\/wp\/v2\/media?parent=62"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/bitmap2lcd.com\/blog\/wp-json\/wp\/v2\/categories?post=62"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/bitmap2lcd.com\/blog\/wp-json\/wp\/v2\/tags?post=62"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}