Maker.io main logo

Adafruit NeoSlider

2022-06-14 | By Adafruit Industries

License: See Original Project STEMMA

Courtesy of Adafruit

Guide by Kattni Rembor

Overview

Our family of I2C-friendly user interface elements grows by one with ‎this new product that makes it plug-n-play-easy to add a 75mm long ‎slide potentiometer to any microcontroller or microcomputer with an ‎I2C port.‎

elements_1

pot_2

Each breakout is 3" long and 0.8" wide, with a single linear slide pot ‎in the center. Underneath, there are four under-lighting NeoPixels ‎that can display any RGB color. In the middle, a small microcontroller ‎takes I2C commands and converts them to analog reads (of the ‎potentiometer) and NeoPixel control. Goes great with our Stemma ‎QT rotary encoder and 1x4 NeoKey QT breakout.‎

break_3

Thanks to the Stemma QT / Qwiic connectors underneath, you can ‎easily connect using QT cables - no soldering required! There's even ‎four I2C selection jumpers that you can cut to change the address ‎from the default 0x30 to any value up to 0x3F so up to 16 slide pots ‎can all share one chained cable.‎

connector_4

To get you going fast, we spun up a custom-made PCB with the ‎seesaw chip and all supporting circuitry for 3 or 5V power and logic. ‎The STEMMA QT connectors on either side are compatible with ‎the SparkFun Qwiic I2C connectors. This allows you to make ‎solderless connections between your development board and the ‎rotary encoder or to chain them with a wide range of other sensors ‎and accessories using a compatible cable. QT Cable is not included, ‎but we have a variety in the shop.‎

pcb_5

You can use our Arduino library to control and read data with any ‎compatible microcontroller. We also have CircuitPython/Python ‎code for use with computers or single-board Linux boards.‎

Pinouts

pinouts_6

The NeoSlider has STEMMA QT connectors on it which make getting ‎started with it super simple, but it also has header pins available for ‎breadboard use. This page details the features of the NeoSlider.‎

Slide Potentiometer

slide_7

On the top of the NeoSlider is the 75mm long linear slide ‎potentiometer. It is on pin 18 of the ATtiny microcontroller.‎

NeoPixel LEDs

led_8

Along the bottom, under the slide potentiometer, are four RGB ‎NeoPixel LEDs. They are reverse-mount and attached to the bottom ‎pointed upward to shine through the board and potentiometer. They ‎are on pin 14 on the ATtiny microcontroller.‎

STEMMA QT Connectors

stemma_9

On the bottom of the board, located one-third of the way from each ‎end of the board, are two STEMMA QT connectors. These allow you ‎to connect to development boards with STEMMA QT connectors or ‎to other breakouts using various associated accessories.‎

ATtiny Microcontroller

micro_10

The NeoSlider breakout uses an ATtiny817 microcontroller to take ‎I2C commands and converts them to analog reads (of the ‎potentiometer) and for NeoPixel control.‎

Through-Hole Pads

pads_11

pads_12

In the center of the board, on each edge, are a set of six through-‎hole pads for use with header pins and a solderless breadboard. ‎They are labeled on the top and the bottom of the board for easy ‎identification.‎

When viewed from the of the top of the board:‎

  • VIN - This is the power pin. Since the chip can use 3 or 5 VDC. ‎To power the board, give it the same power as the logic level of ‎your microcontroller - e.g., for a 5V microcontroller like Arduino, ‎use 5V.

  • GND - This is the ground pin. It is the common ground for ‎power and logic.‎

  • SCL - This is the I2C clock pin. Connect to your microcontroller ‎I2C clock line. This pin can use 3-5V logic, and there's a 10K ‎pullup on this pin to VIN.

  • SDA - This is the I2C data pin. Connect to your microcontroller ‎I2C data line. This pin can use 3-5V logic, and there's a 10K ‎pullup on this pin to VIN.

  • INT - This is the interrupt pin. The Seesaw allows for setting ‎GPIO interrupts. This pin will go low when a button is pressed.‎

  • UPDI - This is the single-pin Unified Program ‎and Debug Interface for the ATtiny817. This pin is for external ‎programming or on-chip-debugging.‎

