search.xml

{"entries":[{"title":404,"url":"/404.html","date":null,"categories":[],"body":""},{"title":"Categories","url":"/categories.html","date":null,"categories":[],"body":""},{"title":"Tags","url":"/tags.html","date":null,"categories":[],"body":""},{"title":"About Us","url":"/about.html","date":null,"categories":[],"body":"The MicroView is the first chip-sized Arduino compatible that lets you see what your Arduino is thinking using a built-in OLED display. You’ve never seen an Arduino™ compatible like this. With a built-in OLED (Organic Light Emitting Diode Display) you can see what your Arduino is thinking without having to connect it to your computer.  No more cryptic “Hello World” LED blink sequences or shoehorning oversized displays onto your tiny Arduino™. Development is much easier when you can see what’s going on."},{"title":"Archive","url":"/archive.html","date":null,"categories":[],"body":""},{"title":"Search","url":"/search.html","date":null,"categories":[],"body":""},{"title":null,"url":"/index.html","date":null,"categories":[],"body":""},{"title":"Getting Started with MicroView","url":"/intro/getting-started.html","date":"2014-05-04 00:00:00 +1000","categories":["intro"],"body":"In order to get your MicroView up and running, there are four easy steps to follow:  MicroView, like the Arduino, relies on a programmer to upload sketches (Arduino code) and also communicate with the computer. This programmer often has a USB to TTL converter chip that creates a Virtual Serial Port on the computer when properly installed.  MicroView’s factory USB Programmer uses the FTDI’s FT231X to send the sketches to MicroView and also act as a communication medium between MicroView and computer. Depending on the OS (Operating System) of your computer, the drivers are installed using different methods.  Below are the installation instructions prepared by SparkFun Electronics: Once you have finished the FTDI Drivers installation, you will need to prepare the MicroView to be inserted into the computer’s USB port. If you have purchased the factory USB Programmer, just insert the MicroView into the USB Programmer following the photo below.  Please take note that at the back of MicroView, there is a round dot marking showing the Pin 1 of the MicroView where you need to match the Pin 1 of the USB Programmer.  Once you have inserted the MicroView into the USB Programmer, you can now insert the USB Programmer into the USB port of the computer as below.  If your computer does not have a right-sided USB port, please use a USB Cable Extension to extend the USB port to the front so that you can easily work with the MicroView.  If you have not purchase the factory USB Programmer and have FTDI Basic Breakout -5V or FTDI Cable 5V lying around, they can also be used as a MicroView programmer. Connect the FTDI Basic Breakout board as below, and you are ready to go.  You have now successfully prepared the MicroView for programming. There are currently two options when selecting the Arduino Sofware (IDE). The first option is to use the cloud based Codebender and the second option is to use Arduino IDE. As our Learning Kit's tutorials are based on Codebender, and Codebender has already included MicroView's library in their cloud solution, we highly recommend users to use Codebender for our tutorials. Installing Codebender is really simple, the prerequisite is just Chrome or Firefox browser.  Using Chrome or Firefox, browse to Codebender’s Getting Started page and then follow the steps below (shown using Firefox browser).  Click Let's Go!  Click Add to Firefox.  Click Allow when you see the message “Firefox prevented this site (codebender.cc) from asking you to install software on your computer.”  Wait for the Add-on downloading to finish.  Click Install Now  Click Restart Now when you see the message “Codebender.cc Plugin will be installed after you restart Firefox.” You have now successfully installed Codebender on your browser. Please proceed to STEP 4 – Write Your First Sketch Installing Arduino IDE is normally straight forward, however it is still a bit challenging if one has never try before.  Luckily our partner SparkFun have already published step by step guides on: After installation of the Arduino IDE has completed, unlike Codebender, you will still need to install MicroView's library. Download MicroView’s library from our github repo below: MicroView Library Github Repo Save the ZIP file to your download folder then unzip the ZIP file. Rename the folder name from MicroView-Arduino-Library-master to MicroView.  Execute Arduino IDE, click Sketch, Import Library and then Add Library.  Browse to the MicroView folder that was renamed and select that folder.  MicroView library will be automatically installed. Click File, Example, and find MicroView Example to confirm the installation.  Well done! You are now ready to try our other tutorials. Install drivers. Prepare MicroView for programming Choose Arduino software Write your first sketch How to Install FTDI Drivers for Windows How to Install FTDI Drivers for Linux How to Intall FTDI Drivers for Mac Installing Arduino IDE for Windows Installing Arduino IDE for Mac Installing Arduino IDE for Linux #include <MicroView.h>   void setup() {   uView.begin();   uView.clear(PAGE);   uView.print(\"HelloWorld\");   uView.display(); }   void loop () { } "},{"title":"General Overview of MicroView","url":"/intro/general-overview-of-microview.html","date":"2014-06-04 00:00:00 +1000","categories":["intro"],"body":" The MicroView is the first chip-sized Arduino compatible that lets you see what your Arduino is thinking by using a built-in OLED display. In the heart of MicroView there is an ATMEL’s ATmega328P, 5V & 3.3V LDO and a 64x48 pixel OLED display, together with other passive components that allow the MicroView to operate without any external components other than a power supply. MicroView is 100% code compatible with Arduino Uno (ATmega328P version), meaning the code that runs on an Arduino Uno will also be able to run on the MicroView if the IO pins used in the code are externally exposed on the MicroView.  The SSD1306 is the controller built into the MicroView’s OLED display. It has flexible yet complex segment and common drivers. One requires vast knowledge on memory addressing in order to use the SSD1306 controller. MicroView’s library was written to hide away the complexities of the SSD1306 controller, so that users can issue simple commands to control the display. Although the SSD1306 has a built-in RAM (memory) for the screen, when connected using the SPI method, the ATmega328P is not able to read the RAM (memory) of the SSD1306. Therefore the software will not be able to manipulate the screen buffer to perform mathematical operations. MicroView’s library overcomes this by allocating 384 bytes ( (64 x 48)/8 bits) of memory from ATmega328P as buffer. The library can now manipulate the screen buffer and then perform a bulk transfer from the ATmega328P’s memory to the internal memory of the SSD1306 controller. The 384 bytes of screen buffer are declared in MicroView’s library as and are arranged in a linear form representing the following 64 x 48 pixels coordinate system.  Based on the above illustration, for example, if a user wish to plot a pixel at the position of the black dot, where X=10 and Y=2, the would user issue the following command: This command will then calculate the exact location of the screen buffer and set a BIT in the corresponding BYTE to the X,Y position. Diagram showing how a linear screen buffer in the ATmega328P aligns with the OLED pixels. Diagram showing the BITs in a BYTE of the screen buffer corresponding to the OLED’s X,Y position. Based on the above illustration, a pixel turned on at X=2 and Y=3 means BYTE 2 of the screen buffer has data of 0x08 (hex).  Two pixels at X=2,Y=3 and X=2,Y=2 turned on means BYTE 2 of the screen buffer has data of 0x0c (hex). To draw a straight line of 5 pixels starting from 10,2 to 10,6 , the following C code show a pixel by pixel way on how to accomplish this: the MicroView library allows you to draw lines by specifying the the start and end coordinates. The above line could be drawn with this simple one line command: In order for the library to perform extremely fast mathematical operations on the screen buffer (more than 100 frames per second), calls to the drawing functions within the MicroView library does not immediately transfer the contents of screen buffer to the SSD1306 controller. A display() command is required to instruct the library to perform the bulk transfer from the screen buffer to the SSD1306 controller: This function takes the whole screen buffer in the ATmega328P and transfers it (via SPI bus, programmed at 8Mhz) to the internal memory of the SSD1306. As soon as the memory is being transferred, the pixels corresponding to the screen buffer will show up on the OLED display. Display : 64x48 OLED Display Microcontroller : ATmega328P  Operating Voltage : 5V Input Voltage : 3.3VDC - 16VDC Digital I/O Pins : 12 (of which 3 provide PWM output) Analog Input Pins : 6 Flash Memory : 32 KB SRAM : 2 KB EEPROM : 1 Kilobyte Clock Speed : 16 Mhz No other components required static uint8_t screenmemory [] = {.total 384 bytes of data..};  uView.pixel(10,2);  uView.pixel(10,2); uView.pixel(10,3); uView.pixel(10,4); uView.pixel(10,5); uView.pixel(10,6);  uView.line(10,2,10,6);  uView.display(); "},{"title":"Creating Fonts for MicroView","url":"/font/creating-fonts-for-microview.html","date":"2014-06-11 00:00:00 +1000","categories":["font"],"body":"From the previous article General Overview of MicroView, we have covered how the MicroView library allocated 384 bytes of RAM as screen buffer from ATmega328P to perform graphic operations before transferring this block of memory to the SSD1306 OLED controller’s memory. The following diagram shows how two 5x8 pixel characters are drawn on the screen buffer.  From the diagram, “O” character appeared on ROW0 took up 5 bytes of RAM from the screen buffer in the following order: Character “A” that was shown on ROW1 took up 5 bytes of RAM from the screen buffer in the following order: A 8x16 font will take up 16 bytes of RAM from the screen buffer as shown in the next diagram:  With 8x16 font taking up RAM from screen buffer’s ROW0 and ROW1, the data of the above diagram will occupy the screen buffer’s BYTE0 – BYTE7 and BYTE64 – BYTE71. Manually plotting fonts and text is very tedious! It's much easier to use the font printing functions within the MicroView library. Displaying text in MicroView is as simple as: Although MicroView’s library includes 4 different types of font, these fonts might not suit every user’s need.  By following these steps you can make your own fonts and include them within the MicroView library: Once we understand how a character is being mapped to the MicroView’s screen buffer, we can choose to manually draw the font we like to the screen buffer or we can use a converter to convert computer’s font to bitmap and then convert the bitmap into C char definition used by the MicroView library. We have had good results using Codehead’s Bitmap Font Generator to convert a font into a bitmap. If you have had success in using other tools, please let us know and we’ll update this article.  Let’s quickly run through a few simple steps to convert a Computer’s font into a bitmap. Assuming we need the numbers 0 to 9 of the Courier font in 12x24 pixels, the following steps will generate the required bitmap:  From the generated result, it is clear that there is too much space on the left of the numbers and the glyphs are not taking full advantage of the 12x48 cells. Let’s further enhance the effect of the font: After the adjustment, we should see the following result:  This result is almost perfect except there is still empty space on the right of the 9 glyph, and at the bottom of all the numbers. We can’t correct this space further because Codehead Font Generator does not allow for a custom image size, so we will correct this with an image editor later. Click File, then Export Bitmap (BMP), save the file as 12x24Font.bmp Using an image editor like Photoshop or GIMP, open the 12x24Font.bmp file, then make a selection to crop a 120 x 24 frame from the image.  If you want a WHITE text on BLACK background, you will need to INVERT the color now.  Save the image and then proceed to next step. You can also save the hassle by downloading the 12x24Font.bmp already prepared by us. You have now successfully created a customised bitmap font. In order to convert the font from bitmap to C char definition, we will be using LCD Assistant for this job. Run LCD Assistant and load the 12x24Font.bmp file previously saved.  Make sure that following options are correct: Once all the options are correctly selected, click File, then save the output and type in the filename as 12x24Font.h Using a text file editor, open 12x24Font.h Locate and replace with Then replace with You should get the following result: You have now successfully converted the bitmap font to a C header file. Move the edited 12x24Font.h file to MicroView’s library folder. You should be able to see the 12x24Font.h in the same folder as the rest of the MicroView’s files.  Using a text file editor, open MicroView.cpp and perform the following steps: Locate Add after this line Locate Change to  Locate Change to The font that we have just added is at the 7th position starting from position 0 (font5x7) in the MicroView::fontsPointer array, therefore the new font is now fontType 7. Save MicroView.cpp once you have made your changes. Run the following sketch to test your new font: You have now successfully hacked MicroView's library to add your own custom font. Convert fonts to bitmap. Generate font source file from bitmap. Add font source file to MicroView library. Select “Courier” from the Font Details drop down combo box. Enter 48 as the Cell Height Enter 12 as the Cell Width Enter 128 x 32 as the Image Size (this Image Size need to be larger than 12x24x10(number of characters)) Enter 48 as the Start Character ( 48 ASCII code is the number 0) Enter 200% as the Zoom Enter or slowly increase Font Height to a suitable value, in this case, 26 Adjust the Position (X,Y) using the arrow button with option “Adjust All” selected (in this case, X=-4, Y=-1) Picture preview is the right bitmap Byte orientation has Vertical selected Width is 120 and Height is 24 Include size not selected Size endianness has Little selected Pixels/byte is 8 Table name is 12x14Font (can be any name) BYTE0 = 0x7e BYTE1 = 0x81 BYTE2 = 0x81 BYTE3 = 0x81 BYTE4 = 0x7e  BYTE64 = 0xfc BYTE65 = 0x22 BYTE66 = 0x21 BYTE67 = 0x22 BYTE68 = 0xfc  BYTE0 = 0xf8 BYTE1 = 0xfc BYTE2 = 0x06 BYTE3 = 0x03 BYTE4 = 0x03 BYTE5 = 0x06 BYTE6 = 0xfc BYTE7 = 0xf8 BYTE64 = 0xff BYTE65 = 0xff BYTE66 = 0x06 BYTE67 = 0x06 BYTE68 = 0x06 BYTE69 = 0x06 BYTE70 = 0xff BYTE71 = 0xff  uView.print(\"Hello\");  const unsigned char 12x24Font [] = {  #ifndef FONT12X24_H #define FONT12X24_H #include <avr/pgmspace.h> static const unsigned char font12x24 [] PROGMEM = { // first row defines - FONTWIDTH, FONTHEIGHT, ASCII START CHAR, TOTAL CHARACTERS, FONT MAP WIDTH HIGH, FONT MAP WIDTH LOW (2,56 meaning 256)     12,24,48,10,1,20,  };  }; #endif  //------------------------------------------------------------------------------ // File generated by LCD Assistant // http://en.radzio.dxp.pl/bitmap_converter/ //------------------------------------------------------------------------------  #ifndef FONT12X24_H #define FONT12X24_H #include <avr/pgmspace.h> static const unsigned char font12x24 [] PROGMEM = {     // first row defines - FONTWIDTH, FONTHEIGHT, ASCII START CHAR, TOTAL CHARACTERS, FONT MAP WIDTH HIGH, FONT MAP WIDTH LOW (2,56 meaning 256)     12,24,48,10,1,20,        0x1F, 0x1F, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0x1F, 0x1F, 0xFF, 0xFF, 0x9F, 0x9F, 0x9F, 0x9F,     0x07, 0x07, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x9F, 0x9F, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7,     0x1F, 0x1F, 0xFF, 0xFF, 0x9F, 0x9F, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0x1F, 0x1F, 0xFF, 0xFF,     0xFF, 0xFF, 0xFF, 0xFF, 0x1F, 0x1F, 0x07, 0x07, 0xFF, 0xFF, 0xFF, 0xFF, 0x07, 0x07, 0xE7, 0xE7,     0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xFF, 0xFF, 0x7F, 0x7F, 0x9F, 0x9F, 0xE7, 0xE7, 0xE7, 0xE7,     0xFF, 0xFF, 0xFF, 0xFF, 0x87, 0x87, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0x07, 0x07, 0xFF, 0xFF,     0x1F, 0x1F, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0x1F, 0x1F, 0xFF, 0xFF, 0x1F, 0x1F, 0xE7, 0xE7,     0xE7, 0xE7, 0xE7, 0xE7, 0x1F, 0x1F, 0xFF, 0xFF, 0x00, 0x00, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF,     0x00, 0x00, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0x00, 0x00, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF,     0xFF, 0xFF, 0x7F, 0x7F, 0x9F, 0x9F, 0xE7, 0xE7, 0xF8, 0xF8, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF,     0xE7, 0xE7, 0xE7, 0xE7, 0x18, 0x18, 0xFF, 0xFF, 0x1F, 0x1F, 0x61, 0x61, 0x7E, 0x7E, 0x00, 0x00,     0x7F, 0x7F, 0xFF, 0xFF, 0xE0, 0xE0, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0x1F, 0x1F, 0xFF, 0xFF,     0x00, 0x00, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0x1F, 0x1F, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF,     0x1F, 0x1F, 0xE1, 0xE1, 0xFE, 0xFE, 0xFF, 0xFF, 0x18, 0x18, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7,     0x18, 0x18, 0xFF, 0xFF, 0xF8, 0xF8, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0x00, 0x00, 0xFF, 0xFF,     0xF8, 0xF8, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xF8, 0xF8, 0xFF, 0xFF, 0xE7, 0xE7, 0xE7, 0xE7,     0xE0, 0xE0, 0xE7, 0xE7, 0xE7, 0xE7, 0xFF, 0xFF, 0xE1, 0xE1, 0xE6, 0xE6, 0xE7, 0xE7, 0xE7, 0xE7,     0xE7, 0xE7, 0xFF, 0xFF, 0xF9, 0xF9, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xF8, 0xF8, 0xFF, 0xFF,     0xFE, 0xFE, 0xFE, 0xFE, 0xE6, 0xE6, 0xE0, 0xE0, 0xE6, 0xE6, 0xFF, 0xFF, 0xF9, 0xF9, 0xE7, 0xE7,     0xE7, 0xE7, 0xE7, 0xE7, 0xF8, 0xF8, 0xFF, 0xFF, 0xF8, 0xF8, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7,     0xF8, 0xF8, 0xFF, 0xFF, 0xFF, 0xFF, 0xE1, 0xE1, 0xFE, 0xFE, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF, 0xFF,     0xF8, 0xF8, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xE7, 0xF8, 0xF8, 0xFF, 0xFF, 0xFF, 0xFF, 0xE7, 0xE7,     0xE7, 0xE7, 0xF9, 0xF9, 0xFE, 0xFE, 0xFF, 0xFF,  }; #endif  // Add header of the fonts here.  Remove as many as possible to conserve FLASH memory.  #include <12x24Font.h>  // Change the total fonts included #define TOTALFONTS      7  // Change the total fonts included #define TOTALFONTS      8  const unsigned char *MicroView::fontsPointer[]={     font5x7     ,font8x16     ,sevensegment     ,fontlargenumber     ,space01     ,space02     ,space03 };  const unsigned char *MicroView::fontsPointer[]={     font5x7     ,font8x16     ,sevensegment     ,fontlargenumber     ,space01     ,space02     ,space03     ,font12x24 };  #include <MicroView.h>  void setup() {   uView.begin();   uView.clear(PAGE);   uView.setFontType(7);   uView.print(\"1234\");   uView.display(); }  void loop () { } "}]}