FT800Widget

FirewingUser.FT800Widget History

Hide minor edits - Show changes to output

May 23, 2014, at 03:57 PM by David Barker -
Changed line 3 from:
%justify%One of the great features of the FT800 chip (as used on the Gameduino 2 and FTDI VM800B43A module) is that is has many built in commands to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on. In many cases, these built in widgets are more that capable of delivering high quality user interfaces in very short time scales. However, they are based on vector rendering and if you want to deliver something a little more slick to your customers, then a custom drawn bitmap is what you need. 
to:
%justify%One of the great features of the FT800 chip (as used on the [[http://excamera.com/sphinx/gameduino2 | Gameduino]] and FTDI [[http://www.ftdichip.com/Products/Modules/VM800B.html | VM800B43A module]]) is that is has many built in commands to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on. In many cases, these built in widgets are more that capable of delivering high quality user interfaces in very short time scales. However, they are based on vector rendering and if you want to deliver something a little more slick to your customers, then a custom drawn bitmap is what you need. 
May 23, 2014, at 03:56 PM by David Barker -
Changed line 3 from:
%justify%One of the great features of the FT800 is that is has many built in commands to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on. In many cases, these built in widgets are more that capable of delivering high quality user interfaces in very short time scales. However, they are based on vector rendering and if you want to deliver something a little more slick to your customers, then a custom drawn bitmap is what you need. 
to:
%justify%One of the great features of the FT800 chip (as used on the Gameduino 2 and FTDI VM800B43A module) is that is has many built in commands to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on. In many cases, these built in widgets are more that capable of delivering high quality user interfaces in very short time scales. However, they are based on vector rendering and if you want to deliver something a little more slick to your customers, then a custom drawn bitmap is what you need. 
May 23, 2014, at 03:40 PM by David Barker -
Changed line 7 from:
%justify%The original PNGs can be created in any suitable editing program, which are then turned into zlib compressed *.bin files.  This is achieved by using the [[http://www.ftdichip.com/Support/Utilities.htm | image conversion software]] provided by FTDI.  The *.bin image files used and source code for this project can be downloaded from here
to:
%justify%The original PNGs can be created using any suitable editing program, which are then turned into zlib compressed *.bin files.  This is achieved by using the [[http://www.ftdichip.com/Support/Utilities.htm | image conversion software]] provided by FTDI.  The *.bin image files used and source code for this project can be downloaded from here
May 23, 2014, at 03:38 PM by David Barker -
Changed lines 7-8 from:
%justify%The original PNGs can be created in any suitable editing program, which are then turned into zlib compressed *.bin files.  This is achieved by using the [[http://www.ftdichip.com/Support/Utilities.htm | image conversion software]] provided by FTDI.  The *.bin image files used in the demo can be downloaded from here
to:
%justify%The original PNGs can be created in any suitable editing program, which are then turned into zlib compressed *.bin files.  This is achieved by using the [[http://www.ftdichip.com/Support/Utilities.htm | image conversion software]] provided by FTDI.  The *.bin image files used and source code for this project can be downloaded from here

* [[Attach:widgets.zip | widget source code]]
May 23, 2014, at 02:39 PM by David Barker -
Changed lines 47-52 from:
The demo code also shows a 7 segment display.  This is a new widget and is simply a bitmap "strip" with each of the 7 segments (0..9) stacked on top of each other, giving a total bitmap size of 53 x 800.  Because there are ten elements, each segment is therefore 80 pixels in height. As a bonus, frame 0 corresponds to segment 0, frame 1 to segment 1 and so on.  So to display
to:
The demo code also shows a 7 segment display.  This is a new widget and is simply a bitmap "strip" with each of the 7 segments (0..9) stacked on top of each other, giving a total bitmap size of 53 x 800.  Because there are ten elements, each segment is therefore 80 pixels in height. As a bonus, frame 0 corresponds to segment 0, frame 1 to segment 1 and so on.  So to display, we use:
=firewing [=
dim bmpSeg as Bitmap = Ft.LoadBitmap("segstrip.bin", 53, 800, RGB565, 10)
Ft.DrawBitmap(5, 5, bmpSeg, 7)
=]
This will load a RGB565 formatted bitmap with 10 frames and display the number 7 at location 5,5.
May 23, 2014, at 02:34 PM by David Barker -
Added line 47:
The demo code also shows a 7 segment display.  This is a new widget and is simply a bitmap "strip" with each of the 7 segments (0..9) stacked on top of each other, giving a total bitmap size of 53 x 800.  Because there are ten elements, each segment is therefore 80 pixels in height. As a bonus, frame 0 corresponds to segment 0, frame 1 to segment 1 and so on.  So to display
May 23, 2014, at 01:44 PM by David Barker -
Changed lines 7-13 from:
The original PNGs can be created in any suitable editing program, which are then turned into zlib compressed *.bin files.  This is achieved by using the [[http://www.ftdichip.com/Support/Utilities.htm | image conversion software]] provided by FTDI.  The *.bin image files used in the demo can be downloaded from here

* Attach:widget-images.zip



to:
%justify%The original PNGs can be created in any suitable editing program, which are then turned into zlib compressed *.bin files.  This is achieved by using the [[http://www.ftdichip.com/Support/Utilities.htm | image conversion software]] provided by FTDI.  The *.bin image files used in the demo can be downloaded from here

* [[Attach:widget-images.zip | widget-images.zip]]

To load a file into your program and display, simply use:

=firewing [=
Added lines 15-49:
Ft.DrawBitmap(10, 10, bmpClock)
=]
%justify%which will load the image from an SD card, initialise a new variable bitmap structure and then draw to the screen at position 10, 10. Of course, this will only display the bitmap - not the hour, second or minute hands.  To do this, use the FT800 command cmd_clock() with options that disable rendering of the clock face and tick marks.  The example code places all of this in a single subroutine, which makes it easy to place the clock anywhere on the screen, like this
=firewing [=
' display clock to the screen...
sub DisplayClock(x as ushort, y as ushort, bmp as Bitmap, optional alpha as byte = 255)
  dim Time As DS1307.RtcTime = DS1307.ReadTime()  ' get the current time 
  Ft.RestoreContext()                            ' restore previous drawing state
  Ft.ColorA(alpha)                                ' set clock transparency
  Ft.DrawBitmap(x, y, bmp)                        ' draw the bimap
 
  ' gray minute and hours...   
  Ft.ColorRGB(50,50,50)
  Ft.cmd_clock(x + 63, y + 63, 62, OPT_NOSECS or OPT_NOTICKS or OPT_NOBACK, Time.Hour,
                                                                            Time.Minute,
                                                                            Time.Second, 0)       
  ' red second hand...
  Ft.ColorRGB(200,0,0)
  Ft.cmd_clock(x + 63, y + 63, 62, OPT_NOHM or OPT_NOTICKS or OPT_NOBACK, Time.Hour,
                                                                          Time.Minute,
                                                                          Time.Second, 0)     
end sub
=]
%justify%The same technique is used to draw the gauge.  For example,
=firewing [=
' display speed gauge...
sub DisplayGauge(x as ushort, y as ushort, bmp as Bitmap, pos as byte)
  Ft.DrawBitmap(x - (bmp.Width / 2), y - (bmp.Height / 2), bmp)
  Ft.ColorRGB(200,0,0)
  Ft.cmd_gauge(x, y, 102, OPT_FLAT or OPT_NOTICKS or OPT_NOBACK, 0, 0, pos, 200)   
end sub
=]


May 23, 2014, at 01:28 PM by David Barker -
Added lines 6-14:

The original PNGs can be created in any suitable editing program, which are then turned into zlib compressed *.bin files.  This is achieved by using the [[http://www.ftdichip.com/Support/Utilities.htm | image conversion software]] provided by FTDI.  The *.bin image files used in the demo can be downloaded from here

* Attach:widget-images.zip




dim bmpClock as Bitmap = Ft.LoadBitmap("clock.bin", 126, 126)
May 23, 2014, at 01:21 PM by David Barker -
Changed lines 3-5 from:
%justify%One of the great features of the FT800 is that is has many built in commands to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on. In many cases, these built in widgets are more that capable of delivering high quality user interfaces in very short time scales. However, they are based on vector rendering and if you want to deliver something a little more slick to your customers, then a custom drawn bitmap is what you need.  In the picture shown here, the clock and speed gauge use custom bitmaps but clock and gauge commands are overlaid in order to display the gauge needle and clock hour, minute and second hands.  You can [[https://www.youtube.com/watch?v=eAJSSxKjTx0&feature=youtu.be | view a video]] showing them being used.  This can give your interface a very polished effect or enable you to create something very specific to your application.
to:
%justify%One of the great features of the FT800 is that is has many built in commands to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on. In many cases, these built in widgets are more that capable of delivering high quality user interfaces in very short time scales. However, they are based on vector rendering and if you want to deliver something a little more slick to your customers, then a custom drawn bitmap is what you need. 

%justify%
In the picture shown here, the clock and speed gauge use custom bitmaps but clock and gauge commands are overlaid in order to display the gauge needle and clock hour, minute and second hands.  You can [[https://www.youtube.com/watch?v=eAJSSxKjTx0&feature=youtu.be | view a video]] showing them being used.  This can give your interface a very polished effect or enable you to create something very specific to your application.
May 23, 2014, at 01:21 PM by David Barker -
Changed line 3 from:
%justify%One of the great features of the FT800 is that is has many built in commands to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on. In many cases, these built in widgets are more that capable of delivering high quality user interfaces in very short time scales. However, they are based on vector rendering and if you want to deliver something a little more slick to your customers, then a custom drawn bitmap is what you need to look at using.  In the picture shown here, the clock and speed gauge use custom bitmaps but overlay the built in clock and gauge commands to display the gauge needle and clock hours, minutes and seconds hand.  You can [[https://www.youtube.com/watch?v=eAJSSxKjTx0&feature=youtu.be | view a video]] showing them in action.
to:
%justify%One of the great features of the FT800 is that is has many built in commands to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on. In many cases, these built in widgets are more that capable of delivering high quality user interfaces in very short time scales. However, they are based on vector rendering and if you want to deliver something a little more slick to your customers, then a custom drawn bitmap is what you need.  In the picture shown here, the clock and speed gauge use custom bitmaps but clock and gauge commands are overlaid in order to display the gauge needle and clock hour, minute and second hands.  You can [[https://www.youtube.com/watch?v=eAJSSxKjTx0&feature=youtu.be | view a video]] showing them being used.  This can give your interface a very polished effect or enable you to create something very specific to your application.
May 23, 2014, at 01:17 PM by David Barker -
Changed lines 3-6 from:
%justify%'''One of the great features of the FT800 is that is has many built in command to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on.


Firewing is a modular hardware and software development system based around a powerful Microchip 16 bit microcontroller. With 128KB of ROM (program storage) and 8KB of working RAM, you will be able to realise many great projects using the free Firewing compiler
.'''
to:
%justify%One of the great features of the FT800 is that is has many built in commands to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on. In many cases, these built in widgets are more that capable of delivering high quality user interfaces in very short time scales. However, they are based on vector rendering and if you want to deliver something a little more slick to your customers, then a custom drawn bitmap is what you need to look at using.  In the picture shown here, the clock and speed gauge use custom bitmaps but overlay the built in clock and gauge commands to display the gauge needle and clock hours, minutes and seconds hand.  You can [[https://www.youtube.com/watch?v=eAJSSxKjTx0&feature=youtu.be | view a video]] showing them in action.


May 23, 2014, at 01:10 PM by David Barker -
Changed line 3 from:
%color=#4088b8 justify%'''One of the great features of the FT800 is that is has many built in command to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on.
to:
%justify%'''One of the great features of the FT800 is that is has many built in command to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on.
May 23, 2014, at 01:10 PM by David Barker -
Added lines 1-6:
%lfloat text-align=center margin-top=5px margin-right=16px margin-bottom=5px margin-left=16px% Attach:widget.jpg |

%color=#4088b8 justify%'''One of the great features of the FT800 is that is has many built in command to render different user interface widgets to the screen.  For example, scroll bars, gauges, clocks and so on.


Firewing is a modular hardware and software development system based around a powerful Microchip 16 bit microcontroller. With 128KB of ROM (program storage) and 8KB of working RAM, you will be able to realise many great projects using the free Firewing compiler.'''
May 23, 2014, at 12:59 PM by David Barker -