Master MaixCam: A Step-by-Step Guide to MaixVision IDE and MaixHub Apps

If you’re diving into AI and edge computing, MaixVision IDE offers a powerful integrated development environment (IDE) tailored for working with the MAIX platform. Whether you’re building computer vision projects or developing smart IoT applications, this guide will take you through the essential steps of installing MaixVision IDE, utilizing apps from MaixHub, creating apps from code, and enabling app autostart on your device.

Acquiring the MaixCAM

To begin your journey with the MaixCAM, you’ll need to purchase the development board. It’s highly recommended to opt for a bundle that includes a least the essential accessories:

  • MaixCAM development board kit (Affiliate):
  1. https://s.click.aliexpress.com/e/_DeAcqsH
  2. https://s.click.aliexpress.com/e/_DmeC0Dn
  3. https://s.click.aliexpress.com/e/_DeQvCZJ

These components will provide a comprehensive setup for development and testing:

  • TF card (Bundle)
  • Camera (Bundle)
  • 2.3-inch touchscreen (Bundle)
  • Protective case (Bundle)
  • Type-C data cable (Separate)

1. Installing MaixVision IDE

Before you can develop apps, you’ll need to install the MaixVision IDE. Here’s how you can get up and running:

Steps to Install MaixVision IDE:

  • Install Python: Ensure you have Python 3.7 or later installed. If not, download it from python.org.

python.org

  • Download the IDE: Visit the official Sipeed website to download the latest version of MaixVision IDE for your operating system (Windows, Linux, or macOS).

https://wiki.sipeed.com/maixvision

  • Install The MaixVision IDE on your computer: Follow the steps
  • Power up the MaixCam board: Connect your MAIX device via USB-C Cable
  • Launch MaixVision IDE: Open MaixVision IDE, and you’re ready to start developing your AI applications.

2. Creating an App from Code

While apps from MaixHub are convenient, creating custom applications can be more powerful and flexible. MaixVision IDE supports writing code from scratch or modifying existing code to suit your needs.

Steps to Create a Custom App:

  • Set Up Your Development Environment: Open MaixVision IDE and ensure your MAIX board is connected. To connect the MaixCam board we need it’s IP address, check the list and select the IP.

You can check the IP address by going to SETTINGS->WIFI

Now connect the board by selecting the IP address

 

  • Create a New Project: Go to File > New Project. Choose the project type that matches your application (e.g., a computer vision project for image processing).

 

 

  • Write or Import Code: You can either write your Python code or import existing examples. MaixPy libraries, such as machine visionaudio processing, and machine learning, can help build your app faster. In this case, I’ve prepared a code example that get us access to the camera with the exit button implemented. Just copy and paste or open one of the examples.

The examples directory, explore it at will:

The code:

from maix import camera, display, app, time, image, touchscreen

cam = camera.Camera(512, 320)   # Manually set resolution
disp = display.Display()        # MaixCAM default is 522x368
ts = touchscreen.TouchScreen()  # Initialize touchscreen

# Exit button related code
exit_btn_pos = (0, 0, 100, 50)  # Increased width and height (x, y, w, h)
exit_btn_disp_pos = image.resize_map_pos(cam.width(), cam.height(), disp.width(), disp.height(), image.Fit.FIT_CONTAIN, exit_btn_pos[0], exit_btn_pos[1], exit_btn_pos[2], exit_btn_pos[3])

pressed_flag = [False, False, False]

def draw_exit_btn(img: image.Image):
    img.draw_rect(exit_btn_pos[0], exit_btn_pos[1], exit_btn_pos[2], exit_btn_pos[3], image.Color.from_rgb(255, 255, 255), 2)
    
    # Center the text on the button
    text = "EXIT"
    font_size = 2  # Adjust this value to change text size
    text_width = len(text) * 8 * font_size  # Approximate width of text (8 pixels per character * font size)
    text_height = 8 * font_size  # Approximate height of text
    
    text_x = exit_btn_pos[0] + (exit_btn_pos[2] - text_width) // 2
    text_y = exit_btn_pos[1] + (exit_btn_pos[3] - text_height) // 2
    
    img.draw_string(text_x, text_y, text, image.COLOR_WHITE, scale=font_size)

def is_in_button(x, y, btn_pos):
    return x > btn_pos[0] and x < btn_pos[0] + btn_pos[2] and y > btn_pos[1] and y < btn_pos[1] + btn_pos[3]

