LCD1100 User Guide - Revision history

Mparadis at 21:16, 17 January 2022

2022-01-17T21:16:36Z

← Older revision		Revision as of 21:16, 17 January 2022
Line 35:		Line 35:
	{{UGC-Start}}		{{UGC-Start}}
	{{UGC-Addressing}}		{{UGC-Addressing}}
			{{UGC-Firmware}}
	{{UGC-Entry\|How to Draw a Bitmap Image\|\|		{{UGC-Entry\|How to Draw a Bitmap Image\|\|
	Bitmaps define images to be drawn on the screen of the Graphic LCD display. Bitmaps on the Graphic LCD display are made up of pixels arranged in a grid with a size defined when the bitmap is drawn.		Bitmaps define images to be drawn on the screen of the Graphic LCD display. Bitmaps on the Graphic LCD display are made up of pixels arranged in a grid with a size defined when the bitmap is drawn.

Mparadis at 20:12, 28 January 2021

2021-01-28T20:12:34Z

@@ Line 4: / Line 4: @@
 [[Category:UserGuide]]
 ==Part 1: Setup==
-{{UGIntro|LCD1100}}
+{{PT1 Deck Sequence}}
 == Part 2: Using Your Phidget ==

Mparadis at 21:14, 4 August 2020

2020-08-04T21:14:05Z

← Older revision		Revision as of 21:14, 4 August 2020
Line 1:		Line 1:
	__NOINDEX__		__NOINDEX__
			__NOTOC__
	<metadesc>Control a 64x128-pixel LCD display from a VINT port with this graphic LCD Phidget.</metadesc>		<metadesc>Control a 64x128-pixel LCD display from a VINT port with this graphic LCD Phidget.</metadesc>
	[[Category:UserGuide]]		[[Category:UserGuide]]
	==~~Getting Started~~==		==Part 1: Setup==
	{{UGIntro\|LCD1100}}		{{UGIntro\|LCD1100}}
	* [{{SERVER}}/products.php?product_id=LCD1100 LCD1100 - Graphic LCD Phidget]		* [{{SERVER}}/products.php?product_id=LCD1100 LCD1100 - Graphic LCD Phidget]
Line 16:		Line 17:
	<br clear="all">		<br clear="all">

	==Using ~~the LCD1000~~==		{{UGcontrolpanel\|LCD1100}}

			== Part 2: Using Your Phidget ==

			===About===
			The Graphic LCD Phidget allows you to display simple images and text. The screen is 128 pixels wide and 64 pixels tall, and each pixel is 0.45 mm. The backlight brightness and pixel contrast can both be controlled from software. You can use default fonts or load your own. The frame buffer allows you to save fonts and images.

			===Explore Your Phidget Channels Using The Control Panel===

			You can use your Control Panel to explore your Phidget's channels.

			'''1.''' Open your Control Panel, and you will find the following channel:

	~~{{UGcontrolpanel~~\|~~LCD1100}}~~		[[Image:LCD1100_Panel.jpg\|link=\|center]]

	~~{{ugGraphicLCD}}~~		'''2.''' Double click on the channel to open the example program. This channel belongs to the '''LCD''' channel class:

	{{~~ugAddressingInformation~~}}		{{UGC-Start}}

	{{~~ugUsingYourOwnProgram~~\|~~LCD1100}}~~		{{UGC-Entry\|Graphic LCD Phidget:\| Draws shapes, text, and bitmaps to the LCD screen\|
			In your Control Panel, double click on "Graphic LCD Phidget":

	=~~=Technical Section==~~		[[Image:LCD1100-LCD.jpg\|center\|link=]]}}

	~~===Custom Characters===~~		{{UGC-End}}
	~~===Bitmaps===~~
	~~Bitmaps define images to be drawn on the screen of the Graphic LCD display. Bitmaps on the Graphic LCD display are made up of pixels arranged in a grid with a size defined when the bitmap is drawn.~~

	~~You can create a bitmap by defining a byte array of ones and zeroes. Ones are colored in, and zeroes are empty. If you put a line break after each row, it'll be easy to edit the bitmap.~~		{{UG-Part3}}

			== Part 4: Advanced Topics and Troubleshooting ==
			{{UGC-Start}}
			{{UGC-Addressing}}
			{{UGC-Entry\|How to Draw a Bitmap Image\|\|
			Bitmaps define images to be drawn on the screen of the Graphic LCD display. Bitmaps on the Graphic LCD display are made up of pixels arranged in a grid with a size defined when the bitmap is drawn.
			You can create a bitmap by defining a byte array of ones and zeroes. Ones are colored in, and zeroes are empty. If you put a line break after each row, it'll be easy to edit the bitmap.
	In C#, this may look something like this:		In C#, this may look something like this:

	<source lang=cpp>		<source lang=cpp>
	Byte[] heart = [0,0,0,0,0,		Byte[] heart = [0,0,0,0,0,
Line 48:		Line 64:
	gLCD.WriteBitmap(0, 0, 5, 8, heart);		gLCD.WriteBitmap(0, 0, 5, 8, heart);
	</source>		</source>
			}}
	~~===~~Custom Characters~~===~~		{{UGC-Entry\|How to Write Custom Characters\|\|
	Custom characters are images associated with given unicode characters. A custom character can be any arrangement of pixels within the space allotted for a single character. Single characters are made up of pixels arranged in a grid with a size defined by ~~<code>~~setFontSize()~~</code>~~.		Custom characters are images associated with given unicode characters. A custom character can be any arrangement of pixels within the space allotted for a single character. Single characters are made up of pixels arranged in a grid with a size defined by {{Code\|setFontSize()}}.
			As with regular bitmaps for the Graphic LCD display, you can create a character bitmap by defining a byte array of ones and zeroes. Ones are colored in, and zeroes are empty. If you put a line break after each row, it will be easy to edit the bitmap.
	As with regular bitmaps for the Graphic LCD display, you can create a character bitmap by defining a byte array of ones and zeroes. Ones are colored in, and zeroes are empty. If you put a line break after each row, it~~'ll~~ be easy to edit the bitmap.

	In C#, this may look something like this:		In C#, this may look something like this:

	<source lang=cpp>		<source lang=cpp>

	Byte[] heart = [0,0,0,0,0,		Byte[] heart = [0,0,0,0,0,
	0,1,0,1,0,		0,1,0,1,0,
Line 71:		Line 84:
	</source>		</source>

	Once stored, characters can be recalled into a text string by using the unicode value for the location (in this example, ~~'''~~"\x6"~~'''~~). For example, in C#:		Once stored, characters can be recalled into a text string by using the unicode value for the location (in this example, "\x6"). For example, in C#:

	<source lang=cpp>		<source lang=cpp>
Line 77:		Line 90:
	</source>		</source>

	Custom characters on the LCD1100 are stored as images on the frame buffer ~~for their font~~.		Custom characters on the LCD1100 are stored as images on the frame buffer. {{Code\|FONT_User1}} is stored on frame buffer 1 and {{Code\|FONT_User2}} is on frame buffer 2.
	~~<code>~~FONT_User1~~</code>~~ is stored on frame buffer 1 and ~~<code>~~FONT_User2~~</code>~~ is on frame buffer 2.

	These characters occupy the same space as drawings on their framebuffer, and will be displayed onscreen if their framebuffer is flushed. They can also be overwritten by using drawing funcitons on their framebuffer, so it is recommended to only use a given framebuffer either for drawing or storing fonts, but not both.

	~~We recommend~~ using ~~<code>FONT_User2</code> (frame buffer 2)~~ to ~~store custom~~ fonts, ~~as it can be saved for later use~~.		These characters occupy the same space as drawings on the framebuffer, and will be displayed onscreen if the framebuffer is flushed. The characters can also be overwritten by using drawing functions on the framebuffer, so it is recommended to only use a given framebuffer either for drawing or storing fonts, but not both.

	In order to use the custom fonts, you must first define their size with ~~<code>~~setFontSize()~~</code>~~. Once the font size is set, custom characters will be placed on the font's frame buffer at a location corresponding to the character number provided.		We recommend using {{Code\|FONT_User2}} (frame buffer 2) to store custom fonts, as it can be saved for later use.
			In order to use the custom fonts, you must first define their size with {{Code\|setFontSize()}}. Once the font size is set, custom characters will be placed on the font's frame buffer at a location corresponding to the character number provided.

	Characters for each font are stored in rows ordered left-to-right, top-to-bottom.		Characters for each font are stored in rows ordered left-to-right, top-to-bottom. Rows are filled with as many characters as will completely fit across the width of the screen. There are as many rows as will fit on the screen vertically.
	Rows are filled with as many characters as will completely fit across the width
	of the screen. There are as many rows as will fit on the screen vertically.

	On a screen 128 pixels wide by 64 pixels high, if your font is 10 pixels wide by 20 high, you will have 3 rows of 12 characters. This allows for a maximum of 36 characters of that size.		On a screen 128 pixels wide by 64 pixels high, if your font is 10 pixels wide by 20 high, you will have 3 rows of 12 characters. This allows for a maximum of 36 characters of that size.
Line 94:		Line 103:
	[[image: LCD1100_CustomCharacterCount.png\|thumb\|center\|upright=2\|<center>A demonstration of how many 10x20px characters can fit on the screen.</center>]]		[[image: LCD1100_CustomCharacterCount.png\|thumb\|center\|upright=2\|<center>A demonstration of how many 10x20px characters can fit on the screen.</center>]]

	To quickly determine how many characters can be in your custom font, you can call		To quickly determine how many characters can be in your custom font, you can call getMaxCharacters() in your code.
	~~<code>~~getMaxCharacters()~~</code>~~ in your code.

	Custom character indexing starts with character 0x01 and can be any character between 0x01 and the maximum		Custom character indexing starts with character 0x01 and can be any character between 0x01 and the maximum number of characters that fit on screen.
	number of characters that fit on screen.

	To determine if an ascii character can be used in a given custom font, you can		To determine if an ascii character can be used in a given custom font, you can look at its corresponding ascii value on an [http://www.asciitable.com/%7C ascii table] to determine if it is within the limit determined above.
	look at its corresponding ascii value on an [http://www.asciitable.com/\| ascii table] to determine if it is within the limit determined above.		}}
	{{~~UGnext\|~~}}		{{UGC-End}}

Jdecoux at 16:40, 17 October 2019

2019-10-17T16:40:00Z

← Older revision		Revision as of 16:40, 17 October 2019
Line 24:		Line 24:
	{{ugAddressingInformation}}		{{ugAddressingInformation}}

	{{ugUsingYourOwnProgram\|~~This Phidget is compatible with the {{ExampleLink\|LCD}}.~~}}		{{ugUsingYourOwnProgram\|LCD1100}}

	==Technical Section==		==Technical Section==

Jdecoux: /* Using Your Own Program */

2018-08-28T16:56:53Z

Using Your Own Program

← Older revision		Revision as of 16:56, 28 August 2018
Line 24:		Line 24:
	{{ugAddressingInformation}}		{{ugAddressingInformation}}

	~~===Using Your Own Program===~~		{{ugUsingYourOwnProgram\|This Phidget is compatible with the {{ExampleLink\|LCD}}.}}

	~~You are now ready to start writing your own code for the device. The best way to do that is to start from our examples:~~

	This Phidget is compatible with the {{ExampleLink\|LCD}}.

	Once you have your example, you will need to follow the instructions on the page for your programming language to get it running. To find these instructions, select your programming language from the [[Software_Overview#Language_Support\|Software Overview]] page.

	==Technical Section==		==Technical Section==

Jdecoux at 22:49, 27 August 2018

2018-08-27T22:49:48Z

← Older revision		Revision as of 22:49, 27 August 2018
Line 1:		Line 1:
	__NOINDEX__		__NOINDEX__
			<metadesc>Control a 64x128-pixel LCD display from a VINT port with this graphic LCD Phidget.</metadesc>
	[[Category:UserGuide]]		[[Category:UserGuide]]
	~~__NOTOC__~~		==Getting Started==
	==~~=Required Hardware~~===		{{UGIntro\|LCD1100}}
			* [{{SERVER}}/products.php?product_id=LCD1100 LCD1100 - Graphic LCD Phidget]
			* {{VINTHub}}
			* {{CT\|PhidgetCable\|Phidget cable}}
			* USB cable and computer

	* An [{{SERVER}}/products.php?product_id=LCD1100 LCD1100 Graphic LCD Phidget]
	* A 3-wire Phidget cable
	* A {{VINTHub}}
	* A USB cable
	* A computer

	~~===Connecting the Pieces===~~

	~~[[Image:LCD1100_Functional.jpeg\|300px\|right\|link=]]~~

			Next, you will need to connect the pieces:[[Image:LCD1100_Functional.jpeg\|500px\|right\|link=]]
	# Connect the LCD1100 to the VINT Hub using the Phidget cable.		# Connect the LCD1100 to the VINT Hub using the Phidget cable.
	# Connect the VINT Hub to your computer with a USB cable.		# Connect the VINT Hub to your computer with a USB cable.

Jdecoux at 18:39, 27 August 2018

2018-08-27T18:39:29Z

← Older revision		Revision as of 18:39, 27 August 2018
Line 19:		Line 19:
	<br clear="all">		<br clear="all">

	==~~Testing~~ Using ~~Windows~~==		==Using the LCD1000==

	{{UGcontrolpanel\|LCD1100}}		{{UGcontrolpanel\|LCD1100}}

Jdecoux at 18:26, 27 August 2018

2018-08-27T18:26:23Z

← Older revision		Revision as of 18:26, 27 August 2018
Line 25:		Line 25:
	{{ugGraphicLCD}}		{{ugGraphicLCD}}

	{{~~UGotheros~~}}		{{ugAddressingInformation}}

			===Using Your Own Program===

			You are now ready to start writing your own code for the device. The best way to do that is to start from our examples:

			This Phidget is compatible with the {{ExampleLink\|LCD}}.

			Once you have your example, you will need to follow the instructions on the page for your programming language to get it running. To find these instructions, select your programming language from the [[Software_Overview#Language_Support\|Software Overview]] page.

	==Technical Section==		==Technical Section==

Mparadis at 20:25, 8 May 2018

2018-05-08T20:25:32Z

← Older revision		Revision as of 20:25, 8 May 2018
Line 1:		Line 1:
			__NOINDEX__
	[[Category:UserGuide]]		[[Category:UserGuide]]
	__NOTOC__		__NOTOC__

Mparadis at 16:12, 16 February 2018

2018-02-16T16:12:56Z

← Older revision		Revision as of 16:12, 16 February 2018
Line 1:		Line 1:
	[[Category:UserGuide]]		[[Category:UserGuide]]
	__NOTOC__		__NOTOC__
	~~[[Image:LCD1100_Functional.jpeg\|300px\|right\|link=]]~~
	===Required Hardware===		===Required Hardware===

Line 11:		Line 10:

	===Connecting the Pieces===		===Connecting the Pieces===

			[[Image:LCD1100_Functional.jpeg\|300px\|right\|link=]]

	# Connect the LCD1100 to the VINT Hub using the Phidget cable.		# Connect the LCD1100 to the VINT Hub using the Phidget cable.