17. APP Control

In the previous project we simply viewed the footage taken by the camera and used the AI detection function in the SunFounder Controller.

In this project, we will try to control the movement and direction of the Zeus Car using the joystick widget in the app, so now let’s see how it works.

Note

Please install SunFounder Controller from APP Store(iOS) or Google Play(Android).

How to do?

  1. The ESP32-CAM and the Arduino board share the same RX (receive) and TX (transmit) pins. So, when you’re uploading code, you’ll need to first disconnect the ESP32-CAM to avoid any conflicts or potential issues.

    ../_images/unplug_cam1.png
  2. Open the 17_app_control.ino file under the path of zeus-car-main\examples\17_app_control.

  3. After the code is uploaded successfully, you can plug in the ESP32-CAM and then slide the power switch to ON to start the Zeus Car.

    ../_images/plug_esp32_cam.jpg
  4. Toggle the Upload Switch to the side of Run (right side on this diagram) to start the ESP32 CAM.

    ../_images/zeus_run.jpg
  5. Press the reset button to get the Arduino board’s program running again.

    ../_images/zeus_reset_button.jpg
  6. Connect to Zeus_Car WLAN.

    • Find Zeus_Car on the WLAN of the mobile phone (tablet), enter the password 12345678 and connect to it.

    ../_images/app_wlan.png
    • The default connection mode is AP mode. So after you connect, there will be a prompt telling you that there is no Internet access on this WLAN network, please choose to continue connecting.

    ../_images/app_no_internet.png
  7. Create a controller.

    • To add a controller on SunFounder Controller, click the + icon.

      ../_images/app1.png
    • There are preset controllers for some products in the Preset section. But here we choose a Blank and Dual Stick template.

      ../_images/app_blank.PNG
    • Click the + icon in the J area and select a Switch widget. You may need to slide to the left to see the widget.

      ../_images/app_switch_wid.png

      Note

      If you think you selected the wrong widget, you can click on it again and use the Delete button to remove it.

      ../_images/app_delete.png
    • Click the Settings icon in the upper right corner to give it a name.

      ../_images/app_name_dirft.png
    • Select a Joystick widget in the K and Q area and give name to both widgets. Then use the app_save button to save the controller.

    ../_images/app_joystick_wid.png
    • The next step is to connect the Zeus Car to your device via the app_connect button. Wait a few seconds and Zeus_Car(IP) will appear, click on it to connect.

      ../_images/app_connect1.png

      Note

      Please make sure your Wi-Fi is connected to Zeus_Car, if you are not seeing the above message for a long time.

  8. Run the Controller.

    After the “Connected Successfully” message appears, click the app_run button, then the camera footage will appear on the app, and now you can control your Zeus Car with these widgets.

    The functions of the three widgets are referenced as follows

    Move in All Directions(K)

    The Zeus Car will move in the appropriate direction when you swipe the app_move_k widget.

    ../_images/joystick_move.png

    The car moves once every time you slide, so if you don’t release your hand all the time, the car keeps moving.

    ../_images/zeus_move.jpg

    Drift Enable(J)

    Click the app_drift_j button to enable the drift function.

    • By sliding the app_rotate_q widget counterclockwise, you will see Zeus Car drift to the right. Upon releasing the hand, the car will stop at its current position.

      ../_images/zeus_drift_left.jpg
    • Similarly, if you slide the app_rotate_q widget clockwise, the Zeus Car will drift to the left and stop in the current position.

    ../_images/zeus_drift_right.jpg

    Control the Drection(Q)

    • When the app_drift_j button is on, the app_rotate_q widget is used to make the Zeus Car drift left and right.

    • When the app_drift_j widget is off, the app_rotate_q widget is used to control the direction of the car’s head.

      • By sliding the app_rotate_q widget counterclockwise, the car will also rotate counterclockwise. Upon releasing the hand, the head of the car will back to the original direction.

      ../_images/zeus_turn_left.jpg
      • Similarly the car will rotate clockwise with the app_rotate_q widget and return to the original direction when released.

      ../_images/zeus_turn_right.jpg