def is_in_exit_button(x, y):
    return is_in_button(x, y, exit_btn_disp_pos)

def handle_exit_button(pressed):
    global pressed_flag
    if pressed:
        if is_in_exit_button(x, y):
            pressed_flag[2] = True
    else:
        if pressed_flag[2]:
            print("exit btn click")
            pressed_flag[2] = False
            return True
    return False

while not app.need_exit():
    img = cam.read()            # Get one frame from camera, img is maix.image.Image type object
    
    # Handle touch events
    x, y, pressed = ts.read()
    if handle_exit_button(pressed):
        break  # Exit the loop if exit button is pressed
    
    # Draw the exit button
    draw_exit_btn(img)
    
    disp.show(img)              # Show image to screen
    fps = time.fps()            # Calculate FPS between last time fps() call and this time call.
    
    print(f"time: {1000/fps:.02f}ms, fps: {fps:.02f}") # print FPS in console

# Clean up (if necessary)
cam.close()
disp.close()

 

  • Test the Code: Run your app directly from the IDE to test it on your MAIX board. You can use the Serial Monitor to check outputs and debug any issues.

Select the play button to start

 

This is the end result, notice the EXIT button that you can press on the touchscreen to exit the app.

 

 

  • Save and Deploy: Once the app is complete, save it and deploy it to your MAIX board.

Save the file: Don´t forget to save the file with a name of your choosing and with the *.py in the end.

Select the package icon

 

 

Fill in the app info. You can also add a icon

 

Build the package

 

And install it to the MaixCam board

 

 

Disconnect the board from the MaixVision IDE

 

 

Browse the menu of the board and you should be able to see the installed app. See the end result of the programming and exit the app by pressing the EXIT button.

 

 

4. Using Apps from MaixHub

MaixHub is an online repository where pre-built apps are available for various AI and IoT tasks. It’s an excellent resource for quickly deploying applications to your MAIX device.

How to Download and Use Apps from MaixHub:

  • Sign Up on MaixHub: Visit the MaixHub website and create an account if you don’t have one.

  • Browse Available Apps: After logging in, you’ll find a range of applications such as object detection, face recognition, gesture control, and more.

 

  • Download Apps: Choose an app that fits your project and download it to your local machine. Read the QR CODE with the MaixCam board by going to APPSTORE->Read QR CODE

I choose the capture camera app

 

Now we just have to read the app QR code to install it. If you can´t read it, just change the focus on the camera lens of the board.

 

 

Camera lens focus

 

  • Test the App: Once deployed, you can test the app on your MAIX board to ensure it’s working as expected. Exit the app by touching the touchscreen BACK button.

 

5. Setting App Autostart

For many applications, especially in deployment scenarios like smart cameras or IoT sensors, you’ll want your app to run automatically whenever the MAIX device powers on. This can be done by configuring the autostart feature.

Steps to Enable Autostart:

  • Write Your App: First, complete and test your app, ensuring it runs correctly on the MAIX board.
  • Go to SETTINGS->AUTO START and select the app that will start as soon has the device powers up

  • The app that we selected will be highlighted on the top of the page

  • Test Autostart: Reboot your device and check if the app runs automatically. If everything is set up correctly, your app will start as soon as the board powers up.

6. Deleting an App from Your MAIX Device

As you continue developing and testing different apps, you may need to delete old or unused apps to free up space or keep your MAIX device organized.

Steps to Delete an App:

  • Go to App Store->Uninstall APP

  • Remove the app that you want

3. Safely Disconnecting and Powering Down Your MAIX Device

When you’re done developing or testing, it’s crucial to safely disconnect and power down your MAIX board to avoid damaging the device or losing data.

Steps to Safely Disconnect and Power Down:

  1. Stop Running Apps from the MaixVision IDE: Before disconnecting, make sure to stop any running applications from MaixVision IDE by pressing the Stop button.
  2. Safely Eject the Device from the MaixVision IDE:
  3. Power Down the Device by going to Settings->Power->Power Down
  4. Only then, if possible, remove the USB cable

Conclusion

With the MaixVision IDE, the powerful MaixHub app repository, and the flexibility to develop custom apps or set up autostart functionality, the MAIX platform provides all the tools you need to build and deploy intelligent edge devices. Whether you’re working on computer vision, voice recognition, or complex machine learning tasks, this environment simplifies development while enabling cutting-edge innovation.