In the previous stage, we learned basic pin I/O knowledge with LEDs. Starting from this lesson, we will explore the front screen of the UNIHIKER K10 and create various works with it.
In this lesson, we'll first make a digital sticky note to learn about the UNIHIKER K10 screen through text display.
Project Objectives
Knowledge Objectives
1.Understand the LCD screen display principle.
2.Master the UNIHIKER K10 screen coordinates.
3.Master the general method of text display on the UNIHIKER K10 screen.
Practical Objective
Display the following notes on the screen.
Materials List
Preparations
Hardware
Connect the UNIHIKER K10 to the computer with a USB cable.
Software
Open Mind+ v2, switch to“Upload Mode”, connect the UNIHIKER K10 as shown in the figure below, and load the UNIHIKER K10 library.
Hands-on Practice
Next, we'll realize the display and typesetting of digital sticky note through different text display methods.
Task 1:Display Digital Sticky Notes
In this task, we use the "line" display method to show notes on the UNIHIKER K10 screen.
Task 2: Optimize Note Typesetting
In this task, we use the "coordinate" display method to show three lines of poem and optimize its typesetting.
Task 1: Display Digital Sticky Notes
Code
Text display blocks for the UNIHIKER K10 screen are in its "Screen" category, with two methods: Line Display and Coordinate Display.
First, use the "Line" display method to show the“Note:”on Line 1.
The method is simple: Drag out “cache text (“UNIHIKER”) on Line (1) color () ” block, modify the text content, place it below unihiker k10 on start, then use show cached content block to show content on the screen.
Sample code below:
For multi-line text display, copy cache text (“UNIHIKER”) on Line (1) color () block and modify text content and line number (see the program below).
Run the Code
Click the“Upload”button, wait for the upload to complete,then observe the screen display.
Code Review
Category | Blocks | Function |
 |  | Display text of the specified color starting from the leftmost side of the first line on the UNIHIKER K10 screen. |
 | Validates the set display content and shows it on the UNIHIKER K10 screen. |
Task 2: Optimize Note Typesetting
Code
In Task 1, the "Line" method shows note content with incomplete display and poor typesetting. Can we flexibly adjust text position and font size?
Of course yes. This is the text display block via the "Coordinate" method: cache text ("UNIHIKER") at X:(0) Y:(0) font (24*24) color() wrap(50) auto-clear(yes) . It’s long, so let’s first check its modifiable parameters.
Obviously, text content, font size and color are easy to set, but how to determine the coordinates? First check the screen coordinates of UNIHIKER K10, its screen resolution is 240*320 pixels, coordinate diagram as shown below.
Note: For more on screen coordinates, see knowledge base.
After knowing the screen coordinates, arrange all words by font size and calculate their coordinates. Take "Your friend" (24x24 font size) as an example for coordinate calculation.
Note: 24×24 represents the size of two letters.
Y-coordinate: freely select the upper height coordinate, then set as below to display "your friend" in the note.
Z-Auto Clear: for refreshing different content, overlap (No) or clear first then display (Yes).
For incomplete note content display, use separate lines to show it. As shown below:
Refer to the same coordinate calculation method to calculate and adjust the coordinates of the digital notes, see the program below.
Run the Code
Click the“Upload”button, wait for the upload to complete,then view the formatted note content.
Code Review
Category |  |
Blocks |  |
Function | Sets text display at a specific screen position, supports adjusting font size, color, max line characters and auto clear status. |
Knowledge Base
Next, let's learn and summarize the hardware knowledge used in this lesson.
In the previous practice, we learned to display text on the UNIHIKER K10 screen. How does this screen show content?
LCD Screen Display Principle
UNIHIKER K10 features a TFT-LCD display. On close observation, screen images consist of individual dots called pixels. Each pixel independently shows red, green and blue, creating rich colors via varied brightness combinations.
How does it display exactly? This involves the display principle of LCD screens. An LCD screen is mainly composed of an LED backlight layer, lower polarizer, thin-film transistor array (TFT layer), liquid crystal layer, RGB color filters, upper polarizer and glass cover plate.
The core display principle relies on polarizers transmitting light with a single oscillation direction; the upper and lower polarizers are positioned at 90°. Energized liquid crystal molecules in the liquid crystal layer alter light direction, enabling light transmission and blocking via circuit control. Specifically, white LED backlight passes through the lower polarizer, retaining light oscillating vertically. As light travels through the liquid crystal layer, the molecules rotate its oscillation direction, allowing horizontally oscillating light to pass through the upper polarizer and light up the screen. When voltage is applied to the liquid crystal layer, the molecules align under the electric field and no longer rotate light, which is then blocked by the upper polarizer, dimming the screen. Adjusting the applied voltage intensity controls light transmittance to achieve different brightness levels. Combined with RGB color filters, it produces a rich color display. The TFT layer provides independent voltage control for each pixel, delivering finer, faster-responsive images.
UNIHIKER K10 Screen Coordinates
UNIHIKER K10 has a resolution of 240×320, 240 pixels horizontally and 320 vertically. It has four screen display orientations, each with a different coordinate origin and positive directions of the X and Y axes.
The four display orientations can be adjusted via “initialize screen orientation (0)” under the “Screen” in the UNIHIKER K10 Library. The angle in the parenthesis has four options: 0, 90, 180 and 270. The corresponding diagram of specific display orientations and screen coordinates is shown below.
Challenge Task
In the previous project, we only displayed digital notes. Try using the A/B keys to switch between different note contents for display—have a go!
