openpilot is an open source driver assistance system. openpilot performs the functions of Automated Lane Centering and Adaptive Cruise Control for over 200 supported car makes and models.

2.9 KiB

Raw Blame History

Turn the speed blue

A getting started guide for openpilot development

In 30 minutes, we'll get an openpilot development environment setup on your computer and make some changes to openpilot's UI.

And if you have a comma 3/3X, we'll deploy the change to your device for testing.

1. Setup your development environment

Run this to clone openpilot and install all the dependencies:

bash <(curl -fsSL openpilot.comma.ai)

Navigate to openpilot folder & activate a Python virtual environment

cd openpilot
source .venv/bin/activate

Then, compile openpilot:

scons -j$(nproc)

2. Run replay

We'll run the replay tool with the demo route to get data streaming for testing our UI changes.

# in terminal 1
tools/replay/replay --demo

# in terminal 2
selfdrive/ui/ui

The openpilot UI should launch and show a replay of the demo route.

If you have your own comma device, you can replace --demo with one of your own routes from comma connect.

3. Make the speed blue

Now let’s update the speed display color in the UI.

Search for the function responsible for rendering UI text:

git grep "drawText" selfdrive/ui/qt/onroad/hud.cc

You’ll find the relevant code inside selfdrive/ui/qt/onroad/hud.cc, in this function:

void HudRenderer::drawText(QPainter &p, int x, int y, const QString &text, int alpha) {
  QRect real_rect = p.fontMetrics().boundingRect(text);
  real_rect.moveCenter({x, y - real_rect.height() / 2});

  p.setPen(QColor(0xff, 0xff, 0xff, alpha));  // <- this sets the speed text color
  p.drawText(real_rect.x(), real_rect.bottom(), text);
}

Change the QColor(...) line to make it blue instead of white. A nice soft blue is #8080FF, which translates to:

- p.setPen(QColor(0xff, 0xff, 0xff, alpha));
+ p.setPen(QColor(0x80, 0x80, 0xFF, alpha));

This change will tint all speed-related UI text to blue with the same transparency (alpha).

4. Rebuild the UI

After making changes, rebuild Openpilot so your new UI is compiled:

scons -j$(nproc) && selfdrive/ui/ui

You should now see the speed displayed in a nice blue shade during the demo replay.

5. Push your fork to GitHub

Click "Fork" on the Openpilot GitHub repo. Then push with:

git remote rm origin
git remote add origin git@github.com:<your-github-username>/openpilot.git
git add .
git commit -m "Make the speed display blue"
git push --set-upstream origin master

6. Run your fork on your comma device

Uninstall Openpilot through the settings on your device.

Then reinstall using your own GitHub-hosted fork:

installer.comma.ai/<your-github-username>/master

7. Admire your work IRL 🚗💨

You’ve now successfully modified Openpilot’s UI and deployed it to your own car!

2.9 KiB Raw Blame History