Address Jumpers

jumpers_13

In the center of the back of the board are four address jumpers. ‎These jumpers allow you to chain up to 16 of these boards on the ‎same pair of I2C clock and data pins. To do so, you cut the traces ‎between the two pads.‎

The default I2C address is 0x30. The other address options can be ‎calculated by “adding” the A0/A1/A2/A3 to the base of 0x30.‎

A0 sets the lowest bit with a value of 1, A1 sets the next bit with a ‎value of 2, A2 sets the next bit with a value of 4, and A3 sets the high ‎bit with a value of 8. The final address is 0x30 + A3 + A2 + A1 + ‎A0 which would be 0x3F.‎

  • If only A0 is cut, the address is 0x30 + 1 = 0x31

  • If only A1 is cut, the address is 0x30 + 2 = 0x32

  • If only A2 is cut, the address is 0x30 + 4 = 0x34

  • If only A3 is cut, the address is 0x30 + 8 = 0x38

So, for example if A2 is cut and A0 is cut, the address is 0x30 + 4 + 1 = ‎‎0x35.

The table below shows all possible addresses, and whether the pin ‎should be high (cut) or low (closed).‎

table_14

Power LED and Jumper

power_15

In the lower left corner, on the back of the board, is the power LED, ‎labeled on. To the left of the LED is the power LED jumper pad, ‎which defaults to closed. Cut the trace to disable the power LED. ‎Once cut, you can solder it closed again to enable the LED.‎

Python & CircuitPython

It's easy to use the NeoSlider with CircuitPython using the Adafruit ‎CircuitPython seesaw library. It allows you to write Python code to ‎read the potentiometer values and control the NeoPixel LEDs.‎

You can use the NeoSlider with any CircuitPython microcontroller ‎board or with a computer that has GPIO and Python thanks to ‎Adafruit_Blinka, our CircuitPython-for-Python compatibility library.‎

CircuitPython Microcontroller Wiring

First wire up a NeoSlider breakout to your board exactly as follows. ‎The following is the breakout wired to a Feather using the STEMMA ‎connector:‎

  • Board 3V to breakout VIN (red wire)

  • Board GND to breakout GND (black wire)

  • Board SCL to breakout SCL (yellow wire)

  • Board SDA to breakout SDA (blue wire)‎

wiring_16

The following is the breakout wired to a Feather using a solderless ‎breadboard:‎

  • Board 3V to breakout VIN (red wire)

  • Board GND to breakout GND (black wire)

  • Board SCL to breakout SCL (yellow wire)

  • Board SDA to breakout SDA (blue wire)‎

wiring_17

Python Computer Wiring

Since there's dozens of Linux computers/boards you can use we will ‎show wiring for Raspberry Pi. For other platforms, please visit the ‎guide for CircuitPython on Linux to see whether your platform is ‎supported. ‎

Here's the Raspberry Pi wired with I2C using the STEMMA connector:‎

  • Pi 3V to breakout VIN (red wire)

  • Pi GND to breakout GND (black wire)

  • Pi SCL to breakout SCL (yellow wire)

  • Pi SDA to breakout SDA (blue wire)‎

Pi_18

Here's the Raspberry Pi wired with I2C using a solderless breadboard:‎

  • Pi 3V to breakout VIN (red wire)

  • Pi GND to breakout GND (black wire)

  • Pi SCL to breakout SCL (yellow wire)

  • Pi SDA to breakout SDA (blue wire)‎

Pi_19

Python Installation of seesaw Library

You'll need to install the Adafruit_Blinka library that provides the ‎CircuitPython support in Python. This may also require enabling I2C ‎on your platform and verifying you are running Python 3. Since each ‎platform is a little different, and Linux changes often, please visit the ‎CircuitPython on Linux guide to get your computer ready!‎

Once that's done, from your command line run the following ‎command:‎

  • pip3 install adafruit-circuitpython-seesaw

If your default Python is version 3 you may need to run pip instead. ‎Just make sure you aren't trying to use CircuitPython on Python 2.x, ‎it isn't supported!‎

CircuitPython & Python Usage

To demonstrate using this breakout with CircuitPython, you'll install ‎the necessary libraries, update your code, and then connect to the ‎serial console to see the information printed out.‎

