Skip to main content

Thêm nút thứ hai vào màn hình não - C++

Biểu tượng Hộp công cụ của giáo viên Hộp công cụ giáo viên - Mục đích của hoạt động này

Bây giờ, khi học sinh đã có kinh nghiệm coi màn hình não như một nút bấm lớn, các em có thể biến màn hình thành hai nút bấm. Hoạt động này sẽ giới thiệu cho học sinh cách sử dụng các câu lệnhif then elselồng nhau để quản lý tốt hơn các câu lệnh có điều kiện và logic cơ bản khi thực hiện như vậy. Đầu tiên, học sinh được hướng dẫn xây dựng dự án để nhấn màn hình để điều khiển robot rẽ trái hoặc phải. Nhưng sau đó, họ được yêu cầu chuyển đổi các nút sao cho nút nào khiến robot rẽ trái thì lại rẽ phải, và ngược lại.

Để biết thêm thông tin vềnếu thìnếu thì kháchoặc các câu lệnh khác được sử dụng trong hoạt động này, hãy truy cập thông tin trợ giúp trong VEXcode V5. Để biết thêm thông tin về công cụ trợ giúp tích hợp này, bạn có thể tìm các bài viết về trợ giúp trongC++.

Sau đây là phác thảo những gì học sinh của bạn sẽ làm trong hoạt động này:

  • Xem lại dự ánStopOrDrivevà bố cục màn hình não tính bằng pixel.

  • Xây dựng một dự ánLeftOrRightmới trong khi được hướng dẫn về lý luận lập trình.

  • Sửa đổi dự án để các nút trên màn hình hoạt động ngược nhau.

  • Mở rộng khả năng học tập của bạn: Chia màn hình thành hai nút, khi nhấn vào sẽ khiến robot rẽ trái hoặc phải.

Hãy chắc chắn rằng bạn có sẵn phần cứng cần thiết, máy tính xách tay kỹ thuật và VEXcode V5.

Vật liệu cần thiết:
Số lượng Vật liệu cần thiết
1

VEX V5 Classroom Starter Kit (với firmware cập nhật)

1

VEXcode V5 (phiên bản mới nhất, Windows, macOS)

1

Sổ tay kỹ thuật

1

Dự án StopOrDrive từ trang Phát trước đó

Biểu tượng Hộp công cụ của giáo viên Hộp công cụ giáo viên

Để có gợi ý về các chiến lược giảng dạy cho phần này, hãy xem lại cột Triển khai của Hướng dẫn tiến độ Nên làm hay Không nên làm! (Google Doc / .docx / .pdf)

Màn hình não có thể có nhiều hơn một nút.

Hoạt động này sẽ cho phép bạn lập trình cho rô-bốt tiến về phía trước và rẽ trái hoặc phải tùy thuộc vào bên nào trên màn hình não được nhấn.

Ba loại hướng dẫn bổ sung mà bạn sẽ cần trong hoạt động này là:

  • Drivetrain.turn(bên phải);
  • số< 50
  • Brain.Screen.xPosition();

Bạn có thể sử dụng thông tin Trợ giúp bên trong VEXcode V5 để tìm hiểu về các hướng dẫn.

VEXcode V5 với ổ đĩa cho lệnh được nhập trong không gian làm việc ở bên trái và thông tin Trợ giúp mở ở bên phải. Trợ giúp hiển thị định nghĩa về lệnh và thông tin về cách sử dụng lệnh.

Bước 1: Hãy bắt đầu bằng cách xem lại dự án StopOrDrive.

Hãy bắt đầu bằng cách xem lại dự án StopOrDrive.

Dự án StopOrDrive đã khiến Clawbot dừng lại nếu màn hình được nhấn, nếu không thì nó sẽ di chuyển về phía trước.
Toàn bộ màn hình là một nút lớn nhưng trong dự án tiếp theo này, chúng tôi muốn một nửa màn hình là một nút và nửa còn lại là nút còn lại.

// Bắt đầu mã dự án
int main() {
  // Khởi tạo cấu hình robot. KHÔNG ĐƯỢC GỠ BỎ!
  vexcodeInit();

  while (true) {
    Drivetrain.drive(forward);
    if (Brain.Screen.pressing()) {
      Drivetrain.stop();
      waitUntil(!Brain.Screen.pressing());
    } 
    else {
      Drivetrain.drive(forward);
    }   
  }  
}  

