Smart dials for round displays

1```cpp
2// Round display DIALS example by Flavio Stella 18/02/2023
3
4#include <Wire.h>
5#include "SPI.h"
6#include "Math.h"
7
8#include "Adafruit_GFX.h"
9#include "Adafruit_GC9A01A.h"
10
11#define TFT_DC 6
12#define TFT_CS 7
13
14// Color definitions          HEX       DEC      R   G   B
15// GC9A01A_BLACK              0x0000    0       0,    0,  0
16// GC9A01A_NAVY               0x000F    15      0,    0,123
17// GC9A01A_DARKGREEN          0x03E0    992     0,  125,  0
18// GC9A01A_DARKCYAN           0x03EF    1007    0,  125,123
19// GC9A01A_MAROON             0x7800    30720   123,  0,  0
20// GC9A01A_PURPLE             0x780F    30735   123,  0,123
21// GC9A01A_OLIVE              0x7BE0    31712   123,125,  0
22// GC9A01A_LIGHTGREY          0xC618    50712   198,195,198
23// GC9A01A_DARKGREY           0x7BEF    31727   123,125,123
24// GC9A01A_BLUE               0x001F    31      0,   0, 255
25// GC9A01A_GREEN              0x07E0    2016    0, 255,   0
26// GC9A01A_CYAN               0x07FF    2047    0, 255, 255
27// GC9A01A_RED                0xF800    63488   255, 0,   0
28// GC9A01A_MAGENTA            0xF81F    63519   255, 0, 255
29// GC9A01A_YELLOW             0xFFE0    65504   255,255,  0
30// GC9A01A_WHITE              0xFFFF    65535   255,255,255
31// GC9A01A_ORANGE             0xFD20    64800   255,165,  0
32// GC9A01A_GREENYELLOW        0xAFE5    45029   173,255, 41
33// GC9A01A_PINK               0xFC18    64536   255,130,198
34
35Adafruit_GC9A01A tft(TFT_CS, TFT_DC);
36
37int display_full_r = 120;   //120 is the radius for a 240x240 display
38int display_dial_r = 105;
39int display_text_r = 90;
40
41// ARRAY that contains the parameters to draw the 3 triangles that construct the dials
42// orientation of each dial is relative to its rotation 
43// with an operational rot = 2 the first raw ANG1 and the COL1 will appear as the "low" (i.e. red 63488 on top!)
44//                          ANG1 ANG2 ANG3 COL1   COL2   COL3               ROTATION
45int triangles_par[3][6] = { { 36, 15, 10,    31,   992, 63488},             // 0 - dial on the right
46                            { 27, 10, 10, 64800, 45029,  2047},             // 1 - dial at the bottom
47                            { 36, 25, 10, 63488,   992,    31},  };         // 2 - dial on the left
48
49// for the pointer hand example
50int k = 0;
51int kmax = 70; // -35 +35  
52
53int triang_vertex_1_x = 0;
54int triang_vertex_1_y = 0;
55int triang_vertex_2_x = 0;
56int triang_vertex_2_y = 0;
57int triang_vertex_3_x = 0;
58int triang_vertex_3_y = 0; 
59float tr1_ang = 0;
60float tr2_ang = 0;
61float tr3_ang = 0;
62float tr1_val_ang = 0;
63float arrow_width = 0.1;
64
65void setup() {
66  Serial.begin(115200);
67  delay(1000);
68  Serial.println("GC9A01A Test!");
69
70  tft.begin();
71  tft.fillScreen(GC9A01A_BLACK);
72
73  draw_dial3 ();  //inizialize the screen with the 3 dials
74  delay(1000);
75
76  tft.setRotation(2);
77}
78
79void loop(void) {
80  //example of a single triangle pointer on the left dial
81  k = (k+1)%kmax;
82
83  tr1_val_ang = radians(k-(int(kmax/2))); // POINTER HAND replace number with variable proportional to actual value of temp/hum
84
85  triang_vertex_1_x = display_full_r - int(cos(tr1_val_ang)*display_dial_r);
86  triang_vertex_1_y = display_full_r - int(sin(tr1_val_ang)*display_dial_r);
87  triang_vertex_2_x = display_full_r - int(cos(tr1_val_ang-arrow_width)*display_text_r);
88  triang_vertex_2_y = display_full_r - int(sin(tr1_val_ang-arrow_width)*display_text_r);
89  triang_vertex_3_x = display_full_r - int(cos(tr1_val_ang+arrow_width)*display_text_r);
90  triang_vertex_3_y = display_full_r - int(sin(tr1_val_ang+arrow_width)*display_text_r);
91
92 
93  tft.fillTriangle(triang_vertex_1_x, triang_vertex_1_y, triang_vertex_2_x, triang_vertex_2_y, triang_vertex_3_x, triang_vertex_3_y, GC9A01A_YELLOW);
94  delay(100);
95  //cancels previous draw to make the continuous animation... memory of previous value needed in real life application
96  tft.fillTriangle(triang_vertex_1_x, triang_vertex_1_y, triang_vertex_2_x, triang_vertex_2_y, triang_vertex_3_x, triang_vertex_3_y, GC9A01A_BLACK);
97
98}
99
100void draw_dial3 () {  // draws 3 filled triangles and then cancel the central area leaving filled arcs ready
101  for (int i = 0; i <= 2; i++) {
102    tft.setRotation(i);
103    triang_vertex_2_y = display_full_r - int(tan(float(radians(triangles_par[i][0])))*display_full_r);  // vertex on ANG1 (above x-axis minus sign)
104    triang_vertex_3_y = display_full_r - int(tan(float(radians(triangles_par[i][1])))*display_full_r);  // vertex on ANG2 (above x-axis minus sign)
105    tft.fillTriangle(display_full_r, display_full_r, 0, triang_vertex_2_y, 0, triang_vertex_3_y, triangles_par[i][3]);
106
107    triang_vertex_2_y = display_full_r - int(tan(float(radians(triangles_par[i][1])))*display_full_r);  // vertex on ANG2 (above x-axis minus sign)
108    triang_vertex_3_y = display_full_r + int(tan(float(radians(triangles_par[i][2])))*display_full_r);  // vertex on ANG3 (below x-axis plus sign)
109    tft.fillTriangle(display_full_r, display_full_r, 0, triang_vertex_2_y, 0, triang_vertex_3_y, triangles_par[i][4]);
110
111    triang_vertex_2_y = display_full_r + int(tan(float(radians(triangles_par[i][2])))*display_full_r);  // vertex on ANG3 (below x-axis plus sign)
112    triang_vertex_3_y = display_full_r + int(tan(float(radians(triangles_par[i][0])))*display_full_r);  // vertex on ANG1 (below x-axis plus sign)
113    tft.fillTriangle(display_full_r, display_full_r, 0, triang_vertex_2_y, 0, triang_vertex_3_y, triangles_par[i][5]);
114  }
115  tft.fillCircle(display_full_r, display_full_r, display_dial_r, GC9A01A_BLACK);
116}
117
118
119// BKP void draw_dial3 () {  // draws 3 filled triangles and then cancel the central area leaving filled arcs ready
120
121//   for (int i = 0; i <= 2; i++) {
122//     tft.setRotation(i);
123//     triang_vertex_2_y = display_full_r - int(tan(float(radians(triangles_par[i][0])))*display_full_r);
124//     triang_vertex_3_y = display_full_r - int(tan(float(radians(triangles_par[i][1])))*display_full_r);
125//     // triang_vertex_2_y = display_full_r - int(tan(tr1_ang)*display_full_r);
126//     // triang_vertex_3_y = display_full_r - int(tan(tr2_ang)*display_full_r);
127//     tft.fillTriangle(display_full_r, display_full_r, triang_vertex_2_x, 0, 0, triang_vertex_3_y, triangles_par[i][3]);
128
129//     // triang_vertex_2_y = display_full_r - int(tan(float(radians(triangles_par[i][1])))*display_full_r);
130//     // triang_vertex_3_y = display_full_r + int(tan(float(radians(triangles_par[i][2])))*display_full_r);
131//     // // triang_vertex_2_y = display_full_r - int(tan(tr2_ang)*display_full_r);
132//     // // triang_vertex_3_y = display_full_r + int(tan(tr3_ang)*display_full_r);
133//     // tft.fillTriangle(display_full_r, display_full_r, 0, triang_vertex_2_y, 0, triang_vertex_3_y, triangles_par[i][4]);
134//     // // tft.fillTriangle(display_full_r, display_full_r, 0, triang_vertex_2_y, 0, triang_vertex_3_y, tft.color565(0, 225, 125)); // RGB colors
135
136//     // triang_vertex_2_y = display_full_r + int(tan(float(radians(triangles_par[i][2])))*display_full_r);
137//     // triang_vertex_3_y = display_full_r + int(tan(float(radians(triangles_par[i][0])))*display_full_r);
138//     // // triang_vertex_2_y = display_full_r + int(tan(tr3_ang)*display_full_r);
139//     // // triang_vertex_3_y = display_full_r + int(tan(tr1_ang)*display_full_r);
140//     // tft.fillTriangle(display_full_r, display_full_r, 0, triang_vertex_2_y, 0, triang_vertex_3_y, triangles_par[i][5]);
141//   }
142//   // tft.fillCircle(display_full_r, display_full_r, display_dial_r, GC9A01A_BLACK);
143
144// }
145```