Máy tính màn hình cảm ứng Arduino: 7 bước

2024 Tác giả: John Day | [email protected]. Sửa đổi lần cuối: 2024-01-30 13:32

Xin chào! Đây là dự án chế tạo máy tính màn hình cảm ứng sử dụng Arduino Uno và tấm chắn TFT LCD. Tôi đã đưa ra ý tưởng cho lớp học lập trình tại nhà của mình và trải nghiệm xây dựng dự án này rất thú vị. Máy tính này có thể thực hiện bốn phép toán đơn giản (cộng, trừ, nhân và chia). Nó cũng hiển thị tối đa hai điểm thập phân cho các câu trả lời phép chia có chúng. Hãy đi sâu vào ngay! Các nguồn cung cấp cho dự án này được liệt kê dưới đây.

Quân nhu

- Arduino Uno

- Tấm chắn màn hình LCD 2.4 TFT (đây là nơi tôi đã mua nó:

- Cáp USB A to B (dây kết nối Arduino với máy tính)

- Máy tính có cài đặt Arduino IDE

- Bạn cũng sẽ cần tải xuống hai thư viện: MCUFRIEND_kbv và Màn hình cảm ứng. Cái đầu tiên bạn có thể tìm thấy trên github (liên kết: https://github.com/prenticedavid/MCUFRIEND_kbv) hoặc bạn có thể sử dụng tệp zip thư viện mà tôi đã đưa vào bên dưới. Thứ hai là trong trình quản lý Thư viện Arduino để cài đặt.

Bước 1: Kết nối phần cứng

Việc kết nối tấm chắn màn hình cảm ứng với Arduino Uno rất đơn giản và nhanh chóng. Tất cả những gì bạn phải làm là xếp các chân thấp nhất trên tấm chắn với các chân thấp nhất trên Arduino và đẩy tấm chắn vào các chân. Chân 5V trên cùng và chân không được dán nhãn ở phía nguồn không được có chân từ tấm chắn bên trong chúng, với các thông số tương tự áp dụng cho các chân có nhãn SCL và SDA ở phía bên kia của bảng. Bây giờ, chúng tôi đã sẵn sàng để viết mã!

Bước 2: Mã: Định nghĩa & Thiết lập Toàn cầu

#bao gồm

MCUFRIEND_kbv tft; // dù sao cũng có dây cứng cho các lá chắn UNO

#bao gồm

#define YP A3

#define XM A2

#define YM 9

#define XP 8

TouchScreen ts = Màn hình cảm ứng (XP, YP, XM, YM, 300);

#define MINPRESSURE 10

Đây là phần đầu của mã, nơi chúng tôi bao gồm các thư viện (MCUFRIEND_kbv & Màn hình cảm ứng), xác định các chân X và Y, thiết lập các thông số màn hình cảm ứng và xác định áp suất tối thiểu cần thiết để Arduino đăng ký một lần nhấn của người dùng.

int ID;

int user_selection;

float save_number = 0;

số hạng float1;

int op_num;

kết quả float;

int cursorLocX = 5;

int cursorLocY = 20;

Ngay trước khi thiết lập, chúng ta cần thiết lập một số biến toàn cục. ID giúp khởi động và chạy màn hình cảm ứng. user_selection giữ một số tương ứng với phím mà người dùng chọn khi nhấn vào màn hình cảm ứng. Save_number là biến mà chúng ta in ra màn hình sau một lần nhập của người dùng (thêm về điều này trong vòng lặp). Nó là một float nên nó có thể chứa số thập phân cũng như số nguyên. term1 là biến mà số đầu tiên của phương trình được lưu vào sau khi một toán hạng được chọn. op_num lưu toán hạng dưới dạng số (1 cho phép cộng, 2 cho phép trừ, 3 cho phép nhân và 4 cho phép chia). kết quả là biến được in ra màn hình sau khi người dùng nhấn dấu bằng. Nó cũng là một chiếc phao. cursorLocX và cursorLocY là các điểm ánh xạ trên màn hình cảm ứng nơi con trỏ được đặt thành nhiều lần (nó nằm trong thanh màu xám ở trên cùng, còn được gọi là trường kết quả).

void setup () {

tft.reset ();

ID = tft.readID ();

tft.begin (ID);

tft.setRotation (0);

tft.fillScreen (TFT_DARKGREY);

hình vuông ();

số ();

tft.setTextSize (3);

tft.setTextColor (TFT_BLUE, TFT_DARKGREY);

}

Chức năng thiết lập của chúng tôi trước tiên chứa phần khởi tạo cho tấm chắn màn hình cảm ứng (dòng 1-3). Hướng của tấm chắn được đặt bằng lệnh tft.setRotation (), với 0 là thẳng đứng. Toàn bộ màn hình có màu xám đậm với lệnh tft.fillScreen (), mà chúng tôi sẽ viết ở trên cùng (ngoại trừ trường kết quả). Các hàm vuông () và số () vẽ các ô vuông của máy tính, tô màu các ô vuông màu đen và trắng theo kiểu bàn cờ, và viết số / toán hạng trên các ô vuông bằng màu xanh lam. Chúng ta sẽ nói đến những điều đó trong bước tiếp theo. Lệnh tft.setTextSize () đặt kích thước văn bản của trường kết quả thành 3, đây là phông chữ trung bình. Lệnh tft.setTextColor () đặt màu văn bản của trường kết quả thành màu xanh lam, được viết trên trường màu xám đậm.

Bước 3: Mã: Vòng lặp

void loop () {numberSelect ();

chậm trễ (100);

if (user_selection == 16) {

;

}khác{

if (user_selection <10) {

save_number = save_number * 10 + user_selection;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (lưu_số);

} else if (user_selection> 10) {

chuyển đổi (user_selection) {

trường hợp 11:

op_num = 1;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("+");

term1 = save_number;

số_lưu_lượng = 0;

nghỉ;

trường hợp 12:

op_num = 2;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("-");

term1 = save_number;

số_lưu_lượng = 0;

nghỉ;

trường hợp 13:

op_num = 3;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("X");

term1 = save_number;

số_lưu_lượng = 0;

nghỉ;

trường hợp 14:

op_num = 4;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("/");

term1 = save_number;

số_lưu_lượng = 0;

nghỉ;

trường hợp 15:

số_lưu_đổi = 0;

số hạng1 = 0;

op_num = 0;

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("");

nghỉ;

}

tft.setCursor (cursorLocX, cursorLocY);

Điều này là rất nhiều để nhai, vì vậy tôi sẽ giải thích những gì ở trên. Chúng ta bắt đầu bằng cách gọi hàm numberSelect (), hàm này sẽ gán một số cho mỗi ô vuông trên màn hình cảm ứng. Khi người dùng nhấn vào một trong những ô vuông đó, hàm sẽ đặt biến user_selection thành số ô vuông. Câu lệnh if đầu tiên chỉ chạy qua vòng lặp nếu một lựa chọn người dùng hợp lệ đã được thực hiện. Nếu có, câu lệnh if tiếp theo hỏi user_selection có một số nhỏ hơn 10 được lưu vào đó hay không (các số 0-9). Nếu đúng như vậy, save_number được nhân với 10 và số trong user_selection được thêm vào save_number, được in trong trường kết quả trên màn hình cảm ứng. Nếu không, câu lệnh if tiếp theo sẽ hỏi liệu user_selection có một số lớn hơn 10 được lưu vào nó hay không (các số toán hạng: 11 cho +, 12 cho -, 13 cho X, 14 cho / và 15 cho hình vuông màn hình rõ ràng). Một chức năng chuyển đổi sẽ xử lý từng trường hợp (được xác định bởi user_selection). Biến op_num được cung cấp một số tương ứng với toán hạng đã được chọn (1 cho +, 2 cho -, 3 cho X và 4 cho /). Giá trị trong save_number được lưu vào biến term1 để biến save_number có thể được sử dụng cho nửa sau của phương trình. Biểu tượng toán hạng được in trên màn hình cùng với việc xóa bất kỳ số nào trong trường kết quả. Ngoại lệ duy nhất là hình vuông màn hình rõ ràng, đặt lại tất cả các biến tính toán và xóa trường kết quả của bất kỳ thứ gì trên đó.

}khác{

chuyển đổi (op_num) {

trường hợp 1:

result = term1 + save_number;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (double (kết quả));

nghỉ;

trường hợp 2:

result = term1 - save_number;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (double (kết quả));

nghỉ;

trường hợp 3:

result = term1 * save_number;

tft.setCursor (cursorLocX, cursorLocY);

tft.print (double (kết quả));

nghỉ;

trường hợp 4:

result = float (term1) / float (save_number);

tft.setCursor (cursorLocX, cursorLocY);

tft.print (kết quả);

nghỉ;

}

tft.setCursor (cursorLocX, cursorLocY);

save_number = kết quả;

số hạng1 = 0;

op_num = 0;

chậm trễ (1000);

}

}

}

Phần cuối cùng của vòng lặp đề cập đến sự kiện người dùng chọn dấu bằng (user_selection == 10). Một hàm chuyển đổi khác hoạt động thông qua bốn hàm toán học (được xác định bởi op_num). Trường hợp cộng (trường hợp 1) thêm số hạng1 và số lưu_kết lại với nhau và lưu số vào biến kết quả. Kết quả được in ra trường kết quả dưới dạng kép. Trường hợp trừ (trường hợp 2) trừ số đã lưu từ số hạng 1 và lưu số vào biến kết quả. Kết quả được in ra trường kết quả dưới dạng kép. Trường hợp nhân (trường hợp 3) nhân số hạng 1 với số đã lưu và lưu số vào biến kết quả. Kết quả được in ra trường kết quả dưới dạng một dấu kép. Trường hợp chia (trường hợp 4) chia số hạng 1 cho số đã lưu cùng nhau và lưu số vào biến kết quả. Kết quả được in ra trường kết quả dưới dạng số nổi (vì các câu trả lời phép chia có thể là số thập phân). Sau khi sự kiện của một số, toán hạng hoặc kết quả được in ra màn hình, con trỏ được đặt lại, số lưu_được đặt thành kết quả trước đó và thuật ngữ1 & op_num được đặt lại.

Một số lưu ý: người dùng không thể nhập số thập phân vào máy tính do thiếu ô vuông dấu thập phân. Ngoài ra, người dùng chỉ có thể thực hiện một phương trình tại một thời điểm. Bạn không thể tính toán một kết quả và sau đó cộng / trừ / nhân / chia kết quả đó. Trong hàm numberSelect (), có một hàm xóa màn hình sau khi một kết quả được in ra nếu người dùng nhấn vào một ô vuông khác.

Bước 4: Mã: Hàm bình phương

void square () {

// hình vuông đen và trắng xen kẽ trên mỗi hàng và hàng đầu tiên và hàng thứ ba có kiểu đối lập với hàng thứ hai và thứ tư

tft.fillRect (0, 60, 60, 65, TFT_BLACK); // hàng đầu tiên của ô vuông bắt đầu, từ đen sang trắng tft.fillRect (60, 60, 60, 65, TFT_WHITE);

tft.fillRect (120, 60, 60, 65, TFT_BLACK);

tft.fillRect (180, 60, 60, 65, TFT_WHITE); // hàng đầu tiên của ô vuông kết thúc

tft.fillRect (0, 125, 60, 65, TFT_WHITE); // hàng thứ hai của ô vuông bắt đầu, từ trắng sang đen tft.fillRect (60, 125, 60, 65, TFT_BLACK);

tft.fillRect (120, 125, 60, 65, TFT_WHITE);

tft.fillRect (180, 125, 60, 65, TFT_BLACK); // hàng thứ hai của ô vuông kết thúc

tft.fillRect (0, 190, 60, 65, TFT_BLACK); // hàng thứ ba của ô vuông bắt đầu, từ đen sang trắng tft.fillRect (60, 190, 60, 65, TFT_WHITE);

tft.fillRect (120, 190, 60, 65, TFT_BLACK);

tft.fillRect (180, 190, 60, 65, TFT_WHITE); // hàng thứ ba của hình vuông kết thúc

tft.fillRect (0, 255, 60, 65, TFT_WHITE); // hàng thứ tư của ô vuông bắt đầu, từ trắng sang đen tft.fillRect (60, 255, 60, 65, TFT_BLACK);

tft.fillRect (120, 255, 60, 65, TFT_WHITE);

tft.fillRect (180, 255, 60, 65, TFT_BLACK); // hàng thứ tư của ô vuông kết thúc

}

Hàm square () khá đơn giản. Lệnh tft.fillRect (X1, Y1, X2, Y2, TFT_COLOR) vẽ một hình chữ nhật theo các tham số được truyền cho nó, là vị trí đầu tiên của x và y, vị trí thứ hai của x và y và màu mà hình chữ nhật được tô. Hàm này vẽ tất cả bốn hàng hình vuông (về mặt kỹ thuật là hình chữ nhật) và tô màu cho từng ô vuông.

Bước 5: Mã: Hàm số

void số () {

tft.setTextColor (TFT_BLUE); // đặt số / màu ký tự thành xanh lam

tft.setTextSize (5); // đặt số / kích thước ký tự thành 5

tft.setCursor (18, 75); // đặt con trỏ cho dòng số / ký tự đầu tiên

tft.print ("7 8 9 /"); // in dòng số / ký tự đầu tiên

tft.setCursor (18, 140); // đặt con trỏ cho dòng số / ký tự thứ hai

tft.print ("4 5 6 X"); // in dòng số / ký tự thứ hai

tft.setCursor (18, 205); // đặt con trỏ cho dòng số / ký tự thứ ba

tft.print ("1 2 3 -"); // in dòng số / ký tự thứ ba

tft.setCursor (18, 270); // đặt con trỏ cho dòng số / ký tự thứ tư

tft.print ("C 0 = +"); // in dòng thứ tư của số / ký tự

}

Hàm number () cũng đơn giản. Hai dòng đầu tiên đặt kích thước văn bản lớn hơn và màu xanh lam. Lệnh tft.setCursor () đặt con trỏ đến vị trí trên mỗi hàng nơi bắt đầu viết các số. Sau đó, lệnh tft.print () in các số / ký tự lên các ô vuông.

Bước 6: Mã: Chức năng NumberSelect

void numberSelect () {

TSPoint p = ts.getPoint ();

pinMode (XM, OUTPUT);

pinMode (YP, OUTPUT);

if (p.z> MINPRESSURE) {

p.x = bản đồ (p.x, 250, 845, 0, 239);

p.y = bản đồ (p.y, 245, 860, 0, 319);

if (kết quả! = 0) {

kết quả = 0;

số_lưu_đổi = 0;

tft.print ("GIÁ TRỊ RÕ RÀNG");

chậm trễ (500);

tft.setCursor (cursorLocX, cursorLocY);

tft.print ("");

tft.setCursor (cursorLocX, cursorLocY);

}

Để bắt đầu hàm numberSelect (), chúng tôi yêu cầu người dùng nhập liệu từ màn hình cảm ứng bằng lệnh ts.getPoint (). Sau khi dữ liệu đó đã được thu thập, chúng tôi sẽ kiểm tra xem liệu áp suất tối thiểu có bị vượt quá hay không (hay nói cách khác, nếu người dùng đã nhấn vào vị trí nào đó trên màn hình cảm ứng). Nếu đúng như vậy, tọa độ x và y được ánh xạ từ tọa độ Descartes sang tọa độ dành riêng cho màn hình cảm ứng. (0, 0) là góc trên cùng bên trái của màn hình cảm ứng, với trục x đi ngang và trục y đi xuống. Phần tiếp theo kiểm tra xem có một số được lưu trong kết quả hay không. Nếu có, kết quả và số lưu được đặt lại thành 0. Thông báo "GIÁ TRỊ XÓA" được in trên trường kết quả và màn hình bị xóa khi con trỏ quay trở lại vị trí ban đầu.

if (p.y 60) {// hàng đầu tiên của hình vuông

nếu (p.x <60)

user_selection = 7;

khác nếu (p.x <120)

user_selection = 8;

khác nếu (p.x <180)

user_selection = 9;

else user_selection = 14;

} else if (p.y 125) {// hàng ô vuông thứ hai

nếu (p.x <60)

user_selection = 4;

khác nếu (p.x <120)

user_selection = 5;

khác nếu (p.x <180)

user_selection = 6;

else user_selection = 13;

} else if (p.y 190) {// hàng thứ ba của hình vuông

nếu (p.x <60)

user_selection = 1;

khác nếu (p.x <120)

user_selection = 2;

khác nếu (p.x <180)

user_selection = 3;

else user_selection = 12;

} else if (p.y> 255) {// hàng thứ tư của hình vuông

nếu (p.x <60)

user_selection = 15;

khác nếu (p.x <120)

user_selection = 0;

khác nếu (p.x <180)

user_selection = 10;

else user_selection = 11;

}

}khác{

user_selection = 16; // user_selection được đặt thành 16 (không có biến)

}

}

Đây là phần quyết định nút nào đã được chọn. Bắt đầu với hàng hình vuông trên cùng và kết thúc với hàng dưới cùng, Arduino tìm kiếm vị trí mà màn hình thực sự được nhấn. Sau đó, nó gán cho ô vuông một số và lưu số đó vào user_selection. Các số 0-9 tương ứng với các ô vuông số, các số 11-15 tương ứng với các ô vuông toán hạng và ô vuông rõ ràng, và số 10 tương ứng với ô vuông dấu bằng. Nếu không có ô vuông nào được chọn, thì user_selection được đặt thành 16, điều này sẽ làm cho vòng lặp bắt đầu lại (xem chức năng vòng lặp).

Bước 7: Tận hưởng dự án đã hoàn thành của bạn

Đây là bạn có nó! Giờ đây, bạn có một máy tính màn hình cảm ứng có thể thực hiện các phép tính cộng, trừ, nhân và chia. Dự án này đã thay đổi toàn bộ cách tôi nghĩ máy tính hoạt động. Khi thực hiện dự án này, tôi nhớ đã nói với người hướng dẫn ở lớp rằng "Tôi sẽ không bao giờ nhìn vào máy tính cùng một cách nữa!" Các chức năng mà bạn với tư cách là người dùng nghĩ là dễ dàng nhưng lại hơi khó khi bạn ngồi sau máy tính đang cố gắng mô phỏng ý tưởng của mình. Tôi hy vọng bạn thích dự án và tôi hy vọng suy nghĩ của bạn về cách hoạt động của máy tính cũng đã được thay đổi!

Đây là toàn bộ mã để bạn thuận tiện. Nó chứa đầy các bình luận vì vậy nếu bạn có bất kỳ vấn đề gì, họ sẽ chỉ cho bạn những gì mỗi dòng làm.