1 Finished product effect display

Bilibili video: [Open Source] Mini pixel lamp, four modes, multiple styles ~ light up your desktop! Web control ~ customizable content ~

2 Hardware aspects

2.1 Use of hardware for this project

The hardware schematic diagram, PCB diagram and BOM are shown at the end of the article. The completed welding effect is shown in the figure below.

The 3D printed model of the shell is in the attachment. The effect after installing the shell is as follows.

2.2 Using development board hardware

In order to make the pixel lamp smaller in size, smaller WS2812B-2020 phantom lamp beads are used, which also increases the difficulty of welding. If you do not pursue small size and compact structure, you can also directly build the hardware with the esp8266 development board and 8x8 full-color pixel screen. Just connect the following 3 places with Dupont wire:

3 Software aspects

3.1 Development tools

This project is developed using Arduino and requires the installation of Arduino's ESP8266 support. If it is not installed, please find the relevant information and install it yourself.

3.2 Arduino library

Use the Arduino Library management tool to install the following five dependent libraries:

ArduinoJson

FastLED

Time

WebSockets

WiFiManager

3.3 Program compilation and download

1. Download the program in the attachment and use arduino to open the .ino file with the same name in the folder;

2. Select the development board as Generic ESP8266 Module and select the corresponding port;

3. Click Download. If you use the hardware of this project, when the compilation is completed and the download is completed, you need to click the RST button (before the underline appears) when the screen displays Connecting... to download.

3.4 Firmware burning download

If you do not want to compile and download through Arduino, you can also burn and download the firmware. The steps are as follows:

1. Download the burning tool esptool

Address：https://www.espressif.com.cn/zh-hans/support/download/other-tools

2. Open esptool and select the following:

3. Download the firmware in the attachment, select and check the firmware in esptool, and the burning address is 0x0.

4. Connect the development board, select the corresponding serial port, click the ERASE button first, click START to download after the erasure is successful, and wait until the burning is successful. (The hardware of this project needs to press the RST key to enter the download)

4 Function implementation

4.1 YuePixel folder description

1. The YuePixel_x.xxino file with the same name as the folder is the file where the main program is located (xxx is the version number).

2. The Config.h file is a configuration file, including reference libraries, configuration parameters, global variables, function definitions, etc.

3. AnimationPage.ino, ClockPage.ino, Character.ino, Pic.ino, and ShowPage.ino files are the files for animation, clock, text display, picture display, and IP scrolling display functions respectively.

4. Function.ino is the implementation of some common basic functions; NTP.ino is the implementation of time-related functions obtained through NTP; WebServer.ino is the implementation of the network configuration interface function.

5.Cnfont.h, Pixfont.h, Image.h, and MyPalette.h contain data related to Chinese fonts, English fonts, pictures, and palettes.

4.2 Overall framework description

The overall framework and development ideas of the project are shown in the figure above.

1. ESP8266 is an IoT chip. In this project, the pixel lights are first connected to the Internet to facilitate the development of subsequent functions. The ESP8266 third-party library used here: WiFiManager library . It can quickly and easily realize the distribution network of the equipment through the web page. Relevant information can be found on GitHub: https://github.com/tzapu/WiFiManager

The lamp beads in this project use the WS2812B model, and the color brightness of the lamp beads can be controlled through the FastLED library . By writing relevant programs, it can be adapted to matrix control and can realize display functions such as patterns, characters, and dynamic images.

2. There are no buttons set on the project hardware. Since ESP8266 can be used as a server, the ESP8266WebServer library is used and the corresponding HTML code is written to realize web page control. Switching between web pages is implemented through the POST method, and the web page configuration results are sent back to the device through WebSocket. In the process, the WebSocketsServer library is used to obtain data. In the advanced configuration interface, there are many types of data that need to be returned, so it is stored in JSON format. After receiving the data, the ArduinoJson library is used to parse the advanced configuration information.

3. In order for the pixel lamp to perform the clock display function, the time needs to be obtained. Since the clock module is not added to the hardware, the time needs to be obtained through the network after being connected to the Internet. This is based on the WiFiUdp library to get the time through NTP. After obtaining the time, synchronize the time to the local computer through the Time library to implement subsequent clock display functions.

4. In order to realize web page processing and pixel light display running at the same time in the program, the Ticker library is used to realize multi-tasking processing. In the program, in order to save RAM space, character fonts and web pages are put into flash memory through the PROGMEM function.

5 Daily use

5.1 WiFi connection

This project uses the WiFiManager library to implement web configuration. If it is used for the first time, after powering on, connect to the network named YuePixel in WiFi. After the connection is successful, it will automatically jump to the network configuration interface. Click Configure in the network configuration interface. WiFi, select WiFi on the page and fill in the password. After saving, the device will automatically connect to WiFi. After the first network configuration, the corresponding WiFi configuration will be saved, and there is no need to configure the network again under the same network in the future.

5.2 Log in to the web configuration interface

When the pixel lamp is successfully connected to the Internet, the IP address of the pixel lamp under the LAN will be displayed. Use other devices under the same LAN (such as computers, mobile phones), etc., enter the IP address in the browser and jump to enter the configuration. interface.

5.3 Display content configuration

For the content and configuration of each mode, you can watch the video of Bilibili:

[Open Source] Mini pixel lamp, four modes, multiple styles ~ light up your desktop! Web control ~ customizable content ~

6 Other matters

6.1 Arrangement of pixel lights

The hardware lamp beads of this project are arranged in a snake-shaped arrangement. If you purchase pixel screen construction hardware and the pixel screen is not arranged in a snake-shaped arrangement, you need to set kMatrixSerpentineLayout to false in the config.h of the program to display it normally.

6.2 Display mirror solution

If the displayed result is a mirror image, you can modify it in the source program. Add a line x=7-x at the beginning of the XY function in Function.ino;

6.3 Battery powered

The hardware of this project does not have a switch, so it will always be on when using battery power.

6.4 Web program

Attachments are visible to web programs.