طراحی رابط کاربری برای LED نئوپیکسل با شیلد TFT LCD و برد آردوینو

کنترل هرچه هوشمند تر و آسان تر نئوپیکسل ها همواره جالب و چالش برانگیز بوده، در گذشته آموزش هایی منتشر کردم که به روش های مختلفی اقدام به کنترل نئوپیکسل های ws2812 می‌کردیم مانند کنترل این led های پرقدرت و جالب با استفاده وب‌سرور ها، در این آموزش قصد دارم به شما آموزش کنترل این نئوپیکسل ها با استفاده از tft lcd را بدهم، تا در کمترین زمان ممکن قادر به کنترل و تغییر وضعیت آن ها باشید. در این آموزش تنها با لمس المان های به نمایش درآمده در نمایشگر کنترل کامل را خواهید داشت. در ادامه پروژه رابط کاربری برای LED با مرجع تخصصی آردوینو به زبان فارسی، دیجی اسپارک همراه باشید.

نمایشگر TFT LCD تاچ

TFT مخفف “Thin Film Transistor” است. صفحه نمایش TFT LCD رنگی، دارای ترانزیستورهایی است که از فیلمهای نازک سیلیکون آمورف روی شیشه رسوب کرده اند. این به عنوان یک شیر کنترل برای ایجاد ولتاژ مناسب بر روی کریستال های مایع برای زیر پیکسل های جداگانه عمل می کند. به همین دلیل صفحه نمایش TFT LCD را نمایشگر Active Matrix نیز می نامند. نمایشگرهای TFT همگی دارای درجه صنعتی بوده و برای کاربردهایی مانند ترمینال های فضای باز، اتومات پارکینگ، دستگاه POS، اتوماسیون، کیوسک پرداخت، تجهیزات پزشکی و موارد دیگر قابل استفاده هستند.

برد آردوینو Arduino

مجموعه بردهای آردوینو از جمله بردهای توسعه پرطرفدار بین مهندسین امبدد هستند که در مدل های مختلفی از جمله Micro , proMini , Nano , Uno و همچنین Mega قابل تهیه هستند، هسته مرکزی این برد های محبوب از سری AtMega328 می باشد. آردوینو پلتفرم سخت‌افزاری و نرم‌افزاری متن‌باز است. همان طور که قبل تر اشاره کردیم، پلتفرم آردوینو شامل یک میکروکنترلر تک‌بردی متن‌باز است که قسمت سخت‌افزار آردوینو را تشکیل می‌دهد. علاوه بر این، پلتفرم آردوینو یک نرم‌افزار آردوینو IDE که به منظور برنامه‌نویسی برای بردهای آردوینو طراحی شده‌است و یک بوت لودر نرم‌افزاری که بر روی میکروکنترلر بارگذاری می‌شود را در بر می‌گیرد.

روش کار پروژه طراحی رابط کاربری

در این پروژه از نمایشگر لمسی tft به عنوان رابط کاربری برای LED کنترل مستقیم نئوپیکسل ها استفاده خواهیم کرد. برای سهولت در اجرای پروژه من از شیلد tft برای آردوینو و همچنین آردوینو مگا استفاده کردم تا از اتصالات اضافه جلوگیری کنم و در عین حال به کمک آردوینو مگا پین های بیشتری پس از نصب tft بر روی آردوینو در دسترس داشته باشم.

وسایل مورد نیاز

برد آردوینو Arduino

شیلد نمایشگر tft lcd

نئوپیکسل

کتابخانه های مورد نیاز

برای اجرای پروژه کنترل بی سیم ال ای دی ابتدا در نرم افزار Arduino IDE اقدام به نصب کتابخانه مرجع Adafruit_NeoPixel می پردازیم. مراحل زیر را دنبال کنید.

این مسیر را دنبال کنید Sketch > Include Library > Manage Libraries
کلمه Adafruit_NeoPixel را جستجو کنید.
کتابخانه را نصب کنید.

برای دریافت کتابخانه های دیگر به Github من مراجعه کنید.

اتصالات پروژه طراحی رابط کاربری

همان طور که قبل نر ذکر کردم در این پروژه از شیلد آردوینو TFT Lcd استفاده خواهیم کرد، به همین دلیل اتصالات اضافی با سیم کاهش می‌یابد، تنها با قرار دادن TFT بر روی آردوینو این بخش از اتصالات به پایان می‌رسد. در ادامه باید اتصالات نئوپیکسل را برقرار کنیم، نئوپیکسل ها دارای سه پین هستند، دو مورد مربوط به تغذیه نئوپیکسل و مورد آخر مربوط به وروردی و خروجی دیتا به نئوپیکسل ها است. برای این مورد من از آردوینو مگا استفاده کردم تا پین های بیشتری در دسترس داشته باشم. در این پروژه برای ورودی دیتا از پین ۲۱ در آردوینو مگا استفاده کردم، می‌توانید در کد با توجه به نیاز خود این مورد را تغییر دهید.