To use the NeoSlider breakout with CircuitPython, you need to first ‎install the seesaw library, and its dependencies, into the lib folder on ‎your CIRCUITPY drive.‎

Then you need to update code.py.‎

Click the Download Project Bundle button below to download the ‎necessary libraries and the code.py file in a zip file. Extract the ‎contents of the zip file and copy the entire lib folder and ‎the code.py file to your CIRCUITPY drive.‎

Download Project Bundle

Copy Code
# SPDX-FileCopyrightText: 2021 Kattni Rembor for Adafruit Industries
# SPDX-License-Identifier: MIT
"""
NeoSlider NeoPixel Rainbow Demo
"""
import board
from rainbowio import colorwheel
from adafruit_seesaw.seesaw import Seesaw
from adafruit_seesaw.analoginput import AnalogInput
from adafruit_seesaw import neopixel

# NeoSlider Setup
neoslider = Seesaw(board.I2C(), 0x30)
potentiometer = AnalogInput(neoslider, 18)
pixels = neopixel.NeoPixel(neoslider, 14, 4)


def potentiometer_to_color(value):
    """Scale the potentiometer values (0-1023) to the colorwheel values (0-255)."""
    return value / 1023 * 255


while True:
    print(potentiometer.value)
    # Fill the pixels a color based on the position of the potentiometer.
    pixels.fill(colorwheel(potentiometer_to_color(potentiometer.value)))

View on GitHub

slider_20

Now, connect to the serial console to see the potentiometer values ‎printed out. Try moving the potentiometer slider to see the values ‎change, and the NeoPixels change color!‎

That's all there is to using the NeoSlider with CircuitPython to read ‎potentiometer values and control the built-in NeoPixels!‎

Arduino

The Adafruit NeoSlider uses a seesaw chip. To use the NeoSlider with ‎Arduino, you'll use the Adafruit Seesaw library. With the STEMMA QT ‎connectors, you can easily get started with no soldering necessary!‎

I2C Wiring

Here is how to wire up the breakout using one of the STEMMA ‎QT connectors. The examples show a Metro, but wiring will work the ‎same for an Arduino or other compatible board.‎

  • Connect board VIN (red wire) to Arduino 5V if you are running ‎a 5V board Arduino (Uno, etc.). If your board is 3V, connect to ‎that instead.

  • Connect board GND (black wire) to Arduino GND

  • Connect board SCL (yellow wire) to Arduino SCL

  • Connect board SDA (blue wire) to Arduino SDA

metro_21

Here is how to wire the breakout to a board using a solderless ‎breadboard. To do this, you must solder header pins to the breakout.‎

  • Connect board VIN (red wire) to Arduino 5V if you are running ‎a 5V board Arduino (Uno, etc.). If your board is 3V, connect to ‎that instead.

  • Connect board GND (black wire) to Arduino GND

  • Connect board SCL (yellow wire) to Arduino SCL

  • Connect board SDA (blue wire) to Arduino SDA

metro_22

Library Installation

You can install the Adafruit Seesaw library for Arduino using the ‎Library Manager in the Arduino IDE.‎

library_23

Click the Manage Libraries ... menu item, search for seesaw, and ‎select the Adafruit seesaw library:‎

manage_24

When asked to install the Adafruit Seesaw library dependencies, ‎click Install all.‎

install_25

Load Single NeoSlider Example

Open the following example into the Arduino IDE.‎

Download Project Bundle

Copy Code
// SPDX-FileCopyrightText: 2021 Kattni Rembor for Adafruit Industries
// SPDX-License-Identifier: MIT
/*
 * This example shows how read the potentiometer on the I2C QT Slide Potentiometer
 * and make the NeoPixels change too!
 */

#include "Adafruit_seesaw.h"
#include <seesaw_neopixel.h>

#define  DEFAULT_I2C_ADDR 0x30
#define  ANALOGIN   18
#define  NEOPIXELOUT 14

Adafruit_seesaw seesaw;
seesaw_NeoPixel pixels = seesaw_NeoPixel(4, NEOPIXELOUT, NEO_GRB + NEO_KHZ800);

