Taula de continguts:

Pantalla Arduino TFT Rainbow Noise: 5 passos
Pantalla Arduino TFT Rainbow Noise: 5 passos

Vídeo: Pantalla Arduino TFT Rainbow Noise: 5 passos

Vídeo: Pantalla Arduino TFT Rainbow Noise: 5 passos
Vídeo: Nextion touch TFT display examples | Digital power supply - part 1 2024, Juliol
Anonim
Image
Image
Efectes mitjançant un soroll suau
Efectes mitjançant un soroll suau

Hem creat aquest projecte arc de Sant Martí utilitzant diverses tècniques de "soroll", que creen efectes aleatoris controlats. Afegint una mica de color, es podria produir un efecte arc de Sant Martí. Utilitza un Arduino Nano i una pantalla OLED de 128x128. Vam mostrar els efectes mitjançant la biblioteca TFT. També hem utilitzat alguns components diversos, com ara una placa de pa i uns quants cables.

Pas 1: cablejat

La tasca més bàsica era el cablejat de l'OLED a l'Arduino. Hem connectat el GND i el VCC als respectius autobusos de la taula de pa; SCL al pin 13 digital; SDA al pin digital 11; RES al pin digital 8; CC al pin 9 digital; CS al pin digital 10 i finalment BL a 3,3V a l'Arduino. Mitjançant els pins de 5v i GND de l’Arduino vam poder alimentar tota la placa de pa.

Pas 2: soroll suau

Després d'inicialitzar els requisits per a la pantalla TFT. Per crear un efecte de soroll suau, primer necessitàvem una funció de soroll bàsica. Això retorna un valor relativament aleatori entre 0 i 1 basat en els valors x i y passats. És important tenir en compte que un ordinador mai no pot produir un resultat realment aleatori, i que aquesta aleatorietat només s’aconsegueix canviant el nombre tant com sigui possible., d'aquí els nombres molt grans de l'equació.

soroll flotant (int x, int y) {int n; n = x + y * 57; n + = (n << 13) ^ n; return (1.0 - ((n * ((n * n * 15731) + 789221) + 1376312589) & 0x7fffffff) / 1073741824.0); }

Després "suavitzem" el soroll amb una altra funció. Això s’aconsegueix produint un valor basat no només en el resultat de la coordenada passada a la funció, sinó també en les coordenades circumdants. Com a resultat d'això, les coordenades properes entre si produeixen un valor similar.

float smoothNoise (float x, float y) {float fractX = x - (int) x; fractura flotant Y = y - (int) y; int x1 = ((int) (x) + noiseWidth)% noiseWidth; int y1 = ((int) (y) + noiseHeight)% noiseHeight; int x2 = (x1 + noiseWidth - 1)% noiseWidth; int y2 = (y1 + noiseHeight - 1)% noiseHeight; valor flotant = 0,0f; valor + = fractX * fractY * noise (x1, y1); valor + = (1 - fractX) * fractY * soroll (x2, y1); valor + = fractX * (1 - fractY) * soroll (x1, y2); valor + = (1 - fractX) * (1 - fractY) * soroll (x2, y2); valor de retorn; }

Pas 3: efectes amb un soroll suau

Efectes mitjançant un soroll suau
Efectes mitjançant un soroll suau

Amb això vam crear dos efectes. Per fer-ho, hem recorregut cada píxel de l'OLED i hem pres un valor de soroll aleatori basat en les coordenades x i y d'aquests píxels. El primer d'aquests efectes el vam produir mitjançant l'ús del valor generat per escollir un color i vam acolorir aquest píxel amb el color esmentat. El segon efecte es va produir de manera similar, però també vam multiplicar el color pel valor de soroll generat. Això va donar al patró un efecte més ombrejat. El codi utilitzat es mostra a continuació:

void Noise2n3 (bool Noisy) {for (int y = 0; y <noiseHeight; y ++) {for (int x = 0; x 8) absNoise = 8; if (Noisy) setNoisyColour (colors [absNoise], soroll); else setBlockColour (colors [absNoise]); TFTscreen.point (x, y); }}} void setNoisyColour (Color de color, soroll flotant) {TFTscreen.stroke (color.red * noise, colour.green * noise, colour.blue * noise); } void setBlockColour (Color de color) {TFTscreen.stroke (color.red, color.green, color.blue); }

Pas 4: Efectes de gradient aleatori

Efectes de gradient aleatori
Efectes de gradient aleatori
Efectes de gradient aleatori
Efectes de gradient aleatori
Efectes de gradient aleatori
Efectes de gradient aleatori

Hi ha dos efectes que produeixen un gradient aleatori. El primer efecte situa els píxels en relació amb el seu color rgb, fent lentament un patró de degradat a la pantalla. El segon utilitza els mateixos píxels de colors que el primer, però els situa en un ordre fix, creant un degradat diagonal al llarg de la pantalla.

Aquí teniu el primer (basat en els colors):

void Noise1 () {for (int z = 0; z <3; z ++) {TFTscreen.background (0, 0, 0); int CurrentColour [3] [3] = {{64, 35, 26}, {24, 64, 34}, {20, 18, 64}}; R = Color actual [z] [0]; G = Color actual [z] [1]; B = Color actual [z] [2]; for (int x = 0; x <128; x ++) {for (int y = 0; y <128; y ++) {int R_Lower = R - ((x + y) / 4); if (R_Mai baix = 255) {R_Major = 254; } int R_Offset = random (R_Lower, R_Higher); int G_Inferior = G - ((x + y) / 4); if (G_Mai baix = 255) {G_Major = 254; } int G_Offset = random (G_Lower, G_Higher); int B_Inferior = B - ((x + y) / 4); if (B_Inferior <1) {B_Inferior = 0; } int B_Higher = B + ((x + y) / 4); if (B_Higher> = 255) {B_Higher = 254; } int B_Offset = random (B_Lower, B_Higher); int mult = 2; if (z == 1) mult = 1; TFTscreen.stroke (R_Offset * mult, G_Offset * mult, B_Offset * mult); TFTscreen.point ((R_Offset * (B_Offset / 32)), (G_Offset * (B_Offset / 32))); TFTscreen.point ((G_Offset * (B_Offset / 32)), (R_Offset * (B_Offset / 32))); TFTscreen.point ((B_Offset * (G_Offset / 32)), (R_Offset * (G_Offset / 32))); }}}}

I el segon (l’efecte més ordenat):

void Noise4 () {for (int z = 0; z <3; z ++) {TFTscreen.background (0, 0, 0); int CurrentColour [3] [3] = {{64, 35, 26}, {24, 64, 34}, {20, 18, 64}}; R = Color actual [z] [0]; G = Color actual [z] [1]; B = Color actual [z] [2]; for (int x = 0; x <128; x ++) {for (int y = 0; y <128; y ++) {int R_Lower = R - ((x + y) / 4); if (R_Mai baix = 255) {R_Major = 254; } int R_Offset = random (R_Lower, R_Higher); int G_Inferior = G - ((x + y) / 4); if (G_Mai baix = 255) {G_Major = 254; } int G_Offset = random (G_Lower, G_Higher); int B_Inferior = B - ((x + y) / 4); if (B_Inferior <1) {B_Inferior = 0; } int B_Higher = B + ((x + y) / 4); if (B_Higher> = 255) {B_Higher = 254; } int B_Offset = random (B_Lower, B_Higher); int mult = 2; if (z == 1) mult = 1; TFTscreen.stroke (R_Offset * mult, G_Offset * mult, B_Offset * mult); TFTscreen.point (x, y); }}}}

Pas 5: el resultat final

Al final, hem combinat aquests efectes en una mena de "presentació de diapositives" d'arcs de Sant Martí. Per aconseguir-ho, simplement anomenem cada funció després de l’altra en un bucle while:

mentre que (cert) {Soroll2n3 (fals); Noise2n3 (cert); TFTscreen.background (0, 0, 0); Soroll1 (); Soroll4 (); }

Recomanat: