TFT LCD Touch 2

TFTLCDTouch2.
4ShieldparaArduinoUNO
05/03/201505/05/2015 IPADNANO 75COMENTARIOS

Tutonuevo!HoyostraigounshieldparaArduinoUNO.
Siemprehedichoquetodoproyectoporsimpleocomplejoquesea,deberallevarunapantalla,ysiesa
pantallaesLCDTFTde2.4,tctil,conlectordetarjetasMicroSDyencima,enformatoShield
paraArduinoUNO,estamosanteunproductodeinnitasposibilidades
AseselsiguientemduloquenoshancedidodesdenuestratiendacolaboradoraElectrohobby
(hp://www.electrohobby.es/tienda/es/).
Comohemosdicho,esteshieldparaArduinoUNO,tiene3funcionesprincipales:
PantallaLCDparavisualizacindegrcosotexto
PaneltctilsobrelapantallaLCD
LectordetarjetasMicroSDparadataloggingoalmacenamientodeimgenes.
Asquedespusdelsalto,veremoscomoconectar,enchufaryusarestefantsticomodulo
Lascaractersticasprincipalesdelshieldsonlassiguientes:
Lascaractersticasprincipalesdelshieldsonlassiguientes:
PantallaLCDTFTde2,4
ChipcontroladorLCDILI9341(EnlaceparadescargarelDatasheetILI9341
(hps://electronicavm.les.wordpress.com/2015/03/datasheetchiplcdili9341.pdf))
320240pixelesderesoluciny262.000colores
Paneltctilresistivode4hilos
Compatiblecontensinde5Vyaquedisponedereguladordetensinenplaca
ConexinShieldparaArduinoUNO
Tamao:71x52x7mm(LxAxH)
Conociendolascaractersticasdelmdulo,podemospasaralaaccin.
ConexindelshieldconnuestroArduinoUNO
AltenerformatoShieldparaArduinoUNO,tendrtodoslospinesconectadosanuestroArduino,porlo
queyanospreocuparemosenelcdigodelossketchsdecongurarlospinesqueutiliza.
SolohayunamaneradepincharloenelArduinoUNO,haciendocoincidirlospinesmachodelshield
conlospineshembradelArduino
Comoseapreciaenlaimagen,debemostenercuidadoalpincharelmdulo,yaquestecubrela
totalidaddelaplacaArduino,porloqueesrecomendablecubrirelconectorUSBdelArduino,conuna
cintaaislante,paraevitarqueseproduzcaalgncortocircuitoalpincharelshieldafondo.
ProcedemosacolocarnuestroShield+ArduinoenlatabladeArduinoUNOR3deElectrohobby
(hp://www.Electrohobby.es/tienda)parapodertrabajarconmayorcomodidadyenchufamosel
conectorUSBalArduino.
Configuracindelshieldylibrerasnecesarias
Antesdeempezar,aclararquevamosautilizarlaversindelIDEdeArduino1.0.
Parapoderusartodaslasfuncionesdelshield,necesitamosvariaslibrerasconalgunasmodicaciones
decdigoquehetenidoquehacerlesparapoderutilizarelshield,porloquenodisponendelos
ejemplosocialesquetraenlaslibreraspordefecto,sinounosejemplosquehepreparadoparapoder
ponerenfuncionamientoelshieldTFT:
LibreraAdafruit_TFTLCD:EstaeslalibreraAdafruit_TFTLCDoriginal,queincluyedriversde
variaspantallascondiferenteschips(ILI9325,ILI9341,HX8347G,HX8357),porloquedebemos
seleccionarelchipcorrectoenelcdigodelsketchparapodervisualizartexto,grcoseimgenesen
nuestrapantallaLCD.
LibreraAdafruit_GFX:EstalibreradeAdafruiteslaquenosproporcionarelcdigonecesario
paralarealizacindegrcosenlapantalla(puntos,crculos,lineas,etc)
LibreraTouchScreen:Libreraqueseencargadetraducireinterpretarlascoordenadas,parapoder
trabajarconelpaneltctilresistivode4hilosqueincluyenuestroshield.
LibreraSD:EslalibreraqueincluyeelentornodeArduinopordefectoparaelaccesoy
comunicacincontarjetasSD,oennuestrocaso,MicroSD.
LibreraSPI:LastarjetasSDoMicroSDsecomunicanmedianteelbusSPIconnuestroArduino,por
loqueesnecesariaestalibreraparapoderaccederalatarjeta.
Descargalaslibrerasdesdeaqui:LIBRERASPARATFTSD2.4SHIELD
(https://mega.co.nz/#!SZdikCjD!kZ4uHlTrPqtuVELN95aspayo5myOww7aBm0
bilX3G18)
EsmuyimportantedescargarTODASlaslibrerasycolocarlascorrectamenteenlacarpetadelibreras
delIDEdeArduino(Arduino>Libraries),sinoestntodaslaslibrerasybiensituadas,elshieldTFT
LCDnofuncionar.
EnelcasodeutilizarlaltimaversindeArduino,1.6.3,podemosobviarlacolocacindelaslibreras
SPIySDyaqueelpropioentornodeArduinotraeunaversinmsactualizadadeestas,porloque
podemosutilizarlaversindeArduino1.0olaltimaversin.
Colocadaslaslibreras,abrimoselentornodeArduino1.0yprocedemosaverlos3ejemplosdelas3
funcionesprincipalesdeesteshield.
1.VisualizacindegrficosytextoenLCD
NosdirigimosaFile>Examples>Adafruit_TFTLCD>Ejemplo_Graco
Yobtenemoselsiguientecdigo:
#include<Adafruit_GFX.h>//Libreriadegraficos
#include<Adafruit_TFTLCD.h>//LibreriadeLCD
//PinesdeconexiondelLCD
#defineLCD_CSA3//ChipSelectPinanalogico3
#defineLCD_CDA2//Command/DataPinAnalogico2
#defineLCD_WRA1//LCDWritePinAnalogico1
#defineLCD_RDA0//LCDReadPinAnalogico0
#defineLCD_RESETA4//LCDResetPinAnalogico4
Adafruit_TFTLCDtft(LCD_CS,LCD_CD,LCD_WR,LCD_RD,LCD_RESET);//InstanciadelLCD
#defineBLACK0x0000//Definimosloscoloresparapoderreferirnosaellosconsunomb
#defineRED0xF800//enlugardeusarelcdigohexadecimaldecadauno.
#defineGREEN0x07E0
#defineWHITE0xFFFF
#defineBLUE0x001F
#defineCYAN0x07FF
#defineYELLOW0xFFE0
#defineMAGENTA0xF81F
voidsetup(void)
{
tft.begin(0x9341);//IniciamoselLCDespecificandoelcontroladordenuestroLC.En
//Otroscontroladores:0x9325,0x9328,0x7575,0x9341,0x8357.
tft.fillScreen(BLACK);//ColocamoselfondodelLCDenNegro
}
voidloop(void)
{
tft.setRotation(0);//EstablecemoslaposicindelapantallaVerticaluHorizontal
tft.setCursor(40,10);//SituamoselcursorenlaposiciondelLCDdeseada,
//(X,Y)siendoXelancho(240pxmax.)eYelalto(320pxmax.)
tft.setTextSize(5);//Definimostamaodeltexto.(Probadotamaosdel1al10)
tft.setTextColor(CYAN);//Definimoselcolordeltexto
tft.println("Texto");//EscribimosnuestrotextoenelLCD.Realizarunsaltodelin
//automaticosieltextoesmayorqueeltamaodelLCD
tft.drawLine(20,65,200,70,GREEN);//Dibujamosunalinea(PuntoinicioX,Puntoin
intX=tft.width();//AlmacenamosenlavariableenteraXelanchodelLCDenpixele
intY=tft.height();//AlmacenamosenlavariableenteraYelaltodelLCDenpixele
tft.setCursor(15,90);//SituamoselcursorenunanuevaposiciondelLCD
tft.setCursor(15,90);//SituamoselcursorenunanuevaposiciondelLCD

tft.setTextSize(3);//Definimostamaodeltexto.

tft.setTextColor(RED);//Definimoselcolordeltexto

tft.print("X=");tft.print(X,DEC);//Imprimimosporpantallaelvalordelasvariabl
tft.print("Y=");tft.println(Y,DEC);

tft.drawRect(20,125,200,25,YELLOW);//Dibujamosuncuadrado/rectangulosincolor
//(PuntoinicialX,PuntoinicialY,LongitudX,LongitudY,Color)

tft.fillRect(20,165,60,60,BLUE);//Dibujamosuncuadrado/rectangulorellenodeco
//(PuntoinicialX,PuntoinicialY,LongitudX,LongitudY,Color)

tft.drawCircle(120,195,30,WHITE);//Dibujamosuncirculosincolorderelleno
//(PuntoinicialX,PuntoinicialY,Radiodelcirculo,Color)

tft.fillCircle(120,195,20,WHITE);//Dibujamosuncirculorellenodecolor
//(PuntoinicialX,PuntoinicialY,Radiodelcirculo,Color)

tft.drawTriangle//Dibujamosuntriangulosincolorderelleno
(190,163,//(VerticesuperiorX,VerticesuperiorY,
160,225,//VerticeinferiorizquierdoX,verticeinferiorizquierdoY,
222,225,CYAN);//VerticeinferiorderechoX,VerticeinferiorderechoY,Color)

tft.fillTriangle//Dibujamosuntriangulorellenodecolor
(190,240,//(VerticesuperiorX,VerticesuperiorY,
160,302,//VerticeinferiorizquierdoX,verticeinferiorizquierdoY,
222,302,MAGENTA);//VerticeinferiorderechoX,VerticeinferiorderechoY,Color)

tft.drawRoundRect(20,245,130,60,20,RED);//Dibujamosuncuadrado/rectangulocon
//(PuntoinicialX,PuntoinicialY,LongitudX,LongitudY,Radiodelosvertices,Co

tft.fillRoundRect(35,255,100,40,15,YELLOW);//Dibujamosuncuadrado/rectanguloc
//(PuntoinicialX,PuntoinicialY,LongitudX,LongitudY,Radiodelosvertices,Co
delay(10000);
}
Analizamosunpocoelcdigoporpartesyvemosquetenemoslaslibrerasnecesariasparatrabajarcon
elLCDylalibreraparalarealizacindegrcos,ladeclaracindelospinesnecesarios,ylainstancia
delLCDconlospinescorrespondientes.UtilizaremosparaelLCDtodospinesanalgicos,delA0alA4,
puestoqueesunshieldnopodemosmodicarlos.

//PinesdeconexiondelLCD
#defineLCD_CSA3//ChipSelectPinanalogico3
#defineLCD_CDA2//Command/DataPinAnalogico2
#defineLCD_WRA1//LCDWritePinAnalogico1
#defineLCD_RDA0//LCDReadPinAnalogico0
#defineLCD_RESETA4//LCDResetPinAnalogico4

//InstanciadelLCD
Adafruit_TFTLCDtft(LCD_CS,LCD_CD,LCD_WR,LCD_RD,LCD_RESET);
PosteriormenteenelcdigotenemosladeclaracindeloscoloresqueutilizaremosenelLCDparadar
coloralasformas,textoyfondo.
Entramosenelvoidsetup(void)yvemosquelaprimeralinea,eslallamadaalafuncin
tft.begin(0x9341);,queiniciarelLCDyleindicarquedriversyregistrosdebeutilizar,porloque
debemoscolocarenlavariabledeestafuncin,eldrivercorrespondienteanuestroLCD.
voidsetup(void)
{
tft.begin(0x9341);//EspecificamoselcontroladordenuestroLCD.
EnestecasoelILI9341.
//Otroscontroladores:0x9325,0x9328,0x7575,0x9341,0x8357.

tft.fillScreen(BLACK);//ColocamoselfondodelLCDenNegro
}
LalibreraAdafruit_TFTLCDincluyedriversparalossiguienteschips:
ILI932X0x9325/0x9328
HX8347G0x7575
ILI93410x9341(Ennuestrocasoesteeseldrivercorrecto)
HX83570x8357
Yseguidovemoslalineadecdigoquehacelallamadaalafuncinquepintarelfondodenuestro
LCD,tft.llScreen(COLOR);,delcolorqueelijamos,enmicasonegro.
Estoserealizaenelvoidsetup(void);paraquesololorealiceunavez.
Vamosalvoidloop()yvemostodaslasfuncionesqueincluyelalibreraparalarealizacindegrcos,
cuadrados,crculos,lneas,ylaescrituradetexto,contodossusparmetros.
Vamosaanalizarlasprimeraslineasyfunciones:

voidloop()
{
tft.setRotation(0);//EstablecemoslapantallaVerticaluHorizontal
tft.setCursor(40,10);//Situamoselcursor
tft.setTextSize(5);//Definimostamaodeltexto.
tft.setTextColor(CYAN);//Definimoselcolordeltexto
tft.println("Texto");//EscribimosnuestrotextoenelLCD
tft.drawLine(20,65,200,70,GREEN);//Dibujamosunalinea
intX=tft.width();//AlmacenamosenXelanchodelLCDenpx
intY=tft.height();//AlmacenamosenYelaltodelLCDenpx
tft.print("X=");
tft.print(X,DEC);//Imprimimoselvalordelasvariablesendecimal
tft.print("Y=");
tft.println(Y,DEC);
tft.drawRect(20,125,200,25,YELLOW);//Dibujamosuncuadrado
tft.fillRect(20,165,60,60,BLUE);//Dibujamosuncuadradorelleno
tft.drawCircle(120,195,30,WHITE);//Dibujamosuncirculo
tft.fillCircle(120,195,20,WHITE);//Dibujamosuncirculorelleno
}
SicargamoselEjemplo_GraconuestroArduino+LCDveremoslosiguiente:
SicargamoselEjemplo_GraconuestroArduino+LCDveremoslosiguiente:
EnelarchivoEjemplo_Graco.inoquecargamosennuestroArduino,alnaldelcdigoestntodaslas
funcionesconlasdescripcionesdelosparmetrosnecesariosparalarealizacindegrcosytextoa
mododechuleta.PodremosdibujaraplacerennuestroLCD.
2.UtilizandoelpaneltctildelShieldTFTLCD
Esteshieldincluyesobrelapantallaunpaneltctilresistivode4hilosquenospermitirobtenerlas
coordenadasXeYdondepulsemossobrelapantalla,yportanto,poderrealizaraccionesquevan
desdepintarsobrenuestroLCDcomosifueraunlienzodigitalodibujarbotonesennuestroLCDque
alpulsarsobreellosrealicenunadeterminadaaccin.
Qusignicaquetieneunpaneltctilresistivo?
Puesbien,unapantallatctilresistiva
consisteprincipalmenteendos
capasseparadasdematerialplstico
conductorconunadeterminada
resistenciaalacorrienteelctrica,queal
pulsarenunpuntodeterminadodela
capaexterior,stahacecontactoconla
capainteriorymidiendolaresistencia
calculaelpuntoexactodondeseha
pulsadoenunejedecoordenadasXeY.
Imagenhp://www.ecojoven.com(hp://www.ecojoven.com) Algunostiposdepantallasresistivas
Imagenhp://www.ecojoven.com(hp://www.ecojoven.com) Algunostiposdepantallasresistivas
permitentambinlamedicindeuneje
Z,esdecir,lapresinqueseest
realizandosobreelpuntoenconcretodelapantalla.
ParapoderutilizarelpaneltctildenuestroshieldTFT,nosdirigimosenelIDEdeArduino1.0aFile>
Examples>Adafruit_TFTLCD>Ejemplo_Tactil

#include<TouchScreen.h>//Libreriadelpaneltactil
//Pinesnecesariosparalos4pinesdelpaneltactil
#defineYPA1//PinanalogicoA1paraADC
#defineXMA2//PinanalogicoA2paraADC
#defineYM7
#defineXP6
//Definimoslapresionmximayminimaquepodemosrealizarsobreelpanel
#defineMINPRESSURE1
#defineMAXPRESSURE1000
//Paramejorprecisiondelapresionrealizada,esnecesario
//medirlaresistenciaentrelospinesX+yX.
//EnShieldTFT2.4"LCDsemideentrelospinesA2y6
//Instanciadelpaneltactil(PinXP,YP,XM,YM,Resistenciadelpanel)
TouchScreents=TouchScreen(XP,YP,XM,YM,364);
shortTS_MINX=150;//Coordenadasdelpaneltactilparadelimitar
shortTS_MINY=120;//eltamaodelazonadondepodemospresionar
shortTS_MAXX=850;//yquecoincidaconeltamaodelLCD
shortTS_MAXY=891;
#defineLCD_CSA3//DefinimoslospinesdelLCD
#defineLCD_CDA2//parapodervisualizarelementosgraficos
#defineLCD_WRA1
#defineLCD_RDA0
#defineLCD_RESETA4
#defineBLACK0x0000//Definimosloscolores
#defineBLUE0x001F//queutilizaremospara
#defineRED0xF800//eltextoyloselementosgraficos
#defineGREEN0x07E0
#defineCYAN0x07FF
#defineMAGENTA0xF81F
#defineYELLOW0xFFE0
#defineWHITE0xFFFF
Adafruit_TFTLCDtft(LCD_CS,LCD_CD,LCD_WR,LCD_RD,LCD_RESET);//InstanciaLCD
intX;//Variablesquealmacenaranlacoordenada
intY;//X,YdondepresionemosylavariableZ
intZ;//almacenaralapresionrealizada
inta=0;//variable"flag"paracontrolrebotes

#defineledA5//Anododelledconectadopindigital5
#defineledK3//Catododelledconectadopindigital3
voidsetup(void)
{
tft.begin(0x9341);//IniciamoselLCDespecificandoelcontroladorILI9341.
tft.fillScreen(CYAN);//PintamoslapantalladeRojo
pinMode(13,OUTPUT);
pinMode(ledA,OUTPUT);
pinMode(ledK,OUTPUT);
tft.drawRect(40,20,160,60,RED);//Dibujamosun"boton"
tft.setCursor(60,35);//Colocamoselcursor
tft.setTextSize(4);//Especificamoseltamaodeltexto
tft.println("BOTON");//Escribimosporpantalla
}
voidloop()
{
lecturaPanel();//Realizamoslecturadelpanelparadetectarpresionycoordenadas
//SilapulsacindelejeXseproduceentrelospuntos40y160
//YlapulsaciondelejeYseproduceentrelospuntos20y60
//Ylapresinrealizadaestaentreelmargendeterminado
if((X>40&&X<200)&&(Y>20&&Y<60)&&(Z>MINPRESSURE&&Z<MAXPRESSURE))
{
if(a==0)//Silavariableflagestaen0
{
tft.fillRect(40,20,160,60,RED);//Dibujamosnuestrobotonrellenodecolor
tft.setTextColor(WHITE);//Definimoselcolordeltexto
tft.println("PULSADO");//Escribimosporpantalla
//AQUIREALIZAMOSLAACCIONQUEDESEEMOS:ENCENDERELLED
digitalWrite(ledA,HIGH);
digitalWrite(ledK,LOW);
a=1;//Ponemoslavariableflagen1
delay(150);
}
elseif(a==1)//Silavariableflagestaen1
{
tft.fillRect(41,21,158,58,CYAN);//Dibujamoselfondodenuestrobotonencyan


//AQUIREALIZAMOSLAACCIONQUEDESEEMOS:APAGARELLED
digitalWrite(ledA,LOW);
digitalWrite(LedK,LOW);

a=0;//Ponemoslavariableflagen0paraevitarlosrebotes
delay(150);
}
}
}

voidlecturaPanel()
{
digitalWrite(13,HIGH);
TSPointp=ts.getPoint();//Realizamoslecturadelascoordenadas
digitalWrite(13,LOW);

pinMode(XM,OUTPUT);//Lalibrerautilizaestospinescomoentradaysalida
pinMode(YP,OUTPUT);//porloqueesnecesariodeclararloscomosalidajusto
//despuesderealizarunalecturadecoordenadas.

//Mapeamoslosvaloresanalogicosleidosdelpaneltactil(01023)
//ylosconvertimosenvalorcorrespondientealamedidadelLCD320x240
X=map(p.x,TS_MAXX,TS_MINX,tft.width(),0);
Y=map(p.y,TS_MAXY,TS_MINY,tft.height(),0);
Z=p.z;
}

Estesketchlohepreparadoespeccamenteparapodervertodaslasfuncionesdelapantallatctildeun
modosimple.
Analizamoselcdigoporpartes:

#include<TouchScreen.h>//Libreriadelpaneltactil

//Pinesnecesariosparalos4pinesdelpaneltactil
#defineYPA1//PinanalogicoA1paraADC
#defineXMA2//PinanalogicoA2paraADC
#defineYM7
#defineXP6

//Definimoslapresionmximayminimaquepodemosrealizar
#defineMINPRESSURE1
#defineMAXPRESSURE1000

//Paramejorprecisiondelapresionrealizada,esnecesario
//medirlaresistenciaentrelospinesX+yX.
//EnShieldTFT2.4"LCDsemideentrelospinesA2y6
//Instanciadelpaneltactil(PinXP,YP,XM,YM,ResistenciaejeX)

intX;//Variablesquealmacenaranlacoordenada
intY;//X,YdondepresionemosylavariableZ
intZ;//almacenaralapresionrealizada

#defineledA5//Pindigital5Anododelled
#defineledK3//Pindigital3Catododelled

AdemsdelaslibrerasdelosgrcosydelLCDquehemosvistoanteriormente,debemosincorporarla
libreraTouchScreen.hparapoderleerlaspulsacionesquerealizamossobreelpaneltctil.
Vemosque2delospinesdelpaneltctilcoincidencon2pinesdelLCD,porloqueposteriormente
veremosquedebemosdeclararesospinescomoentradaosalidaenmediodelsketchenfuncinde
quiendelosdoselementoslosvayaautilizar,peroparaelpaneltctilesnecesarioqueestosdospines
estnconectadosendospinesdeArduinoquedispongandeADC(conversoranalgicodigital)para
poderobtenerlaslecturasdelpanel.
TenemosdosvariablesMINPRESSUREyMAXPRESSUREquepodemosmodicaralgustopara
establecerlapresinmnimaomximaquedebemoshacersobrelapantallaparadetectarlapulsacin,
puestoqueestepaneltctiltambinescapazdedetectarelejeZ.
Seguido,ladeclaracindelainstanciadelpaneltctil,dondeapreciamosquedebemoscolocarlos
pinesqueutilizarelpaneltctilpreviamentedeclaradosyenltimolugar,debemoscolocarelvalor
delaresistenciaalacorrienteelctricaquetieneelpanel.Cuantomsprecisoseaestevalorrespectoa
laresistenciarealquetienenuestropanel,mejorrespuestadaralahoradedetectarlaspulsaciones.


Bien,paramedirlaresistenciadelejeXdenuestropanel,simiramoslospinesdelpaneltctil,vemos
queelpinXP=Digital6ypinXM=Analgico2,porloqueprocedemosahacerlamedicindela
resistenciaconunmultmetrodelasiguientemanera:
Enmicaso,laresistenciaesde364ylocolocamosenlainstanciadelTouchscreen.
SiqueremosvisualizarelementosenlapantallaLCD,debemosdeclarar,igualqueenelejemplogrco,
lospinesdeutilizacindelLCD,ysuinstancia,etc.
Elcdigoimportantedeestesketcheslasiguienteparte,lafuncinlecturaPanel();

voidlecturaPanel()
{
digitalWrite(13,HIGH);
TSPointp=ts.getPoint();//Realizamoslecturadelascoordenadas
digitalWrite(13,LOW);

//Lalibrerautilizaestospinescomoentradaysalida
pinMode(XM,OUTPUT);//porloqueesnecesariodeclararlos
pinMode(YP,OUTPUT);//comosalidajustodespuesderealizaruna
//lecturadecoordenadas.

//Mapeamoslosvaloresanalogicosleidosdelpaneltactil(01023)
//ylosconvertimosenvalorcorrespondientealamedidadelLCD
X=map(p.x,TS_MAXX,TS_MINX,tft.width(),0);
Y=map(p.y,TS_MAXY,TS_MINY,tft.height(),0);
Z=p.z;
}

Comovemos,realizamoslalecturaconstantementedelpanel,parapoderdetectarlaspulsacionesen
todomomento,porloquedebemosllamaraestafuncindesdeelvoidloop().
Lafuncionts.getPoint();devuelvelascoordenadasXeYdelapulsacindetectada,yutilizandoestas
coordenadasdevueltasdesdeelADCenunvalorcomprendidoentre0y1023
(8bits),simplementelasmapeamosparaconvertirdichovalorenunvalorcomprendidoentre0y240
paraelejeX,yunvalorcomprendidoentre0y320paraelejeY,quecorresponderanconeltamaoen
pixelesdenuestrapantalla.
Enelvoidloop();simplementedibujouncuadradocontextoBotnquealpulsarenlascoordenadas
queseencuentrandentrodeestecuadrado,cambiedecolorymuestreotrotextodiferenteyasuvez,
enciendaelledquetenemosconectadoenelpindigital5.Sivolvemosapulsarelbotn,elledse
apagaryelbotnvolverasuestadodereposo.
Estecdigorealizarlosiguiente:
TFT LCD 2.4" Shield TouchScreen Practical Example with Arduino UNO
Elotroejemploqueincluyelalibrera,Ejemplo_Pintar,esunamodicacinytraduccindecomentarios
alespaolquehehechodelejemploTFTPaintdelalibreradeAdafruit,yquenospermitepintarcon
diferentescoloressobreelLCDcomosifueraunlienzodigital:
TFT LCD 2.4" Shield TouchScreen Paint example with Arduino UNO
3.VisualizandoimagenesBMPenelLCD
Porltimoperonomenosimportante,vamosavisualizarenelLCD,imgenesenformatoBMPde24
bitsalmacenadasenlatarjetaMicroSDdelshield.
Comopodemosobservarenlasiguienteimagen,elshieldincluyeunlectordetarjetasMicroSD
conectadoalospinescorrespondientesalbusSPI,yaqueutilizanestebusparacomunicarse.
(ClicaquiparaconocercomosecomunicanlastarjetaSDyArduino)
(hp://electronicavm.net/2011/11/05/arduinoshieldtarjetasd/)
LospinesdelbusSPIsecorrespondenconlossiguientes:
Pindigital10CS/SS(EnlibreraArduinoSD/Estepinescongurablevasoftware)
Pindigital11MOSI
Pindigital12MISO
Pindigital13CLK
AtenerencuentaquelasimgenesquealmacenemosennuestraMicroSD,debenserimgenesen
formatoBMPde24bitsydetamaomximo320x240pixeles.
OtrotipodeformatosdeimagenNOlosreconocer.
AlmacenamosvariasimgenesennuestraMicroSDrecordandolosnombresexactosquelesdimospara
cargarlasdesdeelcdigodelsketch,eintroducimoslaMicroSDennuestroShield.
Procedemosacargarelejemplo:File>Examples>Adafruit_TFTLCD>Ejemplo_ImagenesSD
Yobtenemoselsiguientecdigo:

#include<SD.h>//LibreriadetarjetaSD
#include<SPI.h>//LibreriabusSPI
#defineLCD_WRA1
#defineLCD_RDA0
#defineLCD_RESETA4
//LospinesdelpuertoSPIvienenconfiguradosporlibreria,porloque
//solamentedebemoscolocarelpincorrespondientealChipSelectdel
//busSPIcorrespondientealaconexionconlatarjetaSD
#defineSD_CS10
//EnlatarjetaSDdebemoscolocarimagenesenformatoBMPde24Bits!
//Otrotipodeformatodeimagennosepuedevisualizarporpantalla.
Adafruit_TFTLCDtft(LCD_CS,LCD_CD,LCD_WR,LCD_RD,LCD_RESET);//InstanciaLCD
voidsetup()
{
Serial.begin(9600);//Iniciamoselpuertoserieparacomprobar
//lacomunicacionconlatarjetamicroSD
tft.reset();
tft.begin(0x9341);//IniciamoselLCDespecificandoelcontroladorILI9341.
Serial.print(F("InicializandotarjetaSD..."));
if(!SD.begin(SD_CS))//Siseproduceunerroralintentaracceder
{//alatarjetaSD,lomostramosporelSerialMonitor
Serial.println(F("Error!"));
return;
}
Serial.println(F("OK!"));
voidloop()
{
tft.setRotation(0);//EstablecemoslaposiciondelapantallaVertical
bmpDraw("1.bmp",0,0);//Mostramosunaimagenenlascoordenadas0,0
delay(1000);

tft.setRotation(3);//EstablecemoslaposiciondelapantallaHorizontal
bmpDraw("2.bmp",0,0);////Mostramosotraimagenenlascoordenadas0,0
delay(1000);
}
//EstafuncionabreunarchivoWindowsbitmap(BMP)ylomuestrapor
//pantallaenlascoordenadasespecificadas.Sepuedeacelerarel
//procesodemuestreoleyendomuchospixelesalavezenlugarde
//leerpixelapixel,incrementandoeltamaodelasiguientevariable
//BUFFPIXEL,utilizaremosmasmemoriaRAMdelArduinoperoserealizar
//lacargadelaimagenmasrapido.
//Unbufferde20pixelesesunvalorequilibrado.
#defineBUFFPIXEL20
voidbmpDraw(char*filename,intx,inty){
FilebmpFile;
intbmpWidth,bmpHeight;//W+Hinpixels
uint8_tbmpDepth;//Bitdepth(currentlymustbe24)
uint32_tbmpImageoffset;//Startofimagedatainfile
uint32_trowSize;//Notalways=bmpWidth;mayhavepadding
uint8_tsdbuffer[3*BUFFPIXEL];//pixelinbuffer(R+G+Bperpixel)
uint16_tlcdbuffer[BUFFPIXEL];//pixeloutbuffer(16bitperpixel)
uint8_tbuffidx=sizeof(sdbuffer);//Currentpositioninsdbuffer
booleangoodBmp=false;//Settotrueonvalidheaderparse
booleanflip=true;//BMPisstoredbottomtotop
intw,h,row,col;
uint8_tr,g,b;
uint32_tpos=0,startTime=millis();
uint8_tlcdidx=0;
booleanfirst=true;
if((x>=tft.width())||(y>=tft.height()))return;
Serial.println();
Serial.print(F("Loadingimage'"));
Serial.print(filename);
Serial.println('\'');
//OpenrequestedfileonSDcard
if((bmpFile=SD.open(filename))==NULL){
Serial.println(F("Filenotfound"));
return;
}
//ParseBMPheader
if(read16(bmpFile)==0x4D42){//BMPsignature
Serial.println(F("Filesize:"));Serial.println(read32(bmpFile));
(void)read32(bmpFile);//Read&ignorecreatorbytes
bmpImageoffset=read32(bmpFile);//Startofimagedata
Serial.print(F("ImageOffset:"));Serial.println(bmpImageoffset,DEC);
//ReadDIBheader
Serial.print(F("Headersize:"));Serial.println(read32(bmpFile));
bmpWidth=read32(bmpFile);
bmpHeight=read32(bmpFile);
if(read16(bmpFile)==1){//#planesmustbe'1'
bmpDepth=read16(bmpFile);//bitsperpixel
Serial.print(F("BitDepth:"));Serial.println(bmpDepth);
if((bmpDepth==24)&&(read32(bmpFile)==0)){//0=uncompressed
goodBmp=true;//SupportedBMPformatproceed!
Serial.print(F("Imagesize:"));
Serial.print(bmpWidth);
Serial.print('x');
Serial.println(bmpHeight);
//BMProwsarepadded(ifneeded)to4byteboundary
rowSize=(bmpWidth*3+3)&~3;
//IfbmpHeightisnegative,imageisintopdownorder.
//Thisisnotcanonbuthasbeenobservedinthewild.
if(bmpHeight<0){
bmpHeight=bmpHeight;
flip=false;
}
//Cropareatobeloaded
w=bmpWidth;
h=bmpHeight;
if((x+w1)>=tft.width())w=tft.width()x;
if((y+h1)>=tft.height())h=tft.height()y;
//SetTFTaddresswindowtoclippedimagebounds
tft.setAddrWindow(x,y,x+w1,y+h1);
for(row=0;row<h;row++){//Foreachscanline...
//Seektostartofscanline.Itmightseemlabor
//intensivetobedoingthisoneveryline,butthis
//methodcoversalotofgrittydetailslikecropping
//andscanlinepadding.Also,theseekonlytakes
//placeifthefilepositionactuallyneedstochange
//(avoidsalotofclustermathinSDlibrary).
if(flip)//Bitmapisstoredbottomtotoporder(normalBMP)
pos=bmpImageoffset+(bmpHeight1row)*rowSize;
else//Bitmapisstoredtoptobottom
pos=bmpImageoffset+row*rowSize;
if(bmpFile.position()!=pos){//Needseek?
bmpFile.seek(pos);
buffidx=sizeof(sdbuffer);//Forcebufferreload
}
for(col=0;col<w;col++){//Foreachcolumn...
//Timetoreadmorepixeldata?
if(buffidx>=sizeof(sdbuffer)){//Indeed
//PushLCDbuffertothedisplayfirst
if(lcdidx>0){
tft.pushColors(lcdbuffer,lcdidx,first);
lcdidx=0;
first=false;
}
bmpFile.read(sdbuffer,sizeof(sdbuffer));
buffidx=0;//Setindextobeginning
}
//ConvertpixelfromBMPtoTFTformat
b=sdbuffer[buffidx++];
g=sdbuffer[buffidx++];
r=sdbuffer[buffidx++];
lcdbuffer[lcdidx++]=tft.color565(r,g,b);
}//endpixel
}//endscanline
//WriteanyremainingdatatoLCD
if(lcdidx>0){
tft.pushColors(lcdbuffer,lcdidx,first);
}
Serial.print(F("Loadedin"));
Serial.print(millis()startTime);
Serial.println("ms");
}//endgoodBmp
}
}
bmpFile.close();
if(!goodBmp)Serial.println(F("BMPformatnotrecognized."));
}
//Theseread16and32bittypesfromtheSDcardfile.
//BMPdataisstoredlittleendian,Arduinoislittleendiantoo.
//Mayneedtoreversesubscriptorderifportingelsewhere.
uint16_tread16(Filef){
uint16_tresult;
((uint8_t*)&result)[0]=f.read();//LSB
((uint8_t*)&result)[1]=f.read();//MSB
returnresult;
}

uint32_tread32(Filef){
uint32_tresult;
((uint8_t*)&result)[0]=f.read();//LSB
((uint8_t*)&result)[1]=f.read();
((uint8_t*)&result)[2]=f.read();
((uint8_t*)&result)[3]=f.read();//MSB
returnresult;
}

Vemosyanalizamosporparteselcdigohastaelvoidloop()
Enestecaso,debemosaadirademsdelaslibrerasyautilizadaspararealizacindegrcosy
utilizacindelLCD,laslibrerascorrespondientesalatarjeta,<SD.h>yalbusSPI,<SPI.h>

#include<SD.h>//LibreriadetarjetaSD
#include<SPI.h>//LibreriabusSPI

#defineLCD_WRA1
#defineLCD_RDA0
#defineLCD_RESETA4

//LospinesdelpuertoSPIvienenconfiguradosporlibreria,
//debemoscolocarelpincorrespondientealChipSelectdel
//busSPIcorrespondientealaconexionconlatarjetaSD
#defineSD_CS10

Adafruit_TFTLCDtft(LCD_CS,LCD_CD,LCD_WR,LCD_RD,LCD_RESET);

DeclaramoslospinesdelLCDdelmismomodoqueenelejemplogrcoyelTouchScreen.
DadoquelospinesdelzcalodelatarjetaMicroSDdelshield,estnconectadosalospinesdelbus
SPIdeArduino,noesnecesariodeclararlospuestoquevienendeclaradosenlalibreraSPIdeArduino,
solamentedebemosdeclararelpinCSqueserelquedeterminelacomunicacinentreelmaestro
(Arduino)yelesclavo(MicroSD).
(Arduino)yelesclavo(MicroSD).
Portanto,comprobamosyelshieldtieneelpinCSenelcorrespondientealpinDigital10.
voidsetup()
{
Serial.begin(9600);//Iniciamoselpuertoserieparacomprobar
//lacomunicacionconlatarjetamicroSD

tft.begin(0x9341);//IniciamoselLCDcontroladorILI9341.

Serial.print(F("InicializandotarjetaSD..."));

if(!SD.begin(SD_CS))//Siseproduceunerroralintentaracceder
{//atarjetaSD,mostramosporSerialMonitor
Serial.println(F("Error!"));
return;
}
Serial.println(F("OK!"));
}
IniciamoselSerialMonitorparapoderobtenerresultadosdelprocesodecomunicacinconlatarjetaSD
ycomprobarquetodohasidocorrecto.
InicializamoselLCDconeldrivercorrectoeintentamosaccederalatarjetaSDmediantelafuncion
SD.begin(SD_CS);Sitodovabien,veremosunOK!enelSerialMonitorypodremosaccedera
nuestroSDparavisualizarnuestrasimgenes.
Yporltimo,vemoselvoidloop()

voidloop()
{
tft.setRotation(0);//EstablecemosposiciondelLCDVertical
bmpDraw("1.bmp",0,0);//Mostramosimagenenlascoordenadas0,0
delay(1000);//Tiempodeesperaparamostrarlaimagen
tft.setRotation(3);//EstablecemosposiciondelLCDHorizontal
bmpDraw("2.bmp",0,0);//Mostramosimagenenlascoordenadas0,0
delay(1000);//Tiempodeesperaparamostrarlaimagen
}

Enestecaso,establecemoslarotacindelapantalla,enverticaluhorizontalmediantelafuncin
tft.setRotation(0);enfuncindelasimgenesquevayamosamostrarporelLCD.
Yparavisualizarlasimgenes,llamamosalafuncinbmpDraw(NombreImagen.bmp,X,Y);,
Yparavisualizarlasimgenes,llamamosalafuncinbmpDraw(NombreImagen.bmp,X,Y);,
pasandocomoparmetroselnombreEXACTOquetienenuestraimagenalmacenadaenlaMicroSDy
lascoordenadasXeYdedondequeremosmostrarlaenlapantalla.
EstafuncinvieneincluidaenelsketchtftbmpdelalibreradeAdafruityfuncionamuybien.
YaspodemosvisualizarimgenesalmacenadasenlatarjetamicroSD:
TFT LCD 2.4" Shield MicroSD Bitmaps example with Arduino UNO
Resumiendo,esunfantsticomduloshieldquepodremosutilizarenmuchosproyectosdiferentes
aadiendounelementoactualymodernocomosonlaspantallastctiles,visualizandogrcosatodo
coloryaseanimgenes,botonesotextoypudiendoleeryescribirdatosoimgenesdesdelatarjeta
MicroSD.
AgradeceraElectrohobby(hp://www.electrohobby.es/tienda/es/)porelmduloshieldynosvemos
enelsiguientetuto!
Resolucindeproblemas
Siteniendotodaslaslibrerasdescargadasycorrectamentecolocadas,aliniciarcualquieradelossketchs
propuestosenestetutorial,loquevemoseslapantallallenadepixelesdecolores:
EsposiblequeelchipdenuestroLCDseadiferentealqueestamoscongurando,porloquedebemos
probarconlosdiferentesdriversqueincluyeestalibreradeAdafruitparapoderinicializar
correctamenteelLCD.
Modicandolasiguientelineadecdigodenuestrosketch,cambiamoselvalorentreparntesispor
algunodelosotroscontroladoresdisponiblesyvamosprobandoparacomprobarculeseldriverque
necesitanuestroLCD.

tft.begin(0x9341);//IniciamoselLCDespecificandoelcontrolador

//Controladoresdisponibles:0x9325,0x9328,0x7575,0x9341,0x8357

Anuncios
Microelectronic
sCircuit
Analysisand
Design
Microelectronic
sCircuit
Analysisand
Design
ARDUINO,COMPONENTESELECTRNICOS,PROYECTOSELECTRNICOS 2.4,320X240
PX,ARDUINO,ARDUINOUNOR3,BITMAPS,GRFICOS,ILI9341,LCD,MDULO,MCUFRIEND,
MICROSD,PANELRESISTIVO,SHIELD,SPI,TACTIL,TFT,TOUCHSCREEN,UNO
75comentariosenTFTLCDTouch2.4Shieldpara
ArduinoUNO
sergifezdice:
30/12/2016en11:30
1.
0

0

i
Votaestecomentario
Solucionado,cambiandolaasignacindepines,quedandoas.Nosemuybienpq.
//Pinesnecesariosparalos4pinesdelpaneltctil
//Pinesnecesariosparalos4pinesdelpaneltctil
#deneYP7
#deneXMA1//PinanalogicoA1paraADC
#deneYMA2//PinanalogicoA2paraADC
#deneXP6
RESPONDER
DilsonSouzadice:
07/01/2017en17:22
2.
0

0

i
Votaestecomentario
HeprobadoelEjemplo_pintar,perocuandosetrazaunalneaverticalenlapantallaapareceuna
lneahorizontal.
Ustedsabeporqusucedeesto?
RESPONDER
DilsonSouzadice:
10/01/2017en02:18
3.
0

0

i
Votaestecomentario
Holla
Enelsiguientecdigosecre4botonesydeseosloelbotn////Testabotaoamarelollamadoy
deligasseelLED5.PerocuandopulsolosotrosbotoneselLED5parpadea.Mepreguntocmo
puedeesteeleminardestellosdelLED5cuandopulsolosotrosbotones?
//Programa:TesteDisplayTouchArduinoTouchscreen
//Autor:FILIPEFLOP
#include//Coregraphicslibrary
#include//Hardwarespeciclibrary
#include
#deneYPA1//Y+isonAnalog1
#deneXMA2//XisonAnalog2
#deneYM7//YisonDigital7
#deneXP6//X+isonDigital6
#deneTS_MINX125
#deneTS_MINX125
#deneTS_MINY85
#deneTS_MAXX965
#deneTS_MAXY905
//Denicaodecores
#deneBLACK0x0000
#deneBLUE0x001F
#deneRED0xF800
#deneGREEN0x07E0
#deneCYAN0x07FF
#deneMAGENTA0xF81F
#deneYELLOW0xFFE0
#deneWHITE0xFFFF
//PP_TFTLCDtft(LCD_CS,LCD_CD,LCD_WR,LCD_RD,LCD_RESET);
Adafruit_TFTLCDtft(A3,A2,A1,A0,A4);
//Armazenaoestadodosbotes
boolvalor_botao1=0;
boolvalor_botao2=0;
boolvalor_botao3=0;
boolvalor_botao4=0;
#deneMINPRESSURE10
#deneMAXPRESSURE1000
#deneledA5//ledpin5
voidsetup(void)
{
Serial.begin(9600);
Serial.println(TFTTest);
//identier==0x9341;
tft.reset();
delay(500);
//uint16_tidentier=tft.readRegister(0x0);
//Serial.print(Driverencontrado:);
//Serial.println(identier,HEX);
pinMode(5,OUTPUT);
tft.begin(0x9341);
//tft.initDisplay();
tft.llScreen(BLACK);
tft.setRotation(1);
//InicioTextoebotoes
//InicioTextoebotoes
tft.drawRoundRect(5,15,312,50,5,WHITE);
tft.setTextColor(YELLOW);
tft.setTextSize(3);
tft.setCursor(15,30);
tft.println(Garagem);
tft.setTextColor(GREEN);
tft.setTextSize(3);
tft.println(Sala);
tft.setTextColor(BLUE);
tft.setTextSize(3);
tft.println(Cozinha);
tft.setTextColor(RED);
tft.setTextSize(3);
tft.println(Resetar);
//PreenchimentoOFF
tft.setTextColor(WHITE);
tft.println(OFF);
tft.println(OFF);
tft.println(OFF);
tft.println(OFF);
}
voidloop()
{
TSPointp=ts.getPoint();
pinMode(XM,OUTPUT);
digitalWrite(XM,LOW);
pinMode(YP,OUTPUT);
digitalWrite(YP,HIGH);
pinMode(YM,OUTPUT);
digitalWrite(YM,LOW);
digitalWrite(YM,LOW);
pinMode(XP,OUTPUT);
digitalWrite(XP,HIGH);
if(p.z>MINPRESSURE&&p.z240)
{
Serial.print(py:);
Serial.print(p.y);
Serial.print(px:);
Serial.print(p.x);
//Testabotaoamarelo
if(p.y>190&p.y130&p.y75&p.y0&p.y<70)
{
if(valor_botao4==0)
{
tft.llRoundRect(256,181,60,48,5,RED);
mostra_on(269,195);
valor_botao4=!valor_botao4;
}
else
{
tft.llRoundRect(256,181,60,48,5,BLACK);
mostra_o(260,195);
valor_botao4=!valor_botao4;
}
}
}
}
}
voidmostra_on1(intx,inty)
{
tft.setTextColor(BLACK);
tft.setCursor(x,y);
tft.println(ON);
delay(100);
}
voidmostra_o1(intx,inty)
{
tft.setCursor(x,y);
tft.println(OFF);
delay(100);
}
voidmostra_on(intx,inty)
voidmostra_on(intx,inty)
{
tft.setTextColor(BLACK);
tft.setCursor(x,y);
tft.println(ON);
delay(100);
}
voidmostra_o(intx,inty)
{
tft.setCursor(x,y);
tft.println(OFF);
delay(100);
}
RESPONDER
mohammediyaddice:
07/02/2017en18:54
4.
0

0

i
Votaestecomentario
explainthesophisticatedthankyouverymuch
RESPONDER
ALEJANDROdice:
19/02/2017en17:03
5.
0

0

i
Votaestecomentario
Buenosdias,deantemanoagradezcosututorialylalibreriatanbienexplicada,quisierasolicitarsu
colaboracinantealgoextraoenmipantallalcd,compilaycargaelcodigobienperosiempredivide
lapantallaen2ysuplicalaletraeimagenesdelapantallaenlas2mitades,quierosabersiesalgun
errordecodigo(libreria)osisedebeaundefectodelapantallquecompregracias.
RESPONDER
CREAUNBLOGOUNSITIOWEBGRATUITOSCONWORDPRESS.COM.

TFT LCD Touch 2

Diunggah oleh

Informasi Dokumen

Hak Cipta

Format Tersedia

Bagikan dokumen Ini

Bagikan atau Tanam Dokumen

Opsi Berbagi

Apakah menurut Anda dokumen ini bermanfaat?

Apakah konten ini tidak pantas?

Hak Cipta:

Format Tersedia

TFT LCD Touch 2

Diunggah oleh

Hak Cipta:

Format Tersedia

TFTLCDTouch2.

05/03/201505/05/2015 IPADNANO 75COMENTARIOS

Anda mungkin juga menyukai