Để chia màn hình thành hai nút, chúng ta cần hiểu thêm về bố cục của màn hình.

Lưới điểm ảnh của màn hình V5 Brain thể hiện 12 hàng được đánh số dọc theo phía bên trái, với hàng trên cùng được đánh dấu là Hàng 1 và hàng dưới cùng được đánh dấu là Hàng 12. Phía trên cùng là 48 cột được đánh số, với Cột 1 được đánh dấu ở ngoài cùng bên trái và Cột 48 được đánh dấu ở ngoài cùng bên phải. Tổng số phép đo pixel rộng 480px cao 240 px.

  • Lưu ý rằng các cột tăng số lượng từ trái sang phải. Số cột là 48 và màn hình rộng 480 pixel.
  • Ghi vào sổ ghi chép kỹ thuật của bạn rằng giá trị x trên màn hình bằng với số pixel được đo từ trái sang phải.
  • Giá trị x của tâm màn hình là bao nhiêu? Đối với hoạt động này, bạn có thể chỉ tập trung vào trục x vì bạn chỉ cần một nút trái và phải.

Biểu tượng Hộp công cụ của giáo viên Hộp công cụ giáo viên - Trả lời

Giá trị x ở giữa màn hình bằng một nửa chiều rộng của màn hình tính bằng pixel. Vì vậy, giá trị x của điểm trung tâm là 240. Học sinh sẽ cần số này để lập trình điều kiện cho việc màn hình được nhấn sang trái hay phải. Vì vậy, hãy chắc chắn kiểm tra xem tất cả chúng đều có giá trị chính xác.

Nhìn về phía trước, Thử thách Giao diện người dùng trong phần Suy nghĩ lại sẽ yêu cầu học sinh áp dụng những gì đã học để tạo ra bốn nút trên màn hình. Vì vậy, để làm được điều đó, họ sẽ cần cả giá trị x và y.

Biểu tượng Mẹo của Giáo viên Mẹo dành cho giáo viên

Để được hỗ trợ thêm, hãy xem Thư việnđể biết các bài viết trợ giúp bổ sung.

Bước 2: Lập trình cho hai nút.

  • LưuStopOrDrivelàm dự ánLeftOrRight.

Hộp thoại tên dự án trong Thanh công cụ VEXcode V5 đọc Trái hoặc Phải và hiển thị Khe 2 được chọn.

  • Xây dựng dự án dưới đây. Clawbot sẽ rẽ trái hoặc phải khi màn hình được nhấn, tùy thuộc vào phía nó được nhấn.

 

// Bắt đầu mã dự án
int main() {
  // Khởi tạo cấu hình robot. KHÔNG ĐƯỢC GỠ BỎ!
  vexcodeInit();

  while (true) {
    if (Brain.Screen.pressing()) {
      if (Brain.Screen.xPosition() < 240) {
        Drivetrain.turn(left);
        waitUntil(!Brain.Screen.pressing());
      } else {
        Drivetrain.turn(phải);
        waitUntil(!Brain.Screen.pressing());
      }
    } else {
      Drivetrain.drive(forward);
    }
  }  
}  
  • Chúng ta hãy cùng xem lại dự án này thực hiện những gì.

    Nó liên tục kiểm tra xem màn hình có được nhấn hay không. Nếu màn hình không được nhấn, nó sẽ di chuyển về phía trước nhưng nếu được nhấn, nó sẽ kiểm tra vị trí màn hình được nhấn.

    Nếu nhấn ở phía bên trái (nhỏ hơn 240), nó sẽ rẽ sang trái. Nếu không, nó sẽ rẽ phải. Chúng ta không cần một điều kiện khác khi giá trị x lớn hơn 240 vì nếu nó không nhỏ hơn 240 (rẽ trái), nó phải lớn hơn (rẽ phải). Chúng ta chỉ cần lo lắng về hai nút.

    đợi cho đến khiHướng dẫn điều khiển sau mỗi lượt yêu cầu dự án đợi cho đến khi màn hình không còn bị nhấn nữa trước khi tiếp tục.