برای اتصال نئوپیکسل ها به یکدیگر می‌توانید از الگوی زیر استفاده کنید.

کد های پروژه طراحی رابط کاربری

پس از فراخوانی کتابخانه ها و برقراری اتصالات نوبت به کد پروژه می‌رسد، در بخش پایین موارد قابل تنظیم برای نئوپیکسل ها وجود دارند، در خط اول پین ورودی دیتا را مشخص می‌کنیم. خط دوم مربوط به تعداد نئوپیکسل های مورد استفاده است و در نهایت خط سوم شدت روشنایی نئوپیکسل ها مشخص می‌کند.

#define PIN 21
#define NUM_LEDS 165
#define BRIGHTNESS 100

این نمایشگر tft تمام رنگ است به همین دلیل به عنوان رابط کاربری برای LED استفاده شده، در کد های زیر رنگ هایی که نیاز به استفاده از آن ها را داریم تعریف می‌کنیم.

#define  BLACK  0x0000
#define BLUE    0x001F
#define RED     0xF800
#define GREEN   0x07E0
#define CYAN    0x07FF
#define MAGENTA 0xF81F
#define YELLOW  0xFFE0
#define WHITE   0xFFFF

پس تعریف کلید های مجازی لمسی در بخش زیر اقدام برقراری شرط در صورت تاچ سوییچ خواهیم کرد.

    switch  (b) {
    case BUTTON_Red:
        EmitPink();
        showCalibration();
      break;

کد کامل پروژه طراحی رابط کاربری برای LED نئوپیکسل ها با استفاده از TFT LCD

#include <Adafruit_NeoPixel.h>
#include <math.h>

#include <SPFD5408_Adafruit_GFX.h>    
#include <SPFD5408_Adafruit_TFTLCD.h> 
#include <SPFD5408_TouchScreen.h>


#if defined(__SAM3X8E__)
#undef __FlashStringHelper::F(string_literal)
#define F(string_literal) string_literal
#endif

#define YP A3  
#define XM A2  
#define YM 9   
#define XP 8  

#define PIN 21
#define NUM_LEDS 165
#define BRIGHTNESS 100

#define TS_MINX 150
#define TS_MINY 120
#define TS_MAXX 920
#define TS_MAXY 940

TouchScreen ts = TouchScreen(XP, YP, XM, YM, 300);

#define LCD_CS A3
#define LCD_CD A2
#define LCD_WR A1
#define LCD_RD A0

#define LCD_RESET A4

#define  BLACK  0x0000
#define BLUE    0x001F
#define RED     0xF800
#define GREEN   0x07E0
#define CYAN    0x07FF
#define MAGENTA 0xF81F
#define YELLOW  0xFFE0
#define WHITE   0xFFFF

void  EmitCyan();
void  EmitWhite();
void  EmitGreen();
void  EmitYellow();
void  EmitPink();
void  EmitBlack();

uint16_t width = 0;
uint16_t height = 0;
uint16_t x = 40;
uint16_t y = height - 20;
uint16_t w = 75;
uint16_t h = 20;

Adafruit_TFTLCD tft(LCD_CS, LCD_CD, LCD_WR, LCD_RD, LCD_RESET);

Adafruit_NeoPixel strip = Adafruit_NeoPixel(NUM_LEDS, PIN, NEO_GRB + NEO_KHZ800);

#define BOXSIZE 40
#define PENRADIUS 3
#define BUTTONS 9
#define BUTTON_Red 0
#define BUTTON_DarkRed 1
#define BUTTON_RED 2
#define BUTTON_DarkGreen 3
#define BUTTON_DeepRed 4
#define BUTTON_Blue 5
#define BUTTON_LightBlue 6
#define BUTTON_LightBlue1 7

Adafruit_GFX_Button buttons[BUTTONS];

uint16_t buttons_y = 0;
#define MINPRESSURE 10
#define MAXPRESSURE 1000

void setup() {
  
  Serial.begin(9600);
  Serial.println(F("Paint!"));
  tft.reset();
  tft.begin(0x9341); // SDFP5408
  strip.begin();
  strip.show(); 
  tft.setRotation(0); 
  tft.fillScreen(BLACK);
  tft.setCursor (40, 20);
  tft.setTextSize (3);
  tft.setTextColor(WHITE);
  tft.println("CiferTech");
  tft.setCursor (65, 85);
  width = tft.width() - 1;
  height = tft.height() - 100;
  initializeButtons();
  showCalibration();
}

void loop() {
  
  int i = 0;
  TSPoint p;
  
  digitalWrite(13, HIGH);
  p = waitOneTouch();
  digitalWrite(13, LOW);
  p.x = mapXValue(p);
  p.y = mapYValue(p);

  for (uint8_t b = 0; b <BUTTONS; b++) {

    if (buttons[b].contains(p.x, p.y)) {

    switch  (b) {
    case BUTTON_Red:
        EmitPink();
        showCalibration();
      break;

    case BUTTON_DarkRed:
        EmitCyan();
        showCalibration();
      break;
      
    case BUTTON_RED:
        EmitBlack();
        showCalibration();
      break;
      
    case BUTTON_DarkGreen:
        EmitGreen();
        showCalibration();
      break;
 
    case BUTTON_Blue:
       EmitBlue();
       showCalibration();
      break;
      
    case BUTTON_LightBlue:     
       EmitYellow();
       showCalibration();    
      break;
      
    case BUTTON_DeepRed:    
       EmitDeepRed();       
       showCalibration();         
      break;
    }
  }
}
}
void initializeButtons() {

  uint16_t x = 40;
  uint16_t y = height - 20;
  uint16_t w = 75;
  uint16_t h = 40;
  uint8_t spacing_x = 5;
  uint8_t textSize = 2;

  char buttonlabels[7][20] = {"", "", "", "", "", "", ""};
  uint16_t buttoncolors[15] = {MAGENTA, CYAN, WHITE, GREEN, RED, BLUE, YELLOW};

  for (uint8_t b = 0; b < 9; b++) {
    if (b < 3)
    {
      buttons[b].initButton(&tft,           
       x + b * (w + spacing_x), y,           
       w, h, BLACK, buttoncolors[b], WHITE,  
       buttonlabels[b], textSize);
      Serial.print(  h);
      
    }// text
    if (b == 3)
    {
      uint16_t x = 40;
      uint16_t y = height + 30 ;
      uint16_t w = 75;
      uint16_t h = 40;

      buttons[b].initButton(&tft,          
      x + 0 * (w + spacing_x) , y,          
      w, h, BLACK, buttoncolors[b], WHITE,  
      buttonlabels[b], textSize);
    }
    if (b == 4)
    {
      uint16_t x = 40;
      uint16_t y = height + 30 ;
      uint16_t w = 75;
      uint16_t h = 40;

      buttons[b].initButton(&tft,             
        x + 1 * (w + spacing_x) , y,         
        w, h, BLACK, buttoncolors[b], WHITE,  
        buttonlabels[b], textSize);
    }
    if (b == 5)
    {
      uint16_t x = 40;
      uint16_t y = height + 30 ;
      uint16_t w = 75;
      uint16_t h = 40;

      buttons[b].initButton(&tft,           
       x + 2 * (w + spacing_x) , y,         
       w, h, BLACK, buttoncolors[b], WHITE, 
       buttonlabels[b], textSize);
    }
    if (b == 6)
    {
      uint16_t x = 120;
      uint16_t y = height + 80 ;
      uint16_t w = 230;
      uint16_t h = 40;

      buttons[b].initButton(&tft,           
       x + 0 * (w + spacing_x) , y,         
       w, h,BLACK, buttoncolors[b], WHITE,  
       buttonlabels[b], textSize);
    }
    if (b == 7)
    {
      uint16_t x = 1000;
      uint16_t y = 1000 ;
      uint16_t w = 0;
      uint16_t h = 0;
      buttons[b].initButton(&tft,           
       x + 2 * (w + spacing_x) , y,         
       w, h,BLACK, buttoncolors[b], WHITE,  
       buttonlabels[b], 0);
    }
  }
   buttons_y = y;
}

// Map the coordinate X
uint16_t mapXValue(TSPoint p) {
  uint16_t x = map(p.x, TS_MINX, TS_MAXX, 0, tft.width());
  //x+=1;
  return x;
}
uint16_t mapYValue(TSPoint p) {

  uint16_t y = map(p.y, TS_MINY, TS_MAXY, 0, tft.height());
  //y-=2;
  return y;
}
TSPoint waitOneTouch() {
  TSPoint p;
  do {
    p = ts.getPoint();
    pinMode(XM, OUTPUT); 
    pinMode(YP, OUTPUT);
  } while ((p.z < MINPRESSURE ) || (p.z > MAXPRESSURE));
  return p;
}
void showCalibration() {
  tft.setCursor (40, 0);   
      for (uint8_t i = 0; i < 8; i++) {
        buttons[i].drawButton();
    }
  }

void  EmitDeepRed()
{
  for(int i=0;i<NUM_LEDS;i++)
  {
  strip. setPixelColor(i, 255, 0, 0);
  strip.show();
  }
}
void  EmitCyan()
{
  for(int i=0;i<NUM_LEDS;i++)
  {
  strip. setPixelColor(i,0, 255, 255);
  strip.show();
  }
}
void  EmitWhite()
{
  for(int i=0;i<NUM_LEDS;i++)
  {
  strip. setPixelColor(i,255, 255, 255);
  strip.show();
  }
}
void  EmitGreen()
{
  for(int i=0;i<NUM_LEDS;i++)
  {
  strip. setPixelColor(i,0, 255, 0);
  strip.show();
  }
}
void  EmitBlue()
{
  for(int i=0;i<NUM_LEDS;i++)
  {
  strip. setPixelColor(i,0, 0, 255);
  strip.show();
  }
}
void  EmitYellow()
{
  for(int i=0;i<NUM_LEDS;i++)
  {
  strip. setPixelColor(i,255, 255, 0);
  strip.show();
  }
}
void  EmitPink()
{
  for(int i=0;i<NUM_LEDS;i++)
  {
  strip. setPixelColor(i,255, 0, 255);
  strip.show();
  }
}
void  EmitBlack()
{
  for(int i=0;i<NUM_LEDS;i++)
  {
  strip. setPixelColor(i,255, 255, 255);
  strip.show();
  }
}

نتیجه نهایی

در نهایت پس از آپلود کد ها و برقراری اتصالات همچنین اعمال تغییرات مدنظر قادر خواهیم بود تنها با لمس سوییچ های مجازی تغییرات مدنظر را بر روی نئوپیکسل ها اعمال کنیم، همچنین با اضافه کردن حالات مختلف می‌توانید مد های مد نظر خود را به پروژه اضافه کنید، علاوه بر تنها تغییر رنگ به استفاده از سورس های کتابخانه adafruit می‌توانید افکت های متنوعی را به پروژه اضافه کنید.

کلام آخر با سایفر

پروژه هایی مانند این مورد که باهم اجرا کردیم دارای جنبه های مختلفی تست، آموزشی، سرگرمی و حتی می‌تواند برای تزئینات استفاده شود، در گذشته اقدام به کنترل نئوپیکسل ها به روش های مختلفی کرده‌ایم، برای مثال کنترل به استفاده از وب‌سرور esp8266 و کنترل به واسطه انکودر ها. در نهایت می‌توانید برای مشاهده این آموزش ها در سایت دیجی اسپارک اقدام به جستجو آن ها کنید.

چنانچه در مراحل راه اندازی و انجام این پروژه با مشکل مواجه شدید، بدون هیچ نگرانی در انتهای همین پست، به صورت ثبت نظر سوالتان را مطرح کنید. من در سریع‌ترین زمان ممکن پاسخ رفع مشکل شما را خواهم داد. همچنین اگر ایرادی در کدها و یا مراحل اجرایی وجود دارند می‌توانید از همین طریق اطلاع رسانی کنید.

در پایان نظرات و پیشنهادات خود را با ما درمیان بگذارید و با اشتراک گذاری این آموزش در شبکه های اجتماعی , از وبسایت دیجی اسپارک حمایت کنید.

طراحی رابط کاربری برای LED نئوپیکسل با شیلد TFT LCD و برد آردوینو

نمایشگر TFT LCD تاچ

برد آردوینو Arduino

روش کار پروژه طراحی رابط کاربری

وسایل مورد نیاز

کتابخانه های مورد نیاز

اتصالات پروژه طراحی رابط کاربری

کد های پروژه طراحی رابط کاربری

نتیجه نهایی

کلام آخر با سایفر

درباره نویسنده

CiferTech

تبادل نظر و رفع عیب با ثبت دیدگاه X

۲ دیدگاه

نمایشگر TFT LCD تاچ

برد آردوینو Arduino

روش کار پروژه طراحی رابط کاربری

وسایل مورد نیاز

کتابخانه های مورد نیاز

اتصالات پروژه طراحی رابط کاربری

کد های پروژه طراحی رابط کاربری

نتیجه نهایی

کلام آخر با سایفر

درباره نویسنده

CiferTech

مطالب مرتبط با علاقمندی شما

تبادل نظر و رفع عیب با ثبت دیدگاه X

۲ دیدگاه