{"id":37938,"date":"2020-11-05T17:15:13","date_gmt":"2020-11-05T09:15:13","guid":{"rendered":"\/blog\/?p=37938"},"modified":"2021-06-10T14:54:29","modified_gmt":"2021-06-10T06:54:29","slug":"dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m","status":"publish","type":"post","link":"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/","title":{"rendered":"Don\u2019t Have an HDMI Display For Your Raspberry Pi? Wio Terminal LCD Got You Covered With a USB HMI!"},"content":{"rendered":"\n<figure class=\"wp-block-image size-large\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1030\" height=\"579\" src=\"https:\/\/blog.seeedstudio.com\/wp-content\/uploads\/2020\/11\/thumb-1030x579.jpg\" alt=\"\" class=\"wp-image-38000\" srcset=\"https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb-1030x579.jpg 1030w, https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb-300x169.jpg 300w, https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb-768x432.jpg 768w, https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb-1024x576.jpg 1024w, https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg 1200w\" sizes=\"(max-width: 1030px) 100vw, 1030px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Introduction<\/h2>\n\n\n\n<p>When you get your hands on a <a rel=\"noreferrer noopener\" aria-label=\"Raspberry Pi (opens in a new tab)\" href=\"https:\/\/www.seeedstudio.com\/Raspberry-Pi-4-Computer-Model-B-4GB-p-4077.html\" target=\"_blank\">Raspberry Pi<\/a> for the very first time, you might want to know how to actually log in to the Raspberry Pi so that you can start interacting with it. In my previous blog, I have already talked about a couple of methods of logging into a Raspberry Pi such as <a rel=\"noreferrer noopener\" aria-label=\"using a CP2102 USB to Serial Converter (opens in a new tab)\" href=\"https:\/\/www.seeedstudio.com\/blog\/2020\/07\/08\/how-to-use-a-cp2102-usb-to-serial-converter-to-log-in-to-your-raspberry-pi-m\/\" target=\"_blank\">using a CP2102 USB to Serial Converter<\/a> and <a rel=\"noreferrer noopener\" aria-label=\"using a Seeeduino XIAO (opens in a new tab)\" href=\"https:\/\/www.seeedstudio.com\/blog\/2020\/06\/05\/a-new-way-to-log-in-to-your-raspberry-pi-no-usb-to-serial-cable-required-m\/\" target=\"_blank\">using a Seeeduino XIAO<\/a>. <\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><a href=\"https:\/\/www.seeedstudio.com\/Raspberry-Pi-4-Computer-Model-B-4GB-p-4077.html\" target=\"_blank\" rel=\"noreferrer noopener\"><img decoding=\"async\" src=\"https:\/\/blog.seeedstudio.com\/wp-content\/uploads\/2020\/06\/15909869951.png\" alt=\"\" width=\"375\" height=\"276\"\/><\/a><\/figure><\/div>\n\n\n\n<p>However, in both the methods, we logged into the Raspberry Pi via a command-line interface. We could interact with the Raspberry Pi through <a href=\"https:\/\/www.seeedstudio.com\/blog\/2020\/06\/11\/28-raspberry-pi-linux-commands-a-quick-guide-to-use-the-command-line-for-raspberry-pi-m\/\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"Linux commands (opens in a new tab)\">Linux commands<\/a>, but there was no actual GUI (Graphical User Interface). The only way to interact with a Raspberry Pi via a GUI is by connecting it to an external display via the HDMI connection. <\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img decoding=\"async\" src=\"https:\/\/blog.seeedstudio.com\/wp-content\/uploads\/2020\/06\/connection-latest-768x538.png\" alt=\"\" width=\"570\" height=\"399\"\/><\/figure><\/div>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Wio Terminal LCD as Raspberry Pi GUI!<\/strong><\/h2>\n\n\n\n<p>Now I would like to explain a whole new approach to accessing the GUI on the Raspberry Pi without connecting to an external display, and that is by using a <a href=\"https:\/\/www.seeedstudio.com\/Wio-Terminal-p-4509.html\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"Wio Terminal (opens in a new tab)\">Wio Terminal<\/a>. <\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><a href=\"https:\/\/www.seeedstudio.com\/Wio-Terminal-p-4509.html\" target=\"_blank\" rel=\"noreferrer noopener\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/blog.seeedstudio.com\/wp-content\/uploads\/2020\/10\/wt-new-768x576.png\" alt=\"\" width=\"503\" height=\"376\"\/><\/a><\/figure><\/div>\n\n\n\n<p>Wio Terminal is an ATSAMD51-based microcontroller with wireless connectivity supported by Realtek RTL8720DN and is equipped with a 2.4\u201d LCD Screen, onboard accelerometer (LIS3DHTR), Microphone, Buzzer, micro-SD card slot, Light sensor, and Infrared Emitter(IR 940nm). It is also compatible with both Arduino and MicroPython. <\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/files.seeedstudio.com\/wiki\/Wio-Terminanl-HMI\/Wio-Terminal-HMI.gif\" alt=\"\" width=\"703\" height=\"396\"\/><\/figure><\/div>\n\n\n\n<p>We could use the LCD on the Wio Terminal to display the Raspberry GUI just by connecting it to one of the USB ports on the Raspberry Pi. This becomes the Wio Terminal LCD, an HMI (Human Machine Interface) USB display for the Raspberry Pi. Furthermore, if you have more than one Wio Terminal, you could connect up to 4 Wio Terminals in total at the same time to the 4 USB ports available on the Raspberry Pi and set them to work in different modes such as Extend mode\/ Mirror Mode. I will discuss this later in this blog. I also want to mention that this method not only works for Raspberry Pi, but also works for Nvidia Jetson Nano, BeagleBone, and Odyssey X86J4105 as well!<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Wio Terminal Setup<\/strong><\/h2>\n\n\n\n<p>Now, let\u2019s dive into actually making the HMI display on the Wio Terminal to work! I will guide you through how to set up the Wio Terminal for the process.<\/p>\n\n\n\n<p>If this is the first time you are using the Wio Terminal, it is better if you visit <a href=\"https:\/\/wiki.seeedstudio.com\/Wio-Terminal-Getting-Started\/#getting-started\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"this page (opens in a new tab)\">this page<\/a> and do the initial setup for the Wio Terminal. After doing so, you can continue to the steps below. <\/p>\n\n\n\n<p>You need to upload an Arduino program to your Wio Terminal and there are 2 methods of doing this. <\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Method 1 \u2013 Arduino IDE upload method<\/strong><\/h3>\n\n\n\n<p><strong>Step 1<\/strong>:<br>Visit the Seeed_Arduino_USBDISP library repo <a rel=\"noreferrer noopener\" aria-label=\"here (opens in a new tab)\" href=\"https:\/\/github.com\/Seeed-Studio\/Seeed_Arduino_USBDISP\" target=\"_blank\">here<\/a>.<\/p>\n\n\n\n<p><strong>Step 2<\/strong>:<br>Go to \u201ccode\u201d and select \u201cDownload ZIP\u201d <\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/blog.seeedstudio.com\/wp-content\/uploads\/2020\/11\/16045571061-1030x433.png\" alt=\"\" class=\"wp-image-37947\" width=\"734\" height=\"307\"\/><\/figure><\/div>\n\n\n\n<p><strong>Step 3<\/strong>:<br>Open Arduino IDE, go to \u201cSketch &gt; Include Library &gt; Add .ZIP Library\u201d and select the .zip file you just downloaded<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/blog.seeedstudio.com\/wp-content\/uploads\/2020\/11\/16045571901.png\" alt=\"\" class=\"wp-image-37949\" width=\"709\" height=\"238\" srcset=\"https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/16045571901.png 737w, https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/16045571901-300x101.png 300w\" sizes=\"(max-width: 709px) 100vw, 709px\" \/><\/figure><\/div>\n\n\n\n<p><strong>Step 4<\/strong>:<br>Go to \u201cFile &gt; Examples &gt; Seeed_Arduino_USBDISP\u201d and select the example you prefer out of the two. <\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>If you want a higher screen refresh rate on Wio Terminal, upload <strong>NullFunctional<\/strong> example to Wio Terminal.<\/li><li>If you want Wio Terminal to also act as a USB Mouse, upload <strong>USBDisplayAndMouseControl<\/strong> example to Wio Terminal. Here you can use the 5-way switch and the 3 buttons on the WIo Terminal to act as a mouse.<\/li><\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Method 2 \u2013 flash uf2 method <\/strong><\/h3>\n\n\n\n<p>There is a more convenient method and that is flashing the uf2 firmware files including the examples to the Wio Terminal.<\/p>\n\n\n\n<p><strong>Step 1:<\/strong><br>Download the uf2 files of: <\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><a rel=\"noreferrer noopener\" aria-label=\"NullFunctional (opens in a new tab)\" href=\"http:\/\/files.seeedstudio.com\/wiki\/Wio-Terminanl-HMI\/NullFunctional.uf2\" target=\"_blank\">NullFunctional<\/a> example<\/li><li><a rel=\"noreferrer noopener\" aria-label=\"USBDisplayAndMouseControl (opens in a new tab)\" href=\"https:\/\/files.seeedstudio.com\/wiki\/Wio-Terminanl-HMI\/USBDisplayAndMouseControl.uf2\" target=\"_blank\">USBDisplayAndMouseControl<\/a> example<\/li><\/ul>\n\n\n\n<p><strong>Step 2:<\/strong><br>Enter bootloader mode on the Wio Terminal by sliding the power switch twice quickly.  <\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/files.seeedstudio.com\/wiki\/Wio-Terminal\/img\/Wio-Terminal-Bootloader.png\" alt=\"\" width=\"483\" height=\"232\"\/><\/figure><\/div>\n\n\n\n<p><strong>Step 3:<\/strong><br>An external drive named Arduino should appear on your PC. Drag the downloaded uf2 files to the Arduino drive. <\/p>\n\n\n\n<p>Now the Wio Terminal is all set up. It\u2019s time to set up the Raspberry Pi as well. <\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Raspberry Pi Setup<\/h2>\n\n\n\n<p>If this is the first time you are using the Raspberry Pi, it is better if you visit <a rel=\"noreferrer noopener\" aria-label=\"this page (opens in a new tab)\" href=\"https:\/\/wiki.seeedstudio.com\/Raspberry_Pi_3_Model_B\/\" target=\"_blank\">this page<\/a> and do the initial setup for the Raspberry Pi. After doing so, you can continue to the steps below.<\/p>\n\n\n\n<p><strong>Step 1:<\/strong><br>After you have configured Putty or any other SSH client to log in to the Raspberry Pi, open the command line interface inside the Raspberry Pi.  <\/p>\n\n\n\n<p><strong>Step 2:<\/strong><br>Download\u00a0package\u00a0information\u00a0from\u00a0all\u00a0configured\u00a0sources, by running the following command  <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo apt-get update<\/code><\/pre>\n\n\n\n<p><strong>Step 3:<\/strong><br>Install\u00a0the\u00a0necessary\u00a0packages\u00a0such\u00a0as\u00a0<strong>kernel\u00a0headers,\u00a0kernels,\u00a0build-essential,\u00a0dkms<\/strong>\u00a0by\u00a0running\u00a0the\u00a0following\u00a0command\u00a0in\u00a0terminal: <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo apt-get install raspberrypi-kernel-headers raspberrypi-kernel build-essential dkms<\/code><\/pre>\n\n\n\n<p><strong>Step 4:<\/strong><br>Download the display driver on Raspberry Pi <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>cd ~\ngit clone https:\/\/github.com\/Seeed-Studio\/seeed-linux-usbdisp<\/code><\/pre>\n\n\n\n<p><strong>Step 5:<\/strong><br>Make and build the driver <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>cd ~\/seeed-linux-usbdisp\/drivers\/linux-driver\nmake &amp; sudo make install\nsudo reboot<\/code><\/pre>\n\n\n\n<p><strong>Step 6:<\/strong><br>Move the config files to the system location <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo cp ~\/seeed-linux-usbdisp\/drivers\/linux-driver\/xserver_conf\/10-disp.conf \/usr\/share\/X11\/xorg.conf.d\/<\/code><\/pre>\n\n\n\n<p class=\"has-background has-very-light-gray-background-color\"><strong>Note:<\/strong><br><em>There are different screen configurations that you can choose from, the default is one Wio Terminal as one screen.<\/em><\/p>\n\n\n\n<p><strong>Step 7:<\/strong><br>Restart the service <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo service lightdm restart<\/code><\/pre>\n\n\n\n<p><strong>Step 8:<\/strong><br>Connect the Wio Terminal to Raspberry Pi&#8217;s USB port and the Raspberry Pi Desktop GUI will magically appear on the Wio Terminal LCD! <\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/files.seeedstudio.com\/wiki\/Wio-Terminanl-HMI\/display-new.png\" alt=\"\" width=\"360\" height=\"441\"\/><\/figure><\/div>\n\n\n\n<p><strong>Note:<\/strong> If nothing shows on the display, please follow the steps below<\/p>\n\n\n\n<p> Run&nbsp;the&nbsp;following&nbsp;command&nbsp;in&nbsp;terminal: <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo raspi-config<\/code><\/pre>\n\n\n\n<p>Once&nbsp;the&nbsp;Raspberry&nbsp;Pi&nbsp;Software&nbsp;Configuration&nbsp;Tool&nbsp;opens,&nbsp;navigate&nbsp;to&nbsp;the following&nbsp;location <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>Display Options > Resolution<\/code><\/pre>\n\n\n\n<p> Select&nbsp;a&nbsp;different&nbsp;resolution&nbsp;except&nbsp;&#8220;default&#8221; <\/p>\n\n\n\n<p class=\"has-background has-very-light-gray-background-color\"><strong>Note:<\/strong><br><em>This version of the USB display driver does not support hot swapping <\/em><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">How about Jetson Nano, Beaglebone, and Odyssey X86?<\/h2>\n\n\n\n<p>I will also walk you through how to setup <a rel=\"noreferrer noopener\" aria-label=\"NVIDIA Jetson Nano (opens in a new tab)\" href=\"https:\/\/www.seeedstudio.com\/NVIDIA-Jetson-Nano-Development-Kit-B01-p-4437.html\" target=\"_blank\">NVIDIA Jetson Nano<\/a>, <a rel=\"noreferrer noopener\" aria-label=\"Beaglebone (opens in a new tab)\" href=\"https:\/\/www.seeedstudio.com\/beaglebone-c-954.html\" target=\"_blank\">Beaglebone<\/a> and <a rel=\"noreferrer noopener\" aria-label=\"Odyssey X86 (opens in a new tab)\" href=\"https:\/\/www.seeedstudio.com\/ODYSSEY-X86J4105864-p-4447.html\" target=\"_blank\">Odyssey X86<\/a> so that the Wio Terminal can act as a display for them!<\/p>\n\n\n\n<p><strong>Step 1<\/strong>:<br>For Nvidia Jetson Nano and Odyssey X86J4105 (Ubuntu), install the Linux driver as followed, run the following in the terminal: <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo apt install --reinstall linux-headers-$(uname -r)<\/code><\/pre>\n\n\n\n<p class=\"has-background has-very-light-gray-background-color\"><strong>Note: <\/strong><br><em>For Odyssey X86J4105, we have only tested for ubuntu and debian OS. Other Linux OS may not work.<\/em><\/p>\n\n\n\n<p><strong>Step 2<\/strong>:<br>Download the display driver <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>cd ~\ngit clone https:\/\/github.com\/Seeed-Studio\/seeed-linux-usbdisp<\/code><\/pre>\n\n\n\n<p><strong>Step 3<\/strong>:<br>Make and build the driver <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>cd ~\/seeed-linux-usbdisp\/drivers\/linux-driver\nmake &amp; sudo make install\nsudo reboot<\/code><\/pre>\n\n\n\n<p><strong>Step 4<\/strong>:<br>Move the config files to the system location  <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo cp ~\/seeed-linux-usbdisp\/drivers\/linux-driver\/xserver_conf\/10-disp.conf \/usr\/share\/X11\/xorg.conf.d\/<\/code><\/pre>\n\n\n\n<p><strong>Step 5<\/strong>:<br>Restart the service <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo service lightdm restart<\/code><\/pre>\n\n\n\n<p><strong>Step 6<\/strong>:<br>Connect the Wio Terminal to Jetson Nano, Beaglebone, or Odyssey X86 and you will see the respective GUI displayed on the Wio Terminal LCD! <\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Got more Wio Terminals? Let\u2019s utilize them all for displays!<\/strong><\/h2>\n\n\n\n<p>If you have multiple Wio Terminals, you could use them to\ndisplay content with different working modes. For example, when a Raspberry pi\nis used and if you have 4 Wio Terminals, you could connect all 4 Wio Terminals to\nthe 4 USB ports on the Raspberry Pi and configure the Wio Terminals to display\nthe content in 4 different configurations.<\/p>\n\n\n\n<p>You can do simply do this by editing the 10-disp.conf file.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Setup 1<\/h3>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/files.seeedstudio.com\/wiki\/Wio-Terminanl-HMI\/display-1-removebg.png\" alt=\"\" width=\"737\" height=\"413\"\/><\/figure><\/div>\n\n\n\n<pre class=\"wp-block-code\"><code># Four-screen expansion\n# pattern: 1  2  \n#        : 3  4<\/code><\/pre>\n\n\n\n<p>This is the 10-disp-1.conf under seeed-linux-usbdisp\/drivers\/linux-driver\/xserver_conf\/, simply copy this file to \/usr\/share\/X11\/xorg.conf.d\/ and name it 10-disp.conf:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo cp ~\/seeed-linux-usbdisp\/drivers\/linux-driver\/xserver_conf\/10-disp-1.conf \/usr\/share\/X11\/xorg.conf.d\/10-disp.conf<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Setup 2<\/h3>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/files.seeedstudio.com\/wiki\/Wio-Terminanl-HMI\/display-2-removebg.png\" alt=\"\" width=\"695\" height=\"389\"\/><\/figure><\/div>\n\n\n\n<pre class=\"wp-block-code\"><code># Four-screen expansion\n# pattern: 1\n#        : 2  3  4<\/code><\/pre>\n\n\n\n<p>This is the 10-disp-2.conf under seeed-linux-usbdisp\/drivers\/linux-driver\/xserver_conf\/. simply copy this file to \/usr\/share\/X11\/xorg.conf.d\/ and name it 10-disp.conf:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo cp ~\/seeed-linux-usbdisp\/drivers\/linux-driver\/xserver_conf\/10-disp-2.conf \/usr\/share\/X11\/xorg.conf.d\/10-disp.conf<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Setup 3<\/h3>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/files.seeedstudio.com\/wiki\/Wio-Terminanl-HMI\/display-3-removebg.png\" alt=\"\" width=\"845\" height=\"270\"\/><\/figure><\/div>\n\n\n\n<pre class=\"wp-block-code\"><code># Four-screen expansion\n# pattern: 1  2  3  4<\/code><\/pre>\n\n\n\n<p>This is the 10-disp-3.conf under seeed-linux-usbdisp\/drivers\/linux-driver\/xserver_conf\/. simply copy this file to \/usr\/share\/X11\/xorg.conf.d\/ and name it 10-disp.conf:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo cp ~\/seeed-linux-usbdisp\/drivers\/linux-driver\/xserver_conf\/10-disp-3.conf \/usr\/share\/X11\/xorg.conf.d\/10-disp.conf<\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\">Setup 4<\/h3>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/files.seeedstudio.com\/wiki\/Wio-Terminanl-HMI\/display-4.png\" alt=\"\" width=\"793\" height=\"445\"\/><\/figure><\/div>\n\n\n\n<pre class=\"wp-block-code\"><code># Four-screen clone display<\/code><\/pre>\n\n\n\n<p>This is the 10-disp-4.conf under seeed-linux-usbdisp\/drivers\/linux-driver\/xserver_conf\/. simply copy this file to \/usr\/share\/X11\/xorg.conf.d\/ and name it 10-disp.conf:<\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo cp ~\/seeed-linux-usbdisp\/drivers\/linux-driver\/xserver_conf\/10-disp-4.conf<\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Run Python scripts on Raspberry Pi to display GUI on Wio Terminal LCD<\/strong><\/h2>\n\n\n\n<p>You can not only display the Raspberry Pi Desktop GUI on the Wio Terminal LCD, but also can run Python scripts on Raspberry Pi command line which is accessed from PC and display graphics on the Wio Terminal LCD by using a graphics library.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">PyQt5<\/h3>\n\n\n\n<p>One of the common graphics libraries is <a href=\"https:\/\/pypi.org\/project\/PyQt5\/\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\"PyQt (opens in a new tab)\">PyQt<\/a>. You can use this library, program a Python code and run on the Raspberry Pi to display interactive graphics on the Wio Terminal LCD. Here we will be using the latest version of PyQt which is PyQt5.<\/p>\n\n\n\n<p>You can install PyQt on the Raspberry Pi by following the steps below<\/p>\n\n\n\n<p><strong>Step 1<\/strong>:<br>Install dependencies for pyqt5   <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo apt update\nsudo apt install python3 python3-distutils python3-pyqt5 <\/code><\/pre>\n\n\n\n<p><strong>Step 2<\/strong>:<br>Export macros for the screen <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>export QT_QPA_PLATFORM=linuxfb:fb=\/dev\/fb1<\/code><\/pre>\n\n\n\n<p class=\"has-background has-very-light-gray-background-color\"><strong>Note: <\/strong><br><em>Where fb1 is the first screen, fb2 is second, fb3 is third and so on. You may use echo $QT_QPA_PLATFORM to check the macros.<\/em><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Basic Example<\/h3>\n\n\n\n<p>Here I will show you the basic usage of the PyQt5 library by displaying 3 buttons on the Wio Terminal LCD.<\/p>\n\n\n\n<p><strong>Step 1<\/strong>:<br>Copy the following codes and make a Python file called buttons.py. Then move this file to the Raspberry Pi <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>import sys\n\nfrom PyQt5.QtWidgets import QApplication\nfrom PyQt5.QtWidgets import QHBoxLayout\nfrom PyQt5.QtWidgets import QPushButton\nfrom PyQt5.QtWidgets import QWidget\n\napp = QApplication(sys.argv)\nwindow = QWidget()\nwindow.setWindowTitle('QHBoxLayout')\nlayout = QHBoxLayout()\nlayout.addWidget(QPushButton('Left'))\nlayout.addWidget(QPushButton('Center'))\nlayout.addWidget(QPushButton('Right'))\nwindow.setLayout(layout)\nwindow.show()\nsys.exit(app.exec_())<\/code><\/pre>\n\n\n\n<p><strong>Step 2<\/strong>:<br>After that, run this file  <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>python3 buttons.py<\/code><\/pre>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/blog.seeedstudio.com\/wp-content\/uploads\/2020\/11\/16045637571.png\" alt=\"\" class=\"wp-image-37975\" width=\"366\" height=\"313\" srcset=\"https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/16045637571.png 336w, https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/16045637571-300x256.png 300w\" sizes=\"(max-width: 366px) 100vw, 366px\" \/><\/figure><\/div>\n\n\n\n<p>You will see 3 buttons displayed on the Wio Terminal LCD<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Tetris on PyQt5<\/h3>\n\n\n\n<p>You can run the Tetris game on the Raspberry Pi, display on the Wio Terminal and control the blocks using a connected keyboard. This example is made by <a rel=\"noreferrer noopener\" aria-label=\"Jan Bodnar (opens in a new tab)\" href=\"http:\/\/zetcode.com\/gui\/pyqt5\/tetris\/\" target=\"_blank\">Jan Bodnar<\/a> and all credits go to him.<\/p>\n\n\n\n<p><strong>Step 1<\/strong>:<br>To use this demo, copy the following code to a Python file, name it as tetris.py. <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>#!\/usr\/bin\/python3\n\n\"\"\"\nZetCode PyQt5 tutorial\n\nThis is a Tetris game clone.\n\nAuthor: Jan Bodnar\nWebsite: zetcode.com\n\"\"\"\n\nimport random\nimport sys\n\nfrom PyQt5.QtCore import Qt, QBasicTimer, pyqtSignal\nfrom PyQt5.QtGui import QPainter, QColor\nfrom PyQt5.QtWidgets import QMainWindow, QFrame, QDesktopWidget, QApplication\n\n\nclass Tetris(QMainWindow):\n\n    def __init__(self):\n        super().__init__()\n\n        self.initUI()\n\n    def initUI(self):\n        \"\"\"initiates application UI\"\"\"\n\n        self.tboard = Board(self)\n        self.setCentralWidget(self.tboard)\n\n        self.statusbar = self.statusBar()\n        self.tboard.msg2Statusbar[str].connect(self.statusbar.showMessage)\n\n        self.tboard.start()\n\n        self.resize(180, 380)\n        self.center()\n        self.setWindowTitle('Tetris')\n        self.show()\n\n    def center(self):\n        \"\"\"centers the window on the screen\"\"\"\n\n        screen = QDesktopWidget().screenGeometry()\n        size = self.geometry()\n        self.move(int((screen.width() - size.width()) \/ 2),\n                  int((screen.height() - size.height()) \/ 2))\n\n\nclass Board(QFrame):\n    msg2Statusbar = pyqtSignal(str)\n\n    BoardWidth = 10\n    BoardHeight = 22\n    Speed = 300\n\n    def __init__(self, parent):\n        super().__init__(parent)\n\n        self.initBoard()\n\n    def initBoard(self):\n        \"\"\"initiates board\"\"\"\n\n        self.timer = QBasicTimer()\n        self.isWaitingAfterLine = False\n\n        self.curX = 0\n        self.curY = 0\n        self.numLinesRemoved = 0\n        self.board = []\n\n        self.setFocusPolicy(Qt.StrongFocus)\n        self.isStarted = False\n        self.isPaused = False\n        self.clearBoard()\n\n    def shapeAt(self, x, y):\n        \"\"\"determines shape at the board position\"\"\"\n\n        return self.board[(y * Board.BoardWidth) + x]\n\n    def setShapeAt(self, x, y, shape):\n        \"\"\"sets a shape at the board\"\"\"\n\n        self.board[(y * Board.BoardWidth) + x] = shape\n\n    def squareWidth(self):\n        \"\"\"returns the width of one square\"\"\"\n\n        return self.contentsRect().width() \/\/ Board.BoardWidth\n\n    def squareHeight(self):\n        \"\"\"returns the height of one square\"\"\"\n\n        return self.contentsRect().height() \/\/ Board.BoardHeight\n\n    def start(self):\n        \"\"\"starts game\"\"\"\n\n        if self.isPaused:\n            return\n\n        self.isStarted = True\n        self.isWaitingAfterLine = False\n        self.numLinesRemoved = 0\n        self.clearBoard()\n\n        self.msg2Statusbar.emit(str(self.numLinesRemoved))\n\n        self.newPiece()\n        self.timer.start(Board.Speed, self)\n\n    def pause(self):\n        \"\"\"pauses game\"\"\"\n\n        if not self.isStarted:\n            return\n\n        self.isPaused = not self.isPaused\n\n        if self.isPaused:\n            self.timer.stop()\n            self.msg2Statusbar.emit(\"paused\")\n\n        else:\n            self.timer.start(Board.Speed, self)\n            self.msg2Statusbar.emit(str(self.numLinesRemoved))\n\n        self.update()\n\n    def paintEvent(self, event):\n        \"\"\"paints all shapes of the game\"\"\"\n\n        painter = QPainter(self)\n        rect = self.contentsRect()\n\n        boardTop = rect.bottom() - Board.BoardHeight * self.squareHeight()\n\n        for i in range(Board.BoardHeight):\n            for j in range(Board.BoardWidth):\n                shape = self.shapeAt(j, Board.BoardHeight - i - 1)\n\n                if shape != Tetrominoe.NoShape:\n                    self.drawSquare(painter,\n                                    rect.left() + j * self.squareWidth(),\n                                    boardTop + i * self.squareHeight(), shape)\n\n        if self.curPiece.shape() != Tetrominoe.NoShape:\n\n            for i in range(4):\n                x = self.curX + self.curPiece.x(i)\n                y = self.curY - self.curPiece.y(i)\n                self.drawSquare(painter, rect.left() + x * self.squareWidth(),\n                                boardTop + (Board.BoardHeight - y - 1) * self.squareHeight(),\n                                self.curPiece.shape())\n\n    def keyPressEvent(self, event):\n        \"\"\"processes key press events\"\"\"\n\n        if not self.isStarted or self.curPiece.shape() == Tetrominoe.NoShape:\n            super(Board, self).keyPressEvent(event)\n            return\n\n        key = event.key()\n\n        if key == Qt.Key_P:\n            self.pause()\n            return\n\n        if self.isPaused:\n            return\n\n        elif key == Qt.Key_Left:\n            self.tryMove(self.curPiece, self.curX - 1, self.curY)\n\n        elif key == Qt.Key_Right:\n            self.tryMove(self.curPiece, self.curX + 1, self.curY)\n\n        elif key == Qt.Key_Down:\n            self.tryMove(self.curPiece.rotateRight(), self.curX, self.curY)\n\n        elif key == Qt.Key_Up:\n            self.tryMove(self.curPiece.rotateLeft(), self.curX, self.curY)\n\n        elif key == Qt.Key_Space:\n            self.dropDown()\n\n        elif key == Qt.Key_D:\n            self.oneLineDown()\n\n        else:\n            super(Board, self).keyPressEvent(event)\n\n    def timerEvent(self, event):\n        \"\"\"handles timer event\"\"\"\n\n        if event.timerId() == self.timer.timerId():\n\n            if self.isWaitingAfterLine:\n                self.isWaitingAfterLine = False\n                self.newPiece()\n            else:\n                self.oneLineDown()\n\n        else:\n            super(Board, self).timerEvent(event)\n\n    def clearBoard(self):\n        \"\"\"clears shapes from the board\"\"\"\n\n        for i in range(Board.BoardHeight * Board.BoardWidth):\n            self.board.append(Tetrominoe.NoShape)\n\n    def dropDown(self):\n        \"\"\"drops down a shape\"\"\"\n\n        newY = self.curY\n\n        while newY > 0:\n\n            if not self.tryMove(self.curPiece, self.curX, newY - 1):\n                break\n\n            newY -= 1\n\n        self.pieceDropped()\n\n    def oneLineDown(self):\n        \"\"\"goes one line down with a shape\"\"\"\n\n        if not self.tryMove(self.curPiece, self.curX, self.curY - 1):\n            self.pieceDropped()\n\n    def pieceDropped(self):\n        \"\"\"after dropping shape, remove full lines and create new shape\"\"\"\n\n        for i in range(4):\n            x = self.curX + self.curPiece.x(i)\n            y = self.curY - self.curPiece.y(i)\n            self.setShapeAt(x, y, self.curPiece.shape())\n\n        self.removeFullLines()\n\n        if not self.isWaitingAfterLine:\n            self.newPiece()\n\n    def removeFullLines(self):\n        \"\"\"removes all full lines from the board\"\"\"\n\n        numFullLines = 0\n        rowsToRemove = []\n\n        for i in range(Board.BoardHeight):\n\n            n = 0\n            for j in range(Board.BoardWidth):\n                if not self.shapeAt(j, i) == Tetrominoe.NoShape:\n                    n = n + 1\n\n            if n == 10:\n                rowsToRemove.append(i)\n\n        rowsToRemove.reverse()\n\n        for m in rowsToRemove:\n\n            for k in range(m, Board.BoardHeight):\n                for l in range(Board.BoardWidth):\n                    self.setShapeAt(l, k, self.shapeAt(l, k + 1))\n\n        numFullLines = numFullLines + len(rowsToRemove)\n\n        if numFullLines > 0:\n            self.numLinesRemoved = self.numLinesRemoved + numFullLines\n            self.msg2Statusbar.emit(str(self.numLinesRemoved))\n\n            self.isWaitingAfterLine = True\n            self.curPiece.setShape(Tetrominoe.NoShape)\n            self.update()\n\n    def newPiece(self):\n        \"\"\"creates a new shape\"\"\"\n\n        self.curPiece = Shape()\n        self.curPiece.setRandomShape()\n        self.curX = Board.BoardWidth \/\/ 2 + 1\n        self.curY = Board.BoardHeight - 1 + self.curPiece.minY()\n\n        if not self.tryMove(self.curPiece, self.curX, self.curY):\n            self.curPiece.setShape(Tetrominoe.NoShape)\n            self.timer.stop()\n            self.isStarted = False\n            self.msg2Statusbar.emit(\"Game over\")\n\n    def tryMove(self, newPiece, newX, newY):\n        \"\"\"tries to move a shape\"\"\"\n\n        for i in range(4):\n\n            x = newX + newPiece.x(i)\n            y = newY - newPiece.y(i)\n\n            if x &lt; 0 or x >= Board.BoardWidth or y &lt; 0 or y >= Board.BoardHeight:\n                return False\n\n            if self.shapeAt(x, y) != Tetrominoe.NoShape:\n                return False\n\n        self.curPiece = newPiece\n        self.curX = newX\n        self.curY = newY\n        self.update()\n\n        return True\n\n    def drawSquare(self, painter, x, y, shape):\n        \"\"\"draws a square of a shape\"\"\"\n\n        colorTable = [0x000000, 0xCC6666, 0x66CC66, 0x6666CC,\n                      0xCCCC66, 0xCC66CC, 0x66CCCC, 0xDAAA00]\n\n        color = QColor(colorTable[shape])\n        painter.fillRect(x + 1, y + 1, self.squareWidth() - 2,\n                         self.squareHeight() - 2, color)\n\n        painter.setPen(color.lighter())\n        painter.drawLine(x, y + self.squareHeight() - 1, x, y)\n        painter.drawLine(x, y, x + self.squareWidth() - 1, y)\n\n        painter.setPen(color.darker())\n        painter.drawLine(x + 1, y + self.squareHeight() - 1,\n                         x + self.squareWidth() - 1, y + self.squareHeight() - 1)\n        painter.drawLine(x + self.squareWidth() - 1,\n                         y + self.squareHeight() - 1, x + self.squareWidth() - 1, y + 1)\n\n\nclass Tetrominoe(object):\n    NoShape = 0\n    ZShape = 1\n    SShape = 2\n    LineShape = 3\n    TShape = 4\n    SquareShape = 5\n    LShape = 6\n    MirroredLShape = 7\n\n\nclass Shape(object):\n    coordsTable = (\n        ((0, 0), (0, 0), (0, 0), (0, 0)),\n        ((0, -1), (0, 0), (-1, 0), (-1, 1)),\n        ((0, -1), (0, 0), (1, 0), (1, 1)),\n        ((0, -1), (0, 0), (0, 1), (0, 2)),\n        ((-1, 0), (0, 0), (1, 0), (0, 1)),\n        ((0, 0), (1, 0), (0, 1), (1, 1)),\n        ((-1, -1), (0, -1), (0, 0), (0, 1)),\n        ((1, -1), (0, -1), (0, 0), (0, 1))\n    )\n\n    def __init__(self):\n\n        self.coords = [[0, 0] for i in range(4)]\n        self.pieceShape = Tetrominoe.NoShape\n\n        self.setShape(Tetrominoe.NoShape)\n\n    def shape(self):\n        \"\"\"returns shape\"\"\"\n\n        return self.pieceShape\n\n    def setShape(self, shape):\n        \"\"\"sets a shape\"\"\"\n\n        table = Shape.coordsTable[shape]\n\n        for i in range(4):\n            for j in range(2):\n                self.coords[i][j] = table[i][j]\n\n        self.pieceShape = shape\n\n    def setRandomShape(self):\n        \"\"\"chooses a random shape\"\"\"\n\n        self.setShape(random.randint(1, 7))\n\n    def x(self, index):\n        \"\"\"returns x coordinate\"\"\"\n\n        return self.coords[index][0]\n\n    def y(self, index):\n        \"\"\"returns y coordinate\"\"\"\n\n        return self.coords[index][1]\n\n    def setX(self, index, x):\n        \"\"\"sets x coordinate\"\"\"\n\n        self.coords[index][0] = x\n\n    def setY(self, index, y):\n        \"\"\"sets y coordinate\"\"\"\n\n        self.coords[index][1] = y\n\n    def minX(self):\n        \"\"\"returns min x value\"\"\"\n\n        m = self.coords[0][0]\n        for i in range(4):\n            m = min(m, self.coords[i][0])\n\n        return m\n\n    def maxX(self):\n        \"\"\"returns max x value\"\"\"\n\n        m = self.coords[0][0]\n        for i in range(4):\n            m = max(m, self.coords[i][0])\n\n        return m\n\n    def minY(self):\n        \"\"\"returns min y value\"\"\"\n\n        m = self.coords[0][1]\n        for i in range(4):\n            m = min(m, self.coords[i][1])\n\n        return m\n\n    def maxY(self):\n        \"\"\"returns max y value\"\"\"\n\n        m = self.coords[0][1]\n        for i in range(4):\n            m = max(m, self.coords[i][1])\n\n        return m\n\n    def rotateLeft(self):\n        \"\"\"rotates shape to the left\"\"\"\n\n        if self.pieceShape == Tetrominoe.SquareShape:\n            return self\n\n        result = Shape()\n        result.pieceShape = self.pieceShape\n\n        for i in range(4):\n            result.setX(i, self.y(i))\n            result.setY(i, -self.x(i))\n\n        return result\n\n    def rotateRight(self):\n        \"\"\"rotates shape to the right\"\"\"\n\n        if self.pieceShape == Tetrominoe.SquareShape:\n            return self\n\n        result = Shape()\n        result.pieceShape = self.pieceShape\n\n        for i in range(4):\n            result.setX(i, -self.y(i))\n            result.setY(i, self.x(i))\n\n        return result\n\n\ndef main():\n\n    app = QApplication([])\n    tetris = Tetris()\n    sys.exit(app.exec_())\n\n\nif __name__ == '__main__':\n    main()<\/code><\/pre>\n\n\n\n<p><strong>Step 2<\/strong>:<br>After that, run this file  <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>python3 tetris.py<\/code><\/pre>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"430\" height=\"358\" src=\"https:\/\/blog.seeedstudio.com\/wp-content\/uploads\/2020\/11\/16045638201-1.png\" alt=\"\" class=\"wp-image-37981\" srcset=\"https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/16045638201-1.png 430w, https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/16045638201-1-300x250.png 300w\" sizes=\"(max-width: 430px) 100vw, 430px\" \/><\/figure><\/div>\n\n\n\n<p>Now you can play Tetris, displayed on the Wio Terminal LCD by using the keyboard arrow keys and the spacebar.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Scientific Graphics using PtQtGraph <\/h3>\n\n\n\n<p><a href=\"http:\/\/www.pyqtgraph.org\/\">PyQtGraph<\/a> is a pure-python graphics and GUI library built on PyQt4 \/ PySide and numpy. It is intended for use in mathematics \/ scientific \/ engineering applications.<\/p>\n\n\n\n<p>Let\u2019s look at an example of displaying a scientific graph.<\/p>\n\n\n\n<p><strong>Step 1<\/strong>:<br>Install dependencies for PyQtGraph  <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>sudo apt update\nsudo apt install python3 python3-distutils python3-pyqt5 python3-pip python3-numpy -y\nsudo pip3 install pyqtgraph<\/code><\/pre>\n\n\n\n<p><strong>Step 2<\/strong>:<br>Copy the following code to a Python file, name it as graph.py <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code># -*- coding: utf-8 -*-\n\"\"\"\nDemonstrates common image analysis tools.\nMany of the features demonstrated here are already provided by the ImageView\nwidget, but here we present a lower-level approach that provides finer control\nover the user interface.\n\"\"\"\nimport pyqtgraph as pg\nfrom pyqtgraph.Qt import QtCore, QtGui\nimport numpy as np\n \n \n# Interpret image data as row-major instead of col-major\npg.setConfigOptions(imageAxisOrder='row-major')\n \npg.mkQApp()\nwin = pg.GraphicsLayoutWidget()\nwin.setWindowTitle('pyqtgraph example: Image Analysis')\n \n# A plot area (ViewBox + axes) for displaying the image\np1 = win.addPlot(title=\"\")\n \n# Item for displaying image data\nimg = pg.ImageItem()\np1.addItem(img)\n \n# Custom ROI for selecting an image region\nroi = pg.ROI([-8, 14], [6, 5])\nroi.addScaleHandle([0.5, 1], [0.5, 0.5])\nroi.addScaleHandle([0, 0.5], [0.5, 0.5])\np1.addItem(roi)\nroi.setZValue(10)  # make sure ROI is drawn above image\n \n# Isocurve drawing\niso = pg.IsocurveItem(level=0.8, pen='g')\niso.setParentItem(img)\niso.setZValue(5)\n \n# Contrast\/color control\nhist = pg.HistogramLUTItem()\nhist.setImageItem(img)\nwin.addItem(hist)\n \n# Draggable line for setting isocurve level\nisoLine = pg.InfiniteLine(angle=0, movable=True, pen='g')\nhist.vb.addItem(isoLine)\nhist.vb.setMouseEnabled(y=False) # makes user interaction a little easier\nisoLine.setValue(0.8)\nisoLine.setZValue(1000) # bring iso line above contrast controls\n \n# Another plot area for displaying ROI data\nwin.nextRow()\np2 = win.addPlot(colspan=2)\np2.setMaximumHeight(250)\nwin.resize(800, 800)\nwin.show()\n \n \n# Generate image data\ndata = np.random.normal(size=(200, 100))\ndata[20:80, 20:80] += 2.\ndata = pg.gaussianFilter(data, (3, 3))\ndata += np.random.normal(size=(200, 100)) * 0.1\nimg.setImage(data)\nhist.setLevels(data.min(), data.max())\n \n# build isocurves from smoothed data\niso.setData(pg.gaussianFilter(data, (2, 2)))\n \n# set position and scale of image\nimg.scale(0.2, 0.2)\nimg.translate(-50, 0)\n \n# zoom to fit imageo\np1.autoRange()  \n \n \n# Callbacks for handling user interaction\ndef updatePlot():\n    global img, roi, data, p2\n    selected = roi.getArrayRegion(data, img)\n    p2.plot(selected.mean(axis=0), clear=True)\n \nroi.sigRegionChanged.connect(updatePlot)\nupdatePlot()\n \ndef updateIsocurve():\n    global isoLine, iso\n    iso.setLevel(isoLine.value())\n \nisoLine.sigDragged.connect(updateIsocurve)\n \ndef imageHoverEvent(event):\n    \"\"\"Show the position, pixel, and value under the mouse cursor.\n    \"\"\"\n    if event.isExit():\n        p1.setTitle(\"\")\n        return\n    pos = event.pos()\n    i, j = pos.y(), pos.x()\n    i = int(np.clip(i, 0, data.shape[0] - 1))\n    j = int(np.clip(j, 0, data.shape[1] - 1))\n    val = data[i, j]\n    ppos = img.mapToParent(pos)\n    x, y = ppos.x(), ppos.y()\n    p1.setTitle(\"pos: (%0.1f, %0.1f)  pixel: (%d, %d)  value: %g\" % (x, y, i, j, val))\n \n# Monkey-patch the image to use our custom hover function. \n# This is generally discouraged (you should subclass ImageItem instead),\n# but it works for a very simple use like this. \nimg.hoverEvent = imageHoverEvent\n \n \n## Start Qt event loop unless running in interactive mode or using pyside.\nif __name__ == '__main__':\n    import sys\n    if (sys.flags.interactive != 1) or not hasattr(QtCore, 'PYQT_VERSION'):\n        QtGui.QApplication.instance().exec_()<\/code><\/pre>\n\n\n\n<p><strong>Step 3<\/strong>:<br>After that, run this file  <\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>python3 graph.py<\/code><\/pre>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/files.seeedstudio.com\/wiki\/Wio-Terminanl-HMI\/pyqt-new.gif\" alt=\"\" width=\"608\" height=\"344\"\/><\/figure><\/div>\n\n\n\n<p>Now you will see different scientific graphs displayed on the Wio Terminal!<\/p>\n\n\n\n<p>If you experienced that Mouse is crashing with PyQtGraph&#8217;s script, you can simply disable raspberry pi&#8217;s desktop using sudo raspi-config -&gt; Boot options -&gt; Desktop\/CLI -&gt; Console Autologin.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/files.seeedstudio.com\/wiki\/Wio-Terminanl-HMI\/raspi.png\" alt=\"\" width=\"625\" height=\"362\"\/><\/figure><\/div>\n\n\n\n<p>You can also run different PyQtGraph scripts on different screens as follows <\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/files.seeedstudio.com\/wiki\/Wio-Terminanl-HMI\/4qt.jpg\" alt=\"\" width=\"727\" height=\"347\"\/><\/figure><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Usermod SDK<\/h2>\n\n\n\n<p>Apart from displaying your Raspberry Pi Desktop GUI on the Wio Terminal LCD, you could display your PC on the Wio Terminal LCD as well. Click <a rel=\"noreferrer noopener\" aria-label=\"here (opens in a new tab)\" href=\"https:\/\/wiki.seeedstudio.com\/Wio-Terminal-HMI-Usermode-SDK\/\" target=\"_blank\">here<\/a> to check the wiki for more information.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n\n\n<p>That\u2019s all about it for this blog. I hope you clearly understood how to setup the Wio Terminal so that you could use it as a display with your Raspberry Pi, Jetson Nano, BeagleBone, and ODYSSEY-86! Now you can start implementing it in your next projects!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Introduction When you get your hands on a Raspberry Pi for the very first time,<\/p>\n","protected":false},"author":141,"featured_media":38000,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_lmt_disableupdate":"","_lmt_disable":"","_price":"","_stock":"","_tribe_ticket_header":"","_tribe_default_ticket_provider":"","_tribe_ticket_capacity":"0","_ticket_start_date":"","_ticket_end_date":"","_tribe_ticket_show_description":"","_tribe_ticket_show_not_going":false,"_tribe_ticket_use_global_stock":"","_tribe_ticket_global_stock_level":"","_global_stock_mode":"","_global_stock_cap":"","_tribe_rsvp_for_event":"","_tribe_ticket_going_count":"","_tribe_ticket_not_going_count":"","_tribe_tickets_list":"[]","_tribe_ticket_has_attendee_info_fields":false,"iawp_total_views":0,"footnotes":""},"categories":[1],"tags":[142,247,3003],"class_list":["post-37938","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-news","tag-open-hardware","tag-raspberry-pi","tag-wio-terminal"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.0 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Don\u2019t Have an HDMI Display For Your Raspberry Pi? Wio Terminal LCD Got You Covered With a USB HMI! - Latest News from Seeed Studio<\/title>\n<meta name=\"description\" content=\"Learn how to use the Wio Terminal as an HMI USB display for Raspberry PI, NVIDIA Jetson Nano, BeagleBone and ODYSSEY - X86!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Don\u2019t Have an HDMI Display For Your Raspberry Pi? Wio Terminal LCD Got You Covered With a USB HMI! - Latest News from Seeed Studio\" \/>\n<meta property=\"og:description\" content=\"Learn how to use the Wio Terminal as an HMI USB display for Raspberry PI, NVIDIA Jetson Nano, BeagleBone and ODYSSEY - X86!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/\" \/>\n<meta property=\"og:site_name\" content=\"Latest News from Seeed Studio\" \/>\n<meta property=\"article:published_time\" content=\"2020-11-05T09:15:13+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-06-10T06:54:29+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"675\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Lakshan\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Lakshan\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"19 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/\",\"url\":\"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/\",\"name\":\"Don\u2019t Have an HDMI Display For Your Raspberry Pi? Wio Terminal LCD Got You Covered With a USB HMI! - Latest News from Seeed Studio\",\"isPartOf\":{\"@id\":\"https:\/\/www.seeedstudio.com\/blog\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg\",\"datePublished\":\"2020-11-05T09:15:13+00:00\",\"dateModified\":\"2021-06-10T06:54:29+00:00\",\"author\":{\"@id\":\"https:\/\/www.seeedstudio.com\/blog\/#\/schema\/person\/75eb10f611f7c10a195a98452628bba5\"},\"description\":\"Learn how to use the Wio Terminal as an HMI USB display for Raspberry PI, NVIDIA Jetson Nano, BeagleBone and ODYSSEY - X86!\",\"breadcrumb\":{\"@id\":\"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/#primaryimage\",\"url\":\"https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg\",\"contentUrl\":\"https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg\",\"width\":1200,\"height\":675},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/www.seeedstudio.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Don\u2019t Have an HDMI Display For Your Raspberry Pi? Wio Terminal LCD Got You Covered With a USB HMI!\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.seeedstudio.com\/blog\/#website\",\"url\":\"https:\/\/www.seeedstudio.com\/blog\/\",\"name\":\"Latest News from Seeed Studio\",\"description\":\"Emerging IoT, AI and Autonomous Applications on the Edge\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.seeedstudio.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.seeedstudio.com\/blog\/#\/schema\/person\/75eb10f611f7c10a195a98452628bba5\",\"name\":\"Lakshan\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/www.seeedstudio.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/c1688294d55a746c8c80f4b85eb94989?s=96&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/c1688294d55a746c8c80f4b85eb94989?s=96&r=g\",\"caption\":\"Lakshan\"},\"url\":\"https:\/\/www.seeedstudio.com\/blog\/author\/lakshan\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Don\u2019t Have an HDMI Display For Your Raspberry Pi? Wio Terminal LCD Got You Covered With a USB HMI! - Latest News from Seeed Studio","description":"Learn how to use the Wio Terminal as an HMI USB display for Raspberry PI, NVIDIA Jetson Nano, BeagleBone and ODYSSEY - X86!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/","og_locale":"en_US","og_type":"article","og_title":"Don\u2019t Have an HDMI Display For Your Raspberry Pi? Wio Terminal LCD Got You Covered With a USB HMI! - Latest News from Seeed Studio","og_description":"Learn how to use the Wio Terminal as an HMI USB display for Raspberry PI, NVIDIA Jetson Nano, BeagleBone and ODYSSEY - X86!","og_url":"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/","og_site_name":"Latest News from Seeed Studio","article_published_time":"2020-11-05T09:15:13+00:00","article_modified_time":"2021-06-10T06:54:29+00:00","og_image":[{"width":1200,"height":675,"url":"https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg","type":"image\/jpeg"}],"author":"Lakshan","twitter_card":"summary_large_image","twitter_misc":{"Written by":"Lakshan","Est. reading time":"19 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/","url":"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/","name":"Don\u2019t Have an HDMI Display For Your Raspberry Pi? Wio Terminal LCD Got You Covered With a USB HMI! - Latest News from Seeed Studio","isPartOf":{"@id":"https:\/\/www.seeedstudio.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/#primaryimage"},"image":{"@id":"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/#primaryimage"},"thumbnailUrl":"https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg","datePublished":"2020-11-05T09:15:13+00:00","dateModified":"2021-06-10T06:54:29+00:00","author":{"@id":"https:\/\/www.seeedstudio.com\/blog\/#\/schema\/person\/75eb10f611f7c10a195a98452628bba5"},"description":"Learn how to use the Wio Terminal as an HMI USB display for Raspberry PI, NVIDIA Jetson Nano, BeagleBone and ODYSSEY - X86!","breadcrumb":{"@id":"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/#primaryimage","url":"https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg","contentUrl":"https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg","width":1200,"height":675},{"@type":"BreadcrumbList","@id":"https:\/\/www.seeedstudio.com\/blog\/2020\/11\/05\/dont-have-an-hdmi-display-for-your-raspberry-pi-wio-terminal-lcd-got-you-covered-with-an-hmi-m\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.seeedstudio.com\/blog\/"},{"@type":"ListItem","position":2,"name":"Don\u2019t Have an HDMI Display For Your Raspberry Pi? Wio Terminal LCD Got You Covered With a USB HMI!"}]},{"@type":"WebSite","@id":"https:\/\/www.seeedstudio.com\/blog\/#website","url":"https:\/\/www.seeedstudio.com\/blog\/","name":"Latest News from Seeed Studio","description":"Emerging IoT, AI and Autonomous Applications on the Edge","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.seeedstudio.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/www.seeedstudio.com\/blog\/#\/schema\/person\/75eb10f611f7c10a195a98452628bba5","name":"Lakshan","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.seeedstudio.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/c1688294d55a746c8c80f4b85eb94989?s=96&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/c1688294d55a746c8c80f4b85eb94989?s=96&r=g","caption":"Lakshan"},"url":"https:\/\/www.seeedstudio.com\/blog\/author\/lakshan\/"}]}},"modified_by":"Lily","views":6675,"featured_image_urls":{"full":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg",1200,675,false],"thumbnail":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb-80x80.jpg",80,80,true],"medium":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb-300x169.jpg",300,169,true],"medium_large":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb-768x432.jpg",640,360,true],"large":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb-1030x579.jpg",640,360,true],"1536x1536":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg",1200,675,false],"2048x2048":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg",1200,675,false],"visody_icon":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg",32,18,false],"magazine-7-slider-full":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb.jpg",1200,675,false],"magazine-7-slider-center":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb-936x675.jpg",936,675,true],"magazine-7-featured":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb-1024x576.jpg",1024,576,true],"magazine-7-medium":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb-720x380.jpg",720,380,true],"magazine-7-medium-square":["https:\/\/www.seeedstudio.com\/blog\/wp-content\/uploads\/2020\/11\/thumb-675x450.jpg",675,450,true]},"author_info":{"display_name":"Lakshan","author_link":"https:\/\/www.seeedstudio.com\/blog\/author\/lakshan\/"},"category_info":"<a href=\"https:\/\/www.seeedstudio.com\/blog\/category\/news\/\" rel=\"category tag\">News<\/a>","tag_info":"News","comment_count":"0","_links":{"self":[{"href":"https:\/\/www.seeedstudio.com\/blog\/wp-json\/wp\/v2\/posts\/37938","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.seeedstudio.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.seeedstudio.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.seeedstudio.com\/blog\/wp-json\/wp\/v2\/users\/141"}],"replies":[{"embeddable":true,"href":"https:\/\/www.seeedstudio.com\/blog\/wp-json\/wp\/v2\/comments?post=37938"}],"version-history":[{"count":43,"href":"https:\/\/www.seeedstudio.com\/blog\/wp-json\/wp\/v2\/posts\/37938\/revisions"}],"predecessor-version":[{"id":39630,"href":"https:\/\/www.seeedstudio.com\/blog\/wp-json\/wp\/v2\/posts\/37938\/revisions\/39630"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.seeedstudio.com\/blog\/wp-json\/wp\/v2\/media\/38000"}],"wp:attachment":[{"href":"https:\/\/www.seeedstudio.com\/blog\/wp-json\/wp\/v2\/media?parent=37938"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.seeedstudio.com\/blog\/wp-json\/wp\/v2\/categories?post=37938"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.seeedstudio.com\/blog\/wp-json\/wp\/v2\/tags?post=37938"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}