In-Vehicle Screen (DUI)

An optional physical screen prop mounted onto the vehicle dashboard. It uses FiveM's DUI (Dynamic UI) system to render the same Carplay React app live onto the prop's texture — so anyone looking at the dashboard can see what the driver is doing.

Info

The default prop (mdigou_boombox_car_prop_02) is streamed by the code9_carplayProp resource, which ships in the bundle. Add ensure code9_carplayProp to your server.cfg before code9_carplayv2. If you swap to a custom prop, stream that asset instead — code9_carplayProp is only required for the default model.

What It Is

A mdigou_boombox_car_prop_02 prop (default) attached to the vehicle, with its texture replaced by a live render target that mirrors the tablet UI in read-only mode. The driver still uses the main tablet for input — the screen is purely a visual surface visible from outside the seat.

The same React app powers both surfaces — there is no second build. URL parameter ?dui=1 puts the React app into mirror mode where NUI callbacks are disabled.

Features

• Live mirror of the driver's tablet (music view, map view)
• Standby clock when no specific page is active
• Per-vehicle persistence — once a screen is installed, it spawns automatically when the vehicle is entered
• Custom prop / texture support — point to any prop you have streamed
• Configurable DUI resolution — trade quality for GPU
• Item-based install / uninstall — players use a carplay_screen item to install the screen
• Optional gating — make Carplay itself require an installed screen
• Position editor — built-in gizmo (4×4 matrix manipulator) to fine-tune offset & rotation per vehicle
• Screen sharing — the driver can choose what page is shown on the DUI (music vs map vs standby)

How It Works

1. Player obtains a carplay_screen item (configurable name)
2. Inside the vehicle, they open the install UI (item use or settings menu)
3. The position editor (gizmo) appears — they can drag/rotate the prop into place
4. On confirm, the prop is attached to the vehicle and the position is saved server-side per plate
5. Once installed, every time anyone enters that vehicle, the screen spawns automatically with the saved offset
6. The DUI texture is created with URL nui://code9_carplayv2/ui/index.html?dui=1
7. The driver's tablet sends state messages to the DUI via SendReactMessage — the DUI mirrors them

Configuration

lua

Config.Screen = {
    enabled = true,
    requiredToUse = false,                     -- if true, Carplay won't open without a screen installed

    item = 'carplay_screen',                   -- inventory item name

    -- Prop & texture (must match a streamed asset)
    propModel   = 'mdigou_boombox_car_prop_02',
    textureDict = 'mdigou_boombox_car_prop_02',
    textureName = 'mdigou_screen_txd',

    -- DUI resolution (higher = sharper at distance, more GPU)
    duiWidth  = 1024,
    duiHeight = 512,

    -- Default spawn offset (relative to vehicle center)
    defaultOffset   = vector3(0.0, 0.0, 0.0),
    defaultRotation = vector3(0.0, 0.0, 0.0),

    jobs = {},                                 -- empty = everyone can install
    discordRoles = {},
}

Custom Props

To use your own dashboard screen prop:

1. Stream the prop and its texture dictionary in your resource (e.g. via stream/ folder or a separate streaming resource)
2. Open the prop in OpenIV or CodeWalker and identify the texture dictionary name (the .ytd filename) and the target texture name inside it
3. Set:

lua

Config.Screen.propModel   = 'your_prop_model'
Config.Screen.textureDict = 'your_texture_dict'
Config.Screen.textureName = 'your_texture_name'

The DUI runtime txd will replace textureDict/textureName with a live render of the React app.

Position Editor (Gizmo)

When installing on a new vehicle, a 3D position editor opens. It uses FiveM's DrawGizmo native (with a 4×4 matrix packed via the included dataview.lua helper) to let the player drag and rotate the prop in 3D space.

• Drag arrow handles — translate
• Drag rotation rings — rotate
• Confirm → offset/rotation saved to server, persisted per vehicle plate

The saved positions are stored in the screen module's data table (see Database) so re-entering the vehicle later re-spawns the screen at the exact same place.

Required-to-Use Mode

If you want Carplay to be a physical product that requires installing the screen first:

lua

Config.Screen.requiredToUse = true

With this set, players cannot open Carplay (via command, key or item) unless their current vehicle has an installed screen. This makes the feature feel earned — they need to buy or craft the carplay_screen item, install it, and only then does the tablet open.

DUI Performance Notes

• DUI resolution is set per-screen — 1024 × 512 is balanced for typical usage
• Each active screen costs roughly the same as one extra browser tab in CEF
• The same React build is reused — no double-render cost
• ?dui=1 mode disables NUI callbacks (since DUI cannot fetch back to the resource)

Permission Gating

The screen installation is gated by Config.Screen.jobs and discordRoles — useful if you want only mechanics to install screens.

Module Toggle

Option	Default	Description
Config.Screen.enabled	true	Enable the entire DUI screen feature

Warning

The default prop mdigou_boombox_car_prop_02 is from a third-party asset pack. You must have that prop streamed on your server for the default config to work — otherwise replace propModel, textureDict and textureName with a prop you do have.