Hello, UNIHIKER! | UNIHIKER Tutorial: Learn Python with Graphical Programming for Beginners 01

Meimei Mar 28.2023

0 4769 Easy

When you first encounter the UNIHIKER, you might wonder what it is and what features it offers.UNIHIKER is a Debian-based Linux Single Board Computer (SBC) that comes with a quad-core Arm Cortex A35 processor, an RISC-V MCU, a built-in Jupyter Notebook, and a 2.8-inch touchscreen. With features like I2C/ADC analog input and Python programming capabilities, this development board is particularly suitable for applications in AI, IoT, and STEM Education.

The UNIHIKER's large screen allows for the display of text, charts, and videos, providing an interactive visual experience. In the next step, we will utilize the UNIHIKER's screen to display colored texts, embarking on a journey into graphical programming!

Goal

Display colorful texts in multiple languages on the UNIHIKER screen.

Get to Know

1. How to display texts on UNIHIKER

2. The coordinates of UNIHIKER screen

HARDWARE LIST

1 UNIHIKER

Link

1 Type-C&Micro 2-in-1 USB Cable

Link

Software: Mind+

Download address：https://www.mindplus.cc

How to Use UNIHIKER on Mind+?

How can we display text on the UNIHIKER screen? We need to write some codes! To do that, we will use Mind+, a programming software that supports various hardware including UNIHIKER. With its rich command blocks and extensions, Mind+ can help you experience the joy of creation effortlessly. In this lesson, we'll learn the basics of how to use Mind+ so that we can get ready for more exciting projects in the future.

1. Open Mind+

Double-click the icon to open Mind+, and we can see the interface below:

Click "Python" in the upper right corner.

Then select the programming mode on the top left corner, "Blocks" for graphical programming and "Code" for python coding. Here we choose "Blocks" to complete our project.

After that, we will enter the main programming interface.

Note: For a detailed description of each area, please refer to the "Knowledge Base" of this lesson.

2. Load UNIHIKER

Based on the previous operations, you only need to click "Expansions", find the "UNIHIKER" module under "Official Library", and click to add it. Then go back, and you can see UNIHIKER in "Command Area", which means UNIHIKER is done loading.

Please note that after UNIHIKER is loaded, an additional option will appear in the menu bar for connecting to UNIHIKER - "Connect Remote Terminal".

3. Connect to UNIHIKER

First, connect UNIHIKER to the computer via a USB cable;

Then, wait and confirm UNIHIKER is connected and powered on (as shown below), and get ready to connect to UNIHIKER remotely.

Click "Connect Remote Terminal", and select 10.1.2.3 to connect to UNIHIKER.

Note: The UNIHIKER's IP address is 10.1.2.3 when connected directly via USB.

When the connection is established successfully, a prompt will pop up and the terminal will display the UNIHIKER, along with detecting the version of the dependent library. Simply wait for the detection process to complete.

Once the connection is established successfully, click

and Mind+ will send the Python codes to UNIHIKER to execute them. You can then observe the execution result on the UNIHIKER.

Note: If the connection is unsuccessful, you can refer to the solution below to resolve the issue.

If the issue still cannot be resolved, you can visit the UNIHIKER official website（UNIHIKER FAQs） and refer to the "FAQ" section for solutions.

4. Save the File

Click on "Project" in the "Menu Bar" and click "Save Project" in the drop-down menu.

Then in the pop-up window, select the location to save the file, enter the file name, choose the save type as "Mind+", and click Save.

Hands-on Practice

Let's complete today's lesson tasks together. We will start with the first UNIHIKER command and gradually learn how to display multiple colored texts on the screen.

Task 1: Run the first command

First, we will learn how to display text and show the preset text "UNIHIKER" on the screen.

Task 2: Display a colored "you"

After that, we will further deepen the application of coordinates and colors in the text display command, and then display the word "you" in red on the screen.

Task 3: Display a string of text in different colors

By changing the coordinates in the text display command, we will learn how to adjust the space between multiple characters and display a string of colored text in the center of the screen.

Task 1: Run the first command

1. Hardware Connection

Connect UNIHIKER to the computer via a USB cable.

2. Software Preparation

Make sure that Mind+ is open and the preset code appears in the Python graphical mode, indicating that the UNIHIKER is loaded successfully. Now you can proceed to write the program for the project.

3. Write a Program

Find the block Object name shows text "UNIHIKER" at X0Y0 font size 20 color blue in the UNIHIKER blocks, and drag and place it under the preset block python main program start.

The complete codes are shown below.

4. Run the program

Step 1: Check and make sure UNIHIKER is connected to Mind+, i.e. the IP is displayed in the "Menu Bar".

Step 2: Click on the Run button at the top right of the interface.

Step 3: Observe the display effect of UNIHIKER (refer to the figure below).