void setup() {
  Serial.begin(115200);

  //while (!Serial) delay(10);   // wait until serial port is opened

  Serial.println(F("Adafruit PID 5295 I2C QT Slide Potentiometer test!"));

  if (!seesaw.begin(DEFAULT_I2C_ADDR)) {
    Serial.println(F("seesaw not found!"));
    while(1) delay(10);
  }

  uint16_t pid;
  uint8_t year, mon, day;

  seesaw.getProdDatecode(&pid, &year, &mon, &day);
  Serial.print("seesaw found PID: ");
  Serial.print(pid);
  Serial.print(" datecode: ");
  Serial.print(2000+year); Serial.print("/");
  Serial.print(mon); Serial.print("/");
  Serial.println(day);

  if (pid != 5295) {
    Serial.println(F("Wrong seesaw PID"));
    while (1) delay(10);
  }

  if (!pixels.begin(DEFAULT_I2C_ADDR)){
    Serial.println("seesaw pixels not found!");
    while(1) delay(10);
  }

  Serial.println(F("seesaw started OK!"));

  pixels.setBrightness(255);  // half bright
  pixels.show(); // Initialize all pixels to 'off'
}



void loop() {
  // read the potentiometer
  uint16_t slide_val = seesaw.analogRead(ANALOGIN);
  Serial.println(slide_val);

  for (uint8_t i=0; i< pixels.numPixels(); i++) {
    pixels.setPixelColor(i, Wheel(slide_val / 4));
  }
  pixels.show();

  delay(50);
}



// Input a value 0 to 255 to get a color value.
// The colours are a transition r - g - b - back to r.
uint32_t Wheel(byte WheelPos) {
  WheelPos = 255 - WheelPos;
  if(WheelPos < 85) {
    return seesaw_NeoPixel::Color(255 - WheelPos * 3, 0, WheelPos * 3);
  }
  if(WheelPos < 170) {
    WheelPos -= 85;
    return seesaw_NeoPixel::Color(0, WheelPos * 3, 255 - WheelPos * 3);
  }
  WheelPos -= 170;
  return seesaw_NeoPixel::Color(WheelPos * 3, 255 - WheelPos * 3, 0);
}

View on GitHub

After opening the NeoSlider.ino file, upload it to the Arduino wired to ‎your NeoSlider. Open the Serial Monitor at 115200 baud. You should ‎see the following as the sketch starts up.‎

open_26

Now try moving the potentiometer to see the values change and the ‎NeoPixels change color.‎

moving_27

That's all there is to using the NeoSlider with Arduino!‎

Dual NeoSlider Example

The Adafruit NeoSlider comes with two STEMMA QT connectors, ‎making it super simple to chain up multiple sliders.‎

Dual I2C Wiring

Here is how to wire up two breakouts using two of the STEMMA ‎QT connectors. The examples show a Metro, but wiring will work the ‎same for an Arduino or other compatible board.‎

  • Board 1 VIN (red wire) to Arduino 5V

  • Board 1 GND (black wire) to Arduino GND

  • Board 1 SCL (yellow wire) to Arduino SCL

  • Board 1 SDA (blue wire) to Arduino SDA

  • Board 2 VIN (red wire) to board 1 VIN

  • Board 2 GND (black wire) to board 1 GND

  • Board 2 SCL (yellow wire) to board 1 SCL

  • Board 2 SDA (blue wire) to board 1 SDA

dual_28

Cut the A0 address trace on *one* of the sliders so that the I2C ‎addresses don't conflict

Load Dual NeoSlider Example

Open the following example into the Arduino IDE. ‎

Download Project Bundle

Copy Code
// SPDX-FileCopyrightText: 2021 Kattni Rembor for Adafruit Industries
// SPDX-License-Identifier: MIT
/*
 * This example shows how read the potentiometer on two I2C QT Slide Potentiometers
 * and make the NeoPixels change too!
 */

#include "Adafruit_seesaw.h"
#include <seesaw_neopixel.h>

#define  DEFAULT_I2C_ADDR 0x30
#define  ANALOGIN   18
#define  NEOPIXELOUT 14