Dự án Trái hoặc Phải được hiển thị với các lệnh được gắn nhãn với chức năng của chúng. Các lệnh While true (Trong khi đúng) và first if (đầu tiên) được gắn nhãn là Keeps (Giữ) để kiểm tra xem màn hình có được nhấn hay không. Tiếp theo, nếu lệnh được gắn nhãn khi nhấn màn hình, hãy kiểm tra xem ở bên trái hay bên phải. Lệnh rẽ tiếp theo được gắn nhãn nếu nhấn ở bên trái (dưới 240, rẽ trái), sau đó đợi cho đến khi lệnh được gắn nhãn chờ cho đến khi màn hình không còn được nhấn nữa trước khi tiếp tục. Lệnh rẽ phải tiếp theo trong nhánh else được gắn nhãn nếu nhấn không ở bên trái (dưới 240), rẽ phải và chờ cho đến khi lệnh được gắn nhãn chờ cho đến khi màn hình không còn được nhấn nữa trước khi tiếp tục. Nhánh khác bên ngoài được dán nhãn là màn hình không được nhấn, đẩy về phía trước.

  • Bây giờ dự án đã hoàn thành, hãy tải xuống và chạy nó để kiểm tra cách thức hoạt động của nó.

Thanh công cụ VEXcode V5 có hộp màu đỏ xung quanh biểu tượng Tải xuống. Các biểu tượng được hiển thị đã đọc, từ trái sang phải, Bộ điều khiển, Bộ não, Tải xuống, Chạy, Dừng và Chia sẻ.

  • Ghi chú trong sổ ghi chép kỹ thuật của bạn về cách các nút điều khiển chuyển động của Clawbot.

Biểu tượng Mẹo của Giáo viên Mẹo dành cho giáo viên

Trong khi thử nghiệm, học sinh cần nhận ra rằng Giao diện người dùng, khi được sử dụng từ phía sau Clawbot, có vẻ hoạt động ngược lại. Theo góc nhìn của người dùng, Clawbot sẽ quay đi khỏi phía mà người dùng đang nhấn. Đó không phải là trải nghiệm người dùng tối ưu.

Bước 3: Điều chỉnh dự án để có Trải nghiệm người dùng tốt hơn.

Khi nhấn các nút của màn hình từ phía sau Clawbot khi nó di chuyển về phía trước, bạn nhấn vào phía bên phải của màn hình để rẽ trái và ở phía bên trái của màn hình để rẽ phải. Đó không phải là một Trải nghiệm người dùng tốt. Trải nghiệm người dùng là mức độ người dùng có thể tương tác với Giao diện người dùng để điều khiển hệ thống máy tính. Có thêm thông tin về Giao diện người dùng trong phần Áp dụng của phòng thí nghiệm này.

Trong trường hợp này, chúng ta cần cải thiện Giao diện người dùng để cải thiện Trải nghiệm người dùng.

  • Xem lại dự án LeftOrRight và sửa lại để khi người dùng nhấn các nút từ phía sau Clawbot, robot sẽ rẽ phải khi người dùng nhấn phía bên trái màn hình. Nếu không, Clawbot sẽ rẽ trái.
// Bắt đầu mã dự án
int main() {
  // Khởi tạo cấu hình robot. KHÔNG ĐƯỢC GỠ BỎ!
  vexcodeInit();

  while (true) {
    if (Brain.Screen.pressing()) {
      if (Brain.Screen.xPosition() < 240) {
        Drivetrain.turn(left);
        waitUntil(!Brain.Screen.pressing());
      } else {
        Drivetrain.turn(phải);
        waitUntil(!Brain.Screen.pressing());
      }
    } else {
      Drivetrain.drive(forward);
    }
  }  
}  
  • Lập kế hoạch, kiểm tra và lặp lại dự án này trong sổ ghi chép kỹ thuật của bạn để dự án làm cho Clawbot quay về phía bên của màn hình mà người dùng đang nhấn từ phía sau Clawbot.

Biểu tượng Hộp công cụ của giáo viên Hộp công cụ giáo viên