Task 2: Display a colored "Hello"

1. Write a program

From the first task, we know that the command Object name shows text "UNIHIKER" at X0Y0 font size 20 color blue is used to show the text "UNIHIKER" with a font size of 20 and color blue in the upper left corner of the screen, which is the origin of the coordinates (0, 0). Now change the text to "Hello", and select the color red in the color picker box.

The complete codes are shown below:

2. Run the program

Run the program and check the result.

3. Have a try

Now that you know how to use the command to display text, try adjusting the coordinates and font size to display a larger "Hello" in the center of the UNIHIKER screen.

Note: You can change the coordinates according to the diagram below. Please refer to the "Knowledge Base" section of this lesson for detailed information on the coordinates of UNIHIKER.

Task 3: Display text in different colors

1. Write a program

(1) Determine the number of text colors

We are going to display "你好，行空板！" "Hello, UNIHIKER!" "안녕하세요, UNIHIKER！" and "こんにちは、UNIHIKER！" on UNIHIKER and each shows in 2 different colors, so one command is not enough. In this task, there are a total of 8 colors to be used, so 8 command blocks are needed. You can right-click on the command, and select "Duplicate" to copy blocks.

(2) Adjust spaces between characters

Each Chinese character or symbol has a different position. When adjusting spaces between characters, you don't need to frequently check results on the UNIHIKER screen. Instead, you can disconnect UNIHIKER, run the Python program, then check the coordinate display effect on the popup window.

a) Click on the UNIHIKER IP in the "Menu Bar" and select "Disconnect Remote Terminal" in the drop-down menu.

b) Click Run, then the program will directly run on the PC, and a window as big as the screen of the UNIHIKER will pop up.

Note: For more information about the pop-up window, see the "Knowledge Base" section of this lesson.

Next, we can adjust the space between characters with the pop-up window. Generally, when determining the space between multiple characters, we only need to determine the coordinates of two characters or symbols horizontally or vertically, then we can obtain the position of all characters or symbols through a calculation based on the coordinate difference.

Taking the display of "Hello" and "UNIHIKER" as an example, we set the font size of both words to 15, place the word "Hello" at X:10 Y:90 and "UNIHIKER" on the right side with Y-coordinate unchanged and X-coordinate increasing to the right. Try adjusting a few values to find the appropriate coordinates (refer to the figure below for the adjusting process).

The appropriate difference in X coordinates between "Hello" and "UNIHIKER" is 50, as shown in the figure above. Since the space between the subsequent texts is not the same, you may have to try multiple times to find the appropriate X coordinate. The Y-coordinate distance between each sentence is equal, and you just need to increase steadily after calculating the appropriate value. The complete sample program is as follows:

2. Run the program

Step 1: Connect to UNIHIKER

Step 2: Click Run

Step 3: View the result

You can see the text "你好，行空板！" "Hello, UNIHIKER!" "안녕하세요, UNIHIKER！" and "こんにちは、UNIHIKER！" displayed on the UNIHIKER screen.

Knowledge Base

1. Introduction to Mind+ interface

We have already learned about the Mind+ operating interface related to UNIHIKER, now let's take a detailed look at the functions of each area.

Introduction to the Mind+ operating interface related to UNIHIKER.

2. Run Python code on PC

When the UNIHIKER is connected to a PC, clicking "Run" will execute the code on the UNIHIKER and display the result on its screen. But when UNIHIKER is disconnected from the PC, clicking "Run" will execute the code on the PC and display the result on a popup window, which has the same size as the UNIHIKER and can be very useful for debugging or checking code.

Operations for pop-up window:

(1) The pop-up window can be minimized and closed, but cannot be resized, so you can see that the maximize button is grayed out.

(2) There are two ways to close the pop-up window: directly click the "X" or click "Stop".

(3) If you cannot see the pop-up window when clicking on "run", it may be due to the following three situations:

a)Your program does not involve any commands under the "Screen Display", "Mouse or keyboard event" or "Multithreading" categories of the UNIHIKER;

b) There is a code running error, which will be displayed in the Terminal area. You need to find out the cause based on the error prompt;

c) After the code is executed, the window does not stay on the computer screen because Mind+ determines that there is no task to execute and automatically closes the window. In this case, you just need to add a "forever" block at the end of the code to make sure that the window stays on the computer screen all the time after the program is executed.

3. Coordinates on UNIHIKER Screen

The resolution of the UNIHIKER screen is 240 x 320, which means the width of the board is 240 pixels and the height is 320 pixels. We use a coordinate system to describe the position on the screen: the origin is the top-left corner of the screen, the positive x-axis points to the right, and the positive y-axis goes down. So we can set the coordinates of x and y in the codes to make texts and other elements on the screen be displayed at the specific location.