Adafruit_seesaw seesaw1;
Adafruit_seesaw seesaw2;
seesaw_NeoPixel pixels1 = seesaw_NeoPixel(4, NEOPIXELOUT, NEO_GRB + NEO_KHZ800);
seesaw_NeoPixel pixels2 = seesaw_NeoPixel(4, NEOPIXELOUT, NEO_GRB + NEO_KHZ800);

void setup() {
  Serial.begin(115200);

  //while (!Serial) delay(10);   // wait until serial port is opened

  Serial.println(F("Adafruit PID 5295 I2C QT Slide Potentiometer test!"));

  if (!seesaw1.begin(DEFAULT_I2C_ADDR) || !seesaw2.begin(DEFAULT_I2C_ADDR+1)) {
    Serial.println(F("seesaws not found!"));
    while(1) delay(10);
  }

  uint16_t pid;
  uint8_t year, mon, day;

  seesaw1.getProdDatecode(&pid, &year, &mon, &day);
  Serial.print("seesaw found PID: ");
  Serial.print(pid);
  Serial.print(" datecode: ");
  Serial.print(2000+year); Serial.print("/");
  Serial.print(mon); Serial.print("/");
  Serial.println(day);

  if (pid != 5295) {
    Serial.println(F("Wrong seesaw PID"));
    while (1) delay(10);
  }

  if (!pixels1.begin(DEFAULT_I2C_ADDR) || !pixels2.begin(DEFAULT_I2C_ADDR+1)){
    Serial.println("seesaw pixels not found!");
    while(1) delay(10);
  }

  Serial.println(F("seesaw started OK!"));

  pixels1.setBrightness(255);  // half bright
  pixels2.setBrightness(255);  // half bright
  pixels1.show(); // Initialize all pixels to 'off'
  pixels2.show(); // Initialize all pixels to 'off'
}



void loop() {
  // read the potentiometer
  uint16_t slide1_val = seesaw1.analogRead(ANALOGIN);
  uint16_t slide2_val = seesaw2.analogRead(ANALOGIN);
  Serial.print(slide1_val);
  Serial.print(", ");
  Serial.println(slide2_val);

  for (uint8_t i=0; i< pixels1.numPixels(); i++) {
    pixels1.setPixelColor(i, Wheel(slide1_val / 4));
    pixels2.setPixelColor(i, Wheel(slide2_val / 4));
  }
  pixels1.show();
  pixels2.show();

  delay(50);
}



// Input a value 0 to 255 to get a color value.
// The colours are a transition r - g - b - back to r.
uint32_t Wheel(byte WheelPos) {
  WheelPos = 255 - WheelPos;
  if(WheelPos < 85) {
    return seesaw_NeoPixel::Color(255 - WheelPos * 3, 0, WheelPos * 3);
  }
  if(WheelPos < 170) {
    WheelPos -= 85;
    return seesaw_NeoPixel::Color(0, WheelPos * 3, 255 - WheelPos * 3);
  }
  WheelPos -= 170;
  return seesaw_NeoPixel::Color(WheelPos * 3, 255 - WheelPos * 3, 0);
}

View on GitHub

After opening the Arduino_NeoSlider_Dual file, upload it to the ‎Arduino wired to your NeoSlider. Open the Serial Monitor at 115200 ‎baud to see the potentiometer values printed out.‎

file_29

Try moving the sliders to see the values and the NeoPixel colors ‎change.‎

That's all there is to using two NeoSliders with Arduino!‎

Downloads

Files

Schematic and Fab Print

Schematic_30

FabPrint_31

制造商零件编号 4991
ADAFRUIT I2C QT ROTARY ENCODER W
Adafruit Industries LLC
制造商零件编号 4980
NEOKEY 1X4 QT I2C - FOUR MECHANI
Adafruit Industries LLC
制造商零件编号 5295
STEMMA QT NEOSLIDER I2C QT SLIDE
Adafruit Industries LLC
制造商零件编号 4399
STEMMA QWIIC JST SH CABLE 50MM
Adafruit Industries LLC
Add all DigiKey Parts to Cart
TechForum

Have questions or comments? Continue the conversation on TechForum, DigiKey's online community and technical resource.

Visit TechForum