Sinh viên nên lập kế hoạch, thử nghiệm và tinh chỉnh những thay đổi này cho dự án trong khi ghi chép lại trong sổ tay kỹ thuật của mình. Để biết tiêu chí chấm điểm sổ tay kỹ thuật cá nhân, hãy nhấp vào một trong các liên kết sau (Google Doc / .docx / .pdf) hoặc nhấp vào một trong các liên kết sau để biết sổ tay nhóm (Google Doc / .docx / .pdf). Hãy nhớ giải thích cách chấm điểm cho học sinh trước khi các em bắt đầu làm bài.

Biểu tượng Hộp công cụ của giáo viên Hộp công cụ giáo viên - Giải pháp

Có hai cách có thể giải quyết vấn đề nêu trên. Cách đầu tiên là cách được ghi trong hướng dẫn: Xem lại dự án LeftOrRight và sửa đổi sao cho khi người dùng nhấn các nút từ phía sau Clawbot, robot sẽ rẽ phải khi người dùng nhấn vào phía bên trái của màn hình. Nếu không, Clawbot sẽ rẽ trái.

// Bắt đầu mã dự án
int main() {
  // Khởi tạo cấu hình Robot. KHÔNG ĐƯỢC THÁO RA!
  vexcodeInit();

  while (true) {
    if (Brain.Screen.pressing()) {
      if (Brain.Screen.xPosition() < 240) {
        Drivetrain.turn(phải);
        waitUntil(!Brain.Screen.pressing());
      } else {
        Drivetrain.turn(trái);
        waitUntil(!Brain.Screen.pressing());
      }
    } else {
      Drivetrain.drive(tiến);
    }
  }  
}  

Giải pháp khác là chuyển đổi lệnh Toán tử sao cho khi giá trị x lớn hơn 240, Clawbot sẽ rẽ trái.

// Bắt đầu mã dự án
int main() {
  // Khởi tạo cấu hình Robot. KHÔNG ĐƯỢC THÁO RA!
  vexcodeInit();

  while (true) {
    if (Brain.Screen.pressing()) {
      if (Brain.Screen.xPosition() > 240) {
        Drivetrain.turn(trái);
        waitUntil(!Brain.Screen.pressing());
      } else {
        Drivetrain.turn(phải);
        waitUntil(!Brain.Screen.pressing());
      }
    } else {
      Drivetrain.drive(tiến lên);
    }
  }  
}  

Biểu tượng thảo luận thúc đẩy Thúc đẩy thảo luận

Bạn cần sử dụng tọa độ từ mặt phẳng tọa độ khi lập trình câu lệnh điều kiện khi giá trị x nhỏ hơn 240 (phía bên trái màn hình). Để màn hình của não vẽ các nút trực quan, bạn cũng cần sử dụng tọa độ.
Quay lại Bước 2, nơi bạn được hiển thị tọa độ cho màn hình của Não Robot V5.

Lưới điểm ảnh của màn hình V5 Brain hiển thị 12 hàng được đánh số dọc theo phía bên trái, với hàng trên cùng được gắn nhãn là Hàng 1 và hàng dưới cùng được gắn nhãn là Hàng 12. Phía trên cùng là 48 cột được đánh số, với Cột 1 được đánh số ở phía bên trái và Cột 48 được đánh số ở phía bên phải. Tổng số pixel là rộng 480px và cao 240px.

Q:Giá trị x ở cạnh phải màn hình là bao nhiêu?
A:Giá trị x tăng từ 0 ở cạnh trái đến 480 ở cạnh phải.

Q:Vậy phạm vi của giá trị x là 480 (từ 0 đến 480). Giá trị y có giá trị trong khoảng nào?
A:Giá trị y có giá trị trong khoảng 240 (từ 0 đến 240).

Q:Gốc tọa độ (0, 0) của mặt phẳng tọa độ này nằm ở đâu?
A:Gốc tọa độ nằm ở góc trên bên trái.

Q:Bạn đang ở đầu màn hình khi giá trị y bằng 0. Tại sao điều này lại bất thường?
A:Thông thường, giá trị y tăng khi bạn di chuyển lên trên nhưng trên màn hình V5, giá trị y tăng khi bạn di chuyển xuống dưới. Nhưng bạn có thể nghĩ về nó như giá trị y tăng dần khi bạn di chuyển ra xa gốc tọa độ (0, 0) ở góc trên bên trái của màn hình.

Biểu tượng Mở rộng việc học của bạn Mở rộng việc học của bạn

Trong Thử thách Giao diện người dùng của phần Tái thiết, học sinh sẽ được yêu cầu phát triển một dự án tạo ra bốn nút trên màn hình để điều khiển móng vuốt và cánh tay của Clawbot. Đối với thử thách đó, họ cũng được yêu cầu hiển thị bốn nút đó trên màn hình. Phần Mở rộng việc học này, giống như các trang trước, sẽ giúp học sinh chuẩn bị cho thử thách đó vì thử thách có bốn nút để lập trình nhưng phần này chỉ có hai.

Yêu cầu học sinh thêm một sự kiện vào chương trình để màn hình hiển thị hai nút có thể nhìn thấy khi dự án chạy. Đề xuất rằng học sinh sử dụng tính năng Trợ giúp trong VEXcode V5 để biết thông tin về Sự kiện, đặc biệt là thông tin về hướng dẫn vẽ hình chữ nhật. Hướng dẫn học sinh xem lại cách màn hình não được tổ chức thành hệ tọa độ dựa trên số lượng điểm ảnh khi sử dụng trong khối hình chữ nhậtvẽ. Họ cần phải hiểu điều đó để có thể thiết lập các tham số trong khối đó. Ngoài ra, họ cần phải hiểu cách phát sóng sự kiện. Trong trường hợp này, sự kiện là vẽ các nút.

Sinh viên nên lập kế hoạch, thử nghiệm và tinh chỉnh những thay đổi này cho dự án trong khi ghi lại trong sổ tay kỹ thuật của mình. Để biết tiêu chí chấm điểm sổ tay kỹ thuật cá nhân, hãy nhấp vào một trong các liên kết sau (Google Doc / .docx / .pdf) hoặc nhấp vào một trong các liên kết sau để biết sổ tay nhóm (Google Doc / .docx / .pdf).

Dưới đây là một giải pháp ví dụ:

// Bắt đầu mã dự án
sự kiện ScreenButtons = event();

void HasScreenButtons() {
  Brain.Screen.setFillColor(xanh lá cây);
  Brain.Screen.drawRectangle(0, 0, 240, 120);
  Brain.Screen.setFillColor(tím hoa cà);
  Brain.Screen.drawRectangle(240, 0, 480, 120);
  Brain.Screen.setFillColor(cam);
  Brain.Screen.drawRectangle(0, 120, 240, 240);
  Brain.Screen.setFillColor(xanh lơ);
  Brain.Screen.drawRectangle(240, 120, 480, 240);
  wait(1, seconds);
}

int main() {
  // Khởi tạo cấu hình robot. KHÔNG ĐƯỢC THÁO RA!
  vexcodeInit();

  ScreenButtons(HasScreenButtons);

  while (true) {
    ScreenButtons.broadcast();

    if (Brain.Screen.pressing()) {

      if (Brain.Screen.xPosition() < 240) {

        if (Brain.Screen.yPosition() < 120) {
          ClawMotor.spin(chuyển tiếp);
          waitUntil(!Brain.Screen.pressing());

        } else {
          ClawMotor.spin(đảo ngược);
          waitUntil(!Brain.Screen.pressing());
        }
        
      } else {
        if (Brain.Screen.yPosition() < 120) {
          ArmMotor.spin(chuyển tiếp);
          waitUntil(!Brain.Screen.pressing());

        } else {
          ArmMotor.spin(đảo ngược);
          waitUntil(!Brain.Screen.pressing());
        }
      }
      ClawMotor.stop();
      ArmMotor.stop();
    }
    wait(5, msec);
  }  
}  

Để có trải nghiệm thực tế chuyên nghiệp hơn, hãy yêu cầu học sinh hỏi ý kiến phản hồi của các bạn cùng lớp về hai lựa chọn màu sắc của mình.
Màu sắc được chọn có khiến bạn muốn sử dụng giao diện không, hay họ sẽ thích màu nào hơn với tư cách là người dùng?
Một phần của việc phát triển một Giao diện Người dùng tuyệt vời là thu thập dữ liệu về Trải nghiệm Người dùng, thậm chí cả sở thích thẩm mỹ.