30 min

Deliver clear and efficient data representation with TLC59283 and PIC18F4610

Visualize data with ease!

BarGraph 4 Click with Curiosity HPC

Published Nov 01, 2023

Click board™

BarGraph 4 Click

Development board

Curiosity HPC


NECTO Studio



Captivate your audience with dynamic, attention-grabbing green bar graph that provide real-time insights and keep users engaged



Hardware Overview

How does it work?

BarGraph 4 Click is based on the TLC59283, a 16-channel, constant-current sink light-emitting diode (LED) driver from Texas Instruments. Each channel can be individually controlled with a simple serial communications protocol compatible with 3.3V or 5V logic levels, depending on the operating VCC. It also comes with a constant-current value of all 16 channels, determined by an external resistor R2 with a value of 2.2kΩ, limiting the current to 24mA. You can find the exact value of the current per channel, as well as the corresponding resistance value for a given current, in the attached datasheet. In the upper part on the front side of the board, marked with the characters A, B, C, and D, four green four-segment LED bar graph displays, the HLMP-2550 are placed. The Green HLMP-2500 series LEDs use

a liquid phase GaPepitaxial layer on a GaP substrate. These light bars are designed for various applications requiring a large bright light source, making this Click board™ suitable for creating different VU meters, status indicators, counters, and similar devices. The TLC59283 communicates with MCU using the standard SPI serial interface with a maximum frequency of 35MHz. It has a 16-bit shift register and an output ON/OFF data latch. Both shift register and data latch are 16 bits long and used to turn the constant-current outputs on and off. It also comes with one GPIO pin, routed on the RST pin of the mikroBUS™ socket, used to turn off all outputs during Power-On and output data latching to prevent unwanted image displays during these times. When the device is powered on, the data in the 16-bit shift register and output

on or off data latch are not set to default values. Therefore, the output ON/PFF data must be written to the data latch before turning the constant-current output ON. The RST pin should be high when powered on because the constant current may be turned ON due to random data in the output on or off data latch. This Click board™ can operate with either 3.3V or 5V logic voltage levels selected via the VCC SEL jumper. This way, both 3.3V and 5V capable MCUs can use the communication lines properly. Also, this Click board™ comes equipped with a library containing easy-to-use functions and an example code that can be used as a reference for further development.

BarGraph 4 Click top side image
BarGraph 4 Click bottom side image

Features overview

Development board

Curiosity HPC, standing for Curiosity High Pin Count (HPC) development board, supports 28- and 40-pin 8-bit PIC MCUs specially designed by Microchip for the needs of rapid development of embedded applications. This board has two unique PDIP sockets, surrounded by dual-row expansion headers, allowing connectivity to all pins on the populated PIC MCUs. It also contains a powerful onboard PICkit™ (PKOB), eliminating the need for an external programming/debugging tool, two mikroBUS™ sockets for Click board™ connectivity, a USB connector, a set of indicator LEDs, push button switches and a variable potentiometer. All

these features allow you to combine the strength of Microchip and Mikroe and create custom electronic solutions more efficiently than ever. Each part of the Curiosity HPC development board contains the components necessary for the most efficient operation of the same board. An integrated onboard PICkit™ (PKOB) allows low-voltage programming and in-circuit debugging for all supported devices. When used with the MPLAB® X Integrated Development Environment (IDE, version 3.0 or higher) or MPLAB® Xpress IDE, in-circuit debugging allows users to run, modify, and troubleshoot their custom software and hardware

quickly without the need for additional debugging tools. Besides, it includes a clean and regulated power supply block for the development board via the USB Micro-B connector, alongside all communication methods that mikroBUS™ itself supports. Curiosity HPC development board allows you to create a new application in just a few steps. Natively supported by Microchip software tools, it covers many aspects of prototyping thanks to many number of different Click boards™ (over a thousand boards), the number of which is growing daily.

Curiosity HPC double image

Microcontroller Overview

MCU Card / MCU




MCU Memory (KB)


Silicon Vendor


Pin count


RAM (Bytes)


Used MCU Pins

mikroBUS™ mapper

Output Channels Force-OFF
SPI Chip Select
SPI Clock
Power Supply
Power Supply

Take a closer look


BarGraph 4 Click Schematic schematic

Step by step

Project assembly

Curiosity HPC front no-mcu image hardware assembly

Start by selecting your development board and Click board™. Begin with the Curiosity HPC as your development board.

Curiosity HPC front no-mcu image hardware assembly
Thermo 28 Click front image hardware assembly
MCU DIP 40 hardware assembly
Prog-cut hardware assembly
Curiosity HPC MB 1 - upright/with-background hardware assembly
Necto image step 2 hardware assembly
Necto image step 3 hardware assembly
Necto image step 4 hardware assembly
Necto image step 5 hardware assembly
Necto image step 6 hardware assembly
Necto DIP image step 7 hardware assembly
Necto No Display image step 8 hardware assembly
Necto image step 9 hardware assembly
Necto image step 10 hardware assembly
Debug Image Necto Step hardware assembly

Track your results in real time

Application Output

After loading the code example, pressing the "DEBUG" button builds and programs it on the selected setup.

Application Output Step 1

After programming is completed, a header with buttons for various actions available in the IDE appears. By clicking the green "PLAY "button, we start reading the results achieved with Click board™.

Application Output Step 3

Upon completion of programming, the Application Output tab is automatically opened, where the achieved result can be read. In case of an inability to perform the Debug function, check if a proper connection between the MCU used by the setup and the CODEGRIP programmer has been established. A detailed explanation of the CODEGRIP-board connection can be found in the CODEGRIP User Manual. Please find it in the RESOURCES section.

Application Output Step 4

Software Support

Library Description

This library contains API for BarGraph 4 Click driver.

Key functions:

  • bargraph4_enable_output - This function enables all outputs

  • bargraph4_set_output - This function sets all outputs to desired value by using SPI serial interface

  • bargraph4_set_channel_level - This function sets the level of a desired bar graph channel.

Open Source

Code example

This example can be found in NECTO Studio. Feel free to download the code, or you can copy the code below.

 * @file main.c
 * @brief BarGraph4 Click example
 * # Description
 * This example demonstrates the use of BarGraph 4 click board.
 * The demo application is composed of two sections :
 * ## Application Init
 * Initializes the driver and enables output.
 * ## Application Task
 * Changes the level of all bar graph channels every second.
 * The channels level will be logged on the USB UART.
 * @author Stefan Filipovic

#include "board.h"
#include "log.h"
#include "bargraph4.h"

static bargraph4_t bargraph4;
static log_t logger;

void application_init ( void )
    log_cfg_t log_cfg;              /**< Logger config object. */
    bargraph4_cfg_t bargraph4_cfg;  /**< Click config object. */

     * Logger initialization.
     * Default baud rate: 115200
     * Default log level: LOG_LEVEL_DEBUG
     * @note If USB_UART_RX and USB_UART_TX 
     * are defined as HAL_PIN_NC, you will 
     * need to define them manually for log to work. 
     * See @b LOG_MAP_USB_UART macro definition for detailed explanation.
    LOG_MAP_USB_UART( log_cfg );
    log_init( &logger, &log_cfg );
    Delay_ms( 100 );
    log_info( &logger, " Application Init " );

    // Click initialization.

    bargraph4_cfg_setup( &bargraph4_cfg );
    BARGRAPH4_MAP_MIKROBUS( bargraph4_cfg, MIKROBUS_1 );
    err_t init_flag  = bargraph4_init( &bargraph4, &bargraph4_cfg );
    if ( SPI_MASTER_ERROR == init_flag )
        log_error( &logger, " Application Init Error. " );
        log_info( &logger, " Please, run program again... " );

        for ( ; ; );

    bargraph4_enable_output( &bargraph4 );
    log_info( &logger, " Application Task " );

void application_task ( void )
    for ( bargraph4_level_t cnt = BARGRAPH4_LEVEL_0; cnt <= BARGRAPH4_LEVEL_4; cnt++ )
        bargraph4_set_channel_level( &bargraph4, BARGRAPH4_CHANNEL_A, cnt );
        bargraph4_set_channel_level( &bargraph4, BARGRAPH4_CHANNEL_B, cnt );
        bargraph4_set_channel_level( &bargraph4, BARGRAPH4_CHANNEL_C, cnt );
        bargraph4_set_channel_level( &bargraph4, BARGRAPH4_CHANNEL_D, cnt );
        log_printf( &logger, " All channels set to level %u\r\n\n", ( uint16_t ) cnt );
        Delay_ms( 1000 );

void main ( void )
    application_init( );

    for ( ; ; )
        application_task( );

// ------------------------------------------------------------------------ END

Additional Support