elements.c 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569
  1. #include "elements.h"
  2. #include "gui/canvas.h"
  3. #include <gui/icon_i.h>
  4. #include <gui/icon_animation_i.h>
  5. #include <m-string.h>
  6. #include <furi.h>
  7. #include "canvas_i.h"
  8. #include <string.h>
  9. #include <stdint.h>
  10. #include <stdbool.h>
  11. typedef struct {
  12. uint8_t x;
  13. uint8_t y;
  14. uint8_t leading_min;
  15. uint8_t leading_default;
  16. uint8_t height;
  17. uint8_t descender;
  18. uint8_t len;
  19. const char* text;
  20. } ElementTextBoxLine;
  21. void elements_progress_bar(
  22. Canvas* canvas,
  23. uint8_t x,
  24. uint8_t y,
  25. uint8_t width,
  26. uint8_t progress,
  27. uint8_t total) {
  28. furi_assert(canvas);
  29. furi_assert(total > 0);
  30. uint8_t height = 9;
  31. uint8_t marker_width = 7;
  32. furi_assert(width > marker_width);
  33. uint8_t progress_length = ((float)progress / total) * (width - marker_width - 2);
  34. // rframe doesnt work if (radius * 2) > any rect side, so write manually
  35. uint8_t x_max = x + width - 1;
  36. uint8_t y_max = y + height - 1;
  37. canvas_draw_line(canvas, x + 3, y, x_max - 3, y);
  38. canvas_draw_line(canvas, x_max - 3, y, x_max, y + 3);
  39. canvas_draw_line(canvas, x_max, y + 3, x_max, y_max - 3);
  40. canvas_draw_line(canvas, x_max, y_max - 3, x_max - 3, y_max);
  41. canvas_draw_line(canvas, x_max - 3, y_max, x + 3, y_max);
  42. canvas_draw_line(canvas, x + 3, y_max, x, y_max - 3);
  43. canvas_draw_line(canvas, x, y_max - 3, x, y + 3);
  44. canvas_draw_line(canvas, x, y + 3, x + 3, y);
  45. canvas_draw_rbox(canvas, x + 1, y + 1, marker_width + progress_length, height - 2, 3);
  46. canvas_invert_color(canvas);
  47. canvas_draw_dot(canvas, x + progress_length + 3, y + 2);
  48. canvas_draw_dot(canvas, x + progress_length + 4, y + 2);
  49. canvas_draw_dot(canvas, x + progress_length + 5, y + 3);
  50. canvas_draw_dot(canvas, x + progress_length + 6, y + 4);
  51. canvas_invert_color(canvas);
  52. }
  53. void elements_scrollbar_pos(
  54. Canvas* canvas,
  55. uint8_t x,
  56. uint8_t y,
  57. uint8_t height,
  58. uint16_t pos,
  59. uint16_t total) {
  60. furi_assert(canvas);
  61. // prevent overflows
  62. canvas_set_color(canvas, ColorWhite);
  63. canvas_draw_box(canvas, x - 3, y, 3, height);
  64. // dot line
  65. canvas_set_color(canvas, ColorBlack);
  66. for(uint8_t i = y; i < height + y; i += 2) {
  67. canvas_draw_dot(canvas, x - 2, i);
  68. }
  69. // Position block
  70. if(total) {
  71. float block_h = ((float)height) / total;
  72. canvas_draw_box(canvas, x - 3, y + (block_h * pos), 3, MAX(block_h, 1));
  73. }
  74. }
  75. void elements_scrollbar(Canvas* canvas, uint16_t pos, uint16_t total) {
  76. furi_assert(canvas);
  77. uint8_t width = canvas_width(canvas);
  78. uint8_t height = canvas_height(canvas);
  79. // prevent overflows
  80. canvas_set_color(canvas, ColorWhite);
  81. canvas_draw_box(canvas, width - 3, 0, 3, height);
  82. // dot line
  83. canvas_set_color(canvas, ColorBlack);
  84. for(uint8_t i = 0; i < height; i += 2) {
  85. canvas_draw_dot(canvas, width - 2, i);
  86. }
  87. // Position block
  88. if(total) {
  89. float block_h = ((float)height) / total;
  90. canvas_draw_box(canvas, width - 3, block_h * pos, 3, MAX(block_h, 1));
  91. }
  92. }
  93. void elements_frame(Canvas* canvas, uint8_t x, uint8_t y, uint8_t width, uint8_t height) {
  94. furi_assert(canvas);
  95. canvas_draw_line(canvas, x + 2, y, x + width - 2, y);
  96. canvas_draw_line(canvas, x + 1, y + height - 1, x + width, y + height - 1);
  97. canvas_draw_line(canvas, x + 2, y + height, x + width - 1, y + height);
  98. canvas_draw_line(canvas, x, y + 2, x, y + height - 2);
  99. canvas_draw_line(canvas, x + width - 1, y + 1, x + width - 1, y + height - 2);
  100. canvas_draw_line(canvas, x + width, y + 2, x + width, y + height - 2);
  101. canvas_draw_dot(canvas, x + 1, y + 1);
  102. }
  103. void elements_button_left(Canvas* canvas, const char* str) {
  104. const uint8_t button_height = 13;
  105. const uint8_t vertical_offset = 3;
  106. const uint8_t horizontal_offset = 3;
  107. const uint8_t string_width = canvas_string_width(canvas, str);
  108. const Icon* icon = &I_ButtonLeft_4x7;
  109. const uint8_t icon_offset = 3;
  110. const uint8_t icon_width_with_offset = icon->width + icon_offset;
  111. const uint8_t button_width = string_width + horizontal_offset * 2 + icon_width_with_offset;
  112. const uint8_t x = 0;
  113. const uint8_t y = canvas_height(canvas);
  114. canvas_draw_box(canvas, x, y - button_height, button_width, button_height);
  115. canvas_draw_line(canvas, x + button_width + 0, y, x + button_width + 0, y - button_height + 0);
  116. canvas_draw_line(canvas, x + button_width + 1, y, x + button_width + 1, y - button_height + 1);
  117. canvas_draw_line(canvas, x + button_width + 2, y, x + button_width + 2, y - button_height + 2);
  118. canvas_invert_color(canvas);
  119. canvas_draw_icon(
  120. canvas, x + horizontal_offset, y - button_height + vertical_offset, &I_ButtonLeft_4x7);
  121. canvas_draw_str(
  122. canvas, x + horizontal_offset + icon_width_with_offset, y - vertical_offset, str);
  123. canvas_invert_color(canvas);
  124. }
  125. void elements_button_right(Canvas* canvas, const char* str) {
  126. const uint8_t button_height = 13;
  127. const uint8_t vertical_offset = 3;
  128. const uint8_t horizontal_offset = 3;
  129. const uint8_t string_width = canvas_string_width(canvas, str);
  130. const Icon* icon = &I_ButtonRight_4x7;
  131. const uint8_t icon_offset = 3;
  132. const uint8_t icon_width_with_offset = icon->width + icon_offset;
  133. const uint8_t button_width = string_width + horizontal_offset * 2 + icon_width_with_offset;
  134. const uint8_t x = canvas_width(canvas);
  135. const uint8_t y = canvas_height(canvas);
  136. canvas_draw_box(canvas, x - button_width, y - button_height, button_width, button_height);
  137. canvas_draw_line(canvas, x - button_width - 1, y, x - button_width - 1, y - button_height + 0);
  138. canvas_draw_line(canvas, x - button_width - 2, y, x - button_width - 2, y - button_height + 1);
  139. canvas_draw_line(canvas, x - button_width - 3, y, x - button_width - 3, y - button_height + 2);
  140. canvas_invert_color(canvas);
  141. canvas_draw_str(canvas, x - button_width + horizontal_offset, y - vertical_offset, str);
  142. canvas_draw_icon(
  143. canvas,
  144. x - horizontal_offset - icon->width,
  145. y - button_height + vertical_offset,
  146. &I_ButtonRight_4x7);
  147. canvas_invert_color(canvas);
  148. }
  149. void elements_button_center(Canvas* canvas, const char* str) {
  150. const uint8_t button_height = 13;
  151. const uint8_t vertical_offset = 3;
  152. const uint8_t horizontal_offset = 1;
  153. const uint8_t string_width = canvas_string_width(canvas, str);
  154. const Icon* icon = &I_ButtonCenter_7x7;
  155. const uint8_t icon_offset = 3;
  156. const uint8_t icon_width_with_offset = icon->width + icon_offset;
  157. const uint8_t button_width = string_width + horizontal_offset * 2 + icon_width_with_offset;
  158. const uint8_t x = (canvas_width(canvas) - button_width) / 2;
  159. const uint8_t y = canvas_height(canvas);
  160. canvas_draw_box(canvas, x, y - button_height, button_width, button_height);
  161. canvas_draw_line(canvas, x - 1, y, x - 1, y - button_height + 0);
  162. canvas_draw_line(canvas, x - 2, y, x - 2, y - button_height + 1);
  163. canvas_draw_line(canvas, x - 3, y, x - 3, y - button_height + 2);
  164. canvas_draw_line(canvas, x + button_width + 0, y, x + button_width + 0, y - button_height + 0);
  165. canvas_draw_line(canvas, x + button_width + 1, y, x + button_width + 1, y - button_height + 1);
  166. canvas_draw_line(canvas, x + button_width + 2, y, x + button_width + 2, y - button_height + 2);
  167. canvas_invert_color(canvas);
  168. canvas_draw_icon(
  169. canvas, x + horizontal_offset, y - button_height + vertical_offset, &I_ButtonCenter_7x7);
  170. canvas_draw_str(
  171. canvas, x + horizontal_offset + icon_width_with_offset, y - vertical_offset, str);
  172. canvas_invert_color(canvas);
  173. }
  174. void elements_multiline_text_aligned(
  175. Canvas* canvas,
  176. uint8_t x,
  177. uint8_t y,
  178. Align horizontal,
  179. Align vertical,
  180. const char* text) {
  181. furi_assert(canvas);
  182. furi_assert(text);
  183. uint8_t font_height = canvas_current_font_height(canvas);
  184. string_t str;
  185. string_init(str);
  186. const char* start = text;
  187. char* end;
  188. // get lines count
  189. uint8_t i, lines_count;
  190. for(i = 0, lines_count = 0; text[i]; i++) lines_count += (text[i] == '\n');
  191. switch(vertical) {
  192. case AlignBottom:
  193. y -= font_height * lines_count;
  194. break;
  195. case AlignCenter:
  196. y -= (font_height * lines_count) / 2;
  197. break;
  198. case AlignTop:
  199. default:
  200. break;
  201. }
  202. do {
  203. end = strchr(start, '\n');
  204. if(end) {
  205. string_set_strn(str, start, end - start);
  206. } else {
  207. string_set_str(str, start);
  208. }
  209. uint16_t len_px = canvas_string_width(canvas, string_get_cstr(str));
  210. uint8_t px_left =
  211. canvas_width(canvas) - (x - (horizontal == AlignCenter ? len_px / 2 : 0));
  212. // hacky
  213. if(len_px > px_left) {
  214. string_t buff;
  215. string_init_set(buff, str);
  216. size_t s_len = string_size(str);
  217. uint8_t end_pos = s_len - ((len_px - px_left) / (len_px / s_len) + 5);
  218. string_left(buff, end_pos);
  219. string_cat(buff, "-");
  220. string_right(str, end_pos);
  221. canvas_draw_str_aligned(canvas, x, y, horizontal, vertical, string_get_cstr(buff));
  222. string_clear(buff);
  223. start = end + 1;
  224. y += font_height;
  225. }
  226. canvas_draw_str_aligned(canvas, x, y, horizontal, vertical, string_get_cstr(str));
  227. start = end + 1;
  228. y += font_height;
  229. } while(end);
  230. string_clear(str);
  231. }
  232. void elements_multiline_text(Canvas* canvas, uint8_t x, uint8_t y, const char* text) {
  233. furi_assert(canvas);
  234. furi_assert(text);
  235. uint8_t font_height = canvas_current_font_height(canvas);
  236. string_t str;
  237. string_init(str);
  238. const char* start = text;
  239. char* end;
  240. do {
  241. end = strchr(start, '\n');
  242. if(end) {
  243. string_set_strn(str, start, end - start);
  244. } else {
  245. string_set_str(str, start);
  246. }
  247. canvas_draw_str(canvas, x, y, string_get_cstr(str));
  248. start = end + 1;
  249. y += font_height;
  250. } while(end && y < 64);
  251. string_clear(str);
  252. }
  253. void elements_multiline_text_framed(Canvas* canvas, uint8_t x, uint8_t y, const char* text) {
  254. furi_assert(canvas);
  255. furi_assert(text);
  256. uint8_t font_y = canvas_current_font_height(canvas);
  257. uint16_t str_width = canvas_string_width(canvas, text);
  258. // count \n's
  259. uint8_t lines = 1;
  260. const char* t = text;
  261. while(*t != '\0') {
  262. if(*t == '\n') {
  263. lines++;
  264. uint16_t temp_width = canvas_string_width(canvas, t + 1);
  265. str_width = temp_width > str_width ? temp_width : str_width;
  266. }
  267. t++;
  268. }
  269. canvas_set_color(canvas, ColorWhite);
  270. canvas_draw_box(canvas, x, y - font_y, str_width + 8, font_y * lines + 4);
  271. canvas_set_color(canvas, ColorBlack);
  272. elements_multiline_text(canvas, x + 4, y - 1, text);
  273. elements_frame(canvas, x, y - font_y, str_width + 8, font_y * lines + 4);
  274. }
  275. void elements_slightly_rounded_frame(
  276. Canvas* canvas,
  277. uint8_t x,
  278. uint8_t y,
  279. uint8_t width,
  280. uint8_t height) {
  281. furi_assert(canvas);
  282. canvas_draw_rframe(canvas, x, y, width, height, 1);
  283. }
  284. void elements_slightly_rounded_box(
  285. Canvas* canvas,
  286. uint8_t x,
  287. uint8_t y,
  288. uint8_t width,
  289. uint8_t height) {
  290. furi_assert(canvas);
  291. canvas_draw_rbox(canvas, x, y, width, height, 1);
  292. }
  293. void elements_bubble(Canvas* canvas, uint8_t x, uint8_t y, uint8_t width, uint8_t height) {
  294. furi_assert(canvas);
  295. canvas_draw_rframe(canvas, x + 4, y, width, height, 3);
  296. uint8_t y_corner = y + height * 2 / 3;
  297. canvas_draw_line(canvas, x, y_corner, x + 4, y_corner - 4);
  298. canvas_draw_line(canvas, x, y_corner, x + 4, y_corner + 4);
  299. canvas_set_color(canvas, ColorWhite);
  300. canvas_draw_line(canvas, x + 4, y_corner - 3, x + 4, y_corner + 3);
  301. canvas_set_color(canvas, ColorBlack);
  302. }
  303. void elements_string_fit_width(Canvas* canvas, string_t string, uint8_t width) {
  304. furi_assert(canvas);
  305. furi_assert(string);
  306. uint16_t len_px = canvas_string_width(canvas, string_get_cstr(string));
  307. if(len_px > width) {
  308. width -= canvas_string_width(canvas, "...");
  309. do {
  310. string_left(string, string_size(string) - 1);
  311. len_px = canvas_string_width(canvas, string_get_cstr(string));
  312. } while(len_px > width);
  313. string_cat(string, "...");
  314. }
  315. }
  316. void elements_text_box(
  317. Canvas* canvas,
  318. uint8_t x,
  319. uint8_t y,
  320. uint8_t width,
  321. uint8_t height,
  322. Align horizontal,
  323. Align vertical,
  324. const char* text) {
  325. furi_assert(canvas);
  326. ElementTextBoxLine line[ELEMENTS_MAX_LINES_NUM];
  327. bool bold = false;
  328. bool mono = false;
  329. bool inversed = false;
  330. bool inversed_present = false;
  331. Font current_font = FontSecondary;
  332. Font prev_font = FontSecondary;
  333. CanvasFontParameters* font_params = canvas_get_font_params(canvas, current_font);
  334. // Fill line parameters
  335. uint8_t line_leading_min = font_params->leading_min;
  336. uint8_t line_leading_default = font_params->leading_default;
  337. uint8_t line_height = font_params->height;
  338. uint8_t line_descender = font_params->descender;
  339. uint8_t line_num = 0;
  340. uint8_t line_width = 0;
  341. uint8_t line_len = 0;
  342. uint8_t total_height_min = 0;
  343. uint8_t total_height_default = 0;
  344. uint16_t i = 0;
  345. bool full_text_processed = false;
  346. canvas_set_font(canvas, FontSecondary);
  347. // Fill all lines
  348. line[0].text = text;
  349. for(i = 0; !full_text_processed; i++) {
  350. line_len++;
  351. // Identify line height
  352. if(prev_font != current_font) {
  353. font_params = canvas_get_font_params(canvas, current_font);
  354. line_leading_min = MAX(line_leading_min, font_params->leading_min);
  355. line_leading_default = MAX(line_leading_default, font_params->leading_default);
  356. line_height = MAX(line_height, font_params->height);
  357. line_descender = MAX(line_descender, font_params->descender);
  358. prev_font = current_font;
  359. }
  360. // Set the font
  361. if(text[i] == '\e' && text[i + 1]) {
  362. i++;
  363. line_len++;
  364. if(text[i] == ELEMENTS_BOLD_MARKER) {
  365. if(bold) {
  366. current_font = FontSecondary;
  367. } else {
  368. current_font = FontPrimary;
  369. }
  370. canvas_set_font(canvas, current_font);
  371. bold = !bold;
  372. }
  373. if(text[i] == ELEMENTS_MONO_MARKER) {
  374. if(mono) {
  375. current_font = FontSecondary;
  376. } else {
  377. current_font = FontKeyboard;
  378. }
  379. canvas_set_font(canvas, FontKeyboard);
  380. mono = !mono;
  381. }
  382. if(text[i] == ELEMENTS_INVERSED_MARKER) {
  383. inversed_present = true;
  384. }
  385. continue;
  386. }
  387. if(text[i] != '\n') {
  388. line_width += canvas_glyph_width(canvas, text[i]);
  389. }
  390. // Process new line
  391. if(text[i] == '\n' || text[i] == '\0' || line_width > width) {
  392. if(line_width > width) {
  393. line_width -= canvas_glyph_width(canvas, text[i--]);
  394. line_len--;
  395. }
  396. if(text[i] == '\0') {
  397. full_text_processed = true;
  398. }
  399. if(inversed_present) {
  400. line_leading_min += 1;
  401. line_leading_default += 1;
  402. inversed_present = false;
  403. }
  404. line[line_num].leading_min = line_leading_min;
  405. line[line_num].leading_default = line_leading_default;
  406. line[line_num].height = line_height;
  407. line[line_num].descender = line_descender;
  408. if(total_height_min + line_leading_min > height) {
  409. line_num--;
  410. break;
  411. }
  412. total_height_min += line_leading_min;
  413. total_height_default += line_leading_default;
  414. line[line_num].len = line_len;
  415. if(horizontal == AlignCenter) {
  416. line[line_num].x = x + (width - line_width) / 2;
  417. } else if(horizontal == AlignRight) {
  418. line[line_num].x = x + (width - line_width);
  419. } else {
  420. line[line_num].x = x;
  421. }
  422. line[line_num].y = total_height_min;
  423. line_num++;
  424. if(text[i + 1]) {
  425. line[line_num].text = &text[i + 1];
  426. }
  427. line_leading_min = font_params->leading_min;
  428. line_height = font_params->height;
  429. line_descender = font_params->descender;
  430. line_width = 0;
  431. line_len = 0;
  432. }
  433. }
  434. // Set vertical alignment for all lines
  435. if(full_text_processed) {
  436. if(total_height_default < height) {
  437. if(vertical == AlignTop) {
  438. line[0].y = y + line[0].height;
  439. } else if(vertical == AlignCenter) {
  440. line[0].y = y + line[0].height + (height - total_height_default) / 2;
  441. } else if(vertical == AlignBottom) {
  442. line[0].y = y + line[0].height + (height - total_height_default);
  443. }
  444. if(line_num > 1) {
  445. for(uint8_t i = 1; i < line_num; i++) {
  446. line[i].y = line[i - 1].y + line[i - 1].leading_default;
  447. }
  448. }
  449. } else if(line_num > 1) {
  450. uint8_t free_pixel_num = height - total_height_min;
  451. uint8_t fill_pixel = 0;
  452. uint8_t j = 1;
  453. line[0].y = line[0].height;
  454. while(fill_pixel < free_pixel_num) {
  455. line[j].y = line[j - 1].y + line[j - 1].leading_min + 1;
  456. fill_pixel++;
  457. j = j % (line_num - 1) + 1;
  458. }
  459. }
  460. }
  461. // Draw line by line
  462. canvas_set_font(canvas, FontSecondary);
  463. bold = false;
  464. mono = false;
  465. inversed = false;
  466. for(uint8_t i = 0; i < line_num; i++) {
  467. for(uint8_t j = 0; j < line[i].len; j++) {
  468. // Process format symbols
  469. if(line[i].text[j] == ELEMENTS_BOLD_MARKER) {
  470. if(bold) {
  471. current_font = FontSecondary;
  472. } else {
  473. current_font = FontPrimary;
  474. }
  475. canvas_set_font(canvas, current_font);
  476. bold = !bold;
  477. continue;
  478. }
  479. if(line[i].text[j] == ELEMENTS_MONO_MARKER) {
  480. if(mono) {
  481. current_font = FontSecondary;
  482. } else {
  483. current_font = FontKeyboard;
  484. }
  485. canvas_set_font(canvas, current_font);
  486. mono = !mono;
  487. continue;
  488. }
  489. if(line[i].text[j] == ELEMENTS_INVERSED_MARKER) {
  490. inversed = !inversed;
  491. continue;
  492. }
  493. if(inversed) {
  494. canvas_draw_box(
  495. canvas,
  496. line[i].x - 1,
  497. line[i].y - line[i].height - 1,
  498. canvas_glyph_width(canvas, line[i].text[j]) + 1,
  499. line[i].height + line[i].descender + 2);
  500. canvas_invert_color(canvas);
  501. canvas_draw_glyph(canvas, line[i].x, line[i].y, line[i].text[j]);
  502. canvas_invert_color(canvas);
  503. } else {
  504. canvas_draw_glyph(canvas, line[i].x, line[i].y, line[i].text[j]);
  505. }
  506. line[i].x += canvas_glyph_width(canvas, line[i].text[j]);
  507. }
  508. }
  509. canvas_set_font(canvas, FontSecondary);
  510. }