Téléphone vs tablette dans FiveM

Pourquoi deux appareils au lieu d’un ?

Lorsque nous avons lancé le Agency Phone pour la première fois, il est rapidement devenu le téléphone de jeu incontournable pour des centaines de serveurs FiveM. Mais à mesure que les propriétaires de serveurs commençaient à créer des écosystèmes de jeu de rôle plus complexes, une demande récurrente revenait : les joueurs souhaitaient un écran plus grand pour des tâches telles que parcourir le MDT, gérer des entreprises ou consulter des documents pendant le jeu de rôle. C'est exactement pourquoi nous avons construit le Agency Pad. Plutôt que de regrouper toutes les fonctionnalités dans une seule interface téléphonique, nous répartissons l'expérience sur deux appareils spécialement conçus. Le téléphone gère les interactions rapides en déplacement telles que les appels, les SMS et les notifications, tandis que le pad offre une expérience de tablette complète pour les tâches gourmandes en données. Cet article explique exactement quand tu dois utiliser chaque appareil et comment ils se complètent sur ton serveur.

Immobilier à l'écran et disposition de l'interface utilisateur

La différence la plus évidente entre Agency Phone et Agency Pad est la taille de l'écran. Agency Phone utilise une fenêtre d'affichage compacte de style mobile d'environ 360 x 640 pixels, conçue pour s'asseoir dans le coin de l'écran du joueur sans bloquer le jeu. Agency Pad, quant à lui, ouvre une fenêtre d'affichage de la taille d'une tablette d'environ 800 x 600 pixels qui occupe plus d'écran mais offre considérablement plus d'espace utilisable. Cela est important lorsque tu crées des applications qui affichent des tableaux, des formulaires ou des cartes. Une application de contacts de la taille d'un téléphone fonctionne parfaitement, mais essayez d'installer un MDT de police complet avec des dossiers suspects, des mandats et des photos de preuves sur un écran de 360 ​​​​pixels de large et les choses deviennent rapidement à l'étroit. Voici comment détecter sur quel appareil ton application est exécutée et ajuster la mise en page en conséquence :

-- client.lua: Detecting active device
local activeDevice = nil

RegisterNetEvent('agency:phone:opened', function()
    activeDevice = 'phone'
    SendNUIMessage({ action = 'setDevice', device = 'phone' })
end)

RegisterNetEvent('agency:pad:opened', function()
    activeDevice = 'pad'
    SendNUIMessage({ action = 'setDevice', device = 'pad' })
end)

-- In your NUI JavaScript
window.addEventListener('message', (e) => {
    if (e.data.action === 'setDevice') {
        document.body.classList.toggle('device-phone', e.data.device === 'phone')
        document.body.classList.toggle('device-pad', e.data.device === 'pad')
    }
})

Comparaison des fonctionnalités en un coup d'œil

Les deux appareils partagent un cadre d'application commun, ce qui signifie que toute application que tu crées peut techniquement s'exécuter sur l'un ou l'autre appareil. Cependant, certaines fonctionnalités sont optimisées pour l’une ou l’autre. Agency Phone excelle dans intégration des appels et du chat vocal, SMS et messagerie, notifications rapides, appareil photo et galerie de photos, gestion des contacts, et Navigation GPS. Agency Pad brille avec MDT et casier judiciaire, tableaux de bord de gestion d'entreprise, visualisation et édition de documents, superpositions de cartes avec plusieurs marqueurs, grilles de gestion des stocks, et panneaux d'administration. La distinction clé est la fréquence des interactions par rapport à la densité de l’information. Si un joueur a besoin de jeter un coup d’œil rapide sur quelque chose pendant le jeu, cela appartient au téléphone. S’ils ont besoin de s’asseoir et de travailler sur des données, le pad est le bon choix.

Considérations relatives aux performances

L’exécution simultanée de deux appareils NUI est une préoccupation courante pour les propriétaires de serveurs soucieux des performances des clients. La bonne nouvelle est que Agency Phone et Agency Pad sont construits sur le même moteur de rendu optimisé. Lorsqu'un appareil est fermé, son cadre NUI est complètement détruit plutôt que simplement masqué, ce qui libère de la mémoire et des ressources GPU. En moyenne, l’ouverture de l’un ou l’autre des appareils coûte environ 0,01 ms de temps de trame client, ce qui est négligeable. L’important est d’éviter que les deux appareils soient ouverts en même temps. Notre gestionnaire de périphériques intégré gère cela automatiquement en fermant le téléphone lorsque le pad s'ouvre et vice versa. Si tu crées des intégrations personnalisées, assurez-tu de respecter ce modèle :

-- Ensure only one device is active at a time
local function openPad()
    if GetResourceState('agency-phone') == 'started' then
        TriggerEvent('agency:phone:close')
    end
    Wait(100) -- Allow phone NUI to clean up
    SetNuiFocus(true, true)
    SendNUIMessage({ action = 'openPad' })
end

local function openPhone()
    if GetResourceState('agency-pad') == 'started' then
        TriggerEvent('agency:pad:close')
    end
    Wait(100)
    SetNuiFocus(true, true)
    SendNUIMessage({ action = 'openPhone' })
end

Cas d'utilisation : serveurs de police et EMS

C'est dans le jeu de rôle des forces de l'ordre et des services d'urgence que la combinaison téléphone-plus-pad brille vraiment. Les agents en patrouille utilisent le Agency Phone pour les communications radio, effectuent des contrôles rapides des plaques via une simple commande et reçoivent des notifications de répartition. Lorsqu'ils arrivent au poste ou ont besoin d'effectuer un travail détaillé, ils retirent le Agency Pad pour accéder au MDT complet avec les profils des suspects, les dossiers, la gestion des mandats et le suivi des preuves. Les joueurs EMS utilisent le téléphone pour les appels d'urgence entrants et le clavier pour les dossiers des patients et la gestion de l'hôpital. Cette répartition reflète le fonctionnement réel des premiers intervenants : une radio et un téléphone pour la communication sur le terrain, un ordinateur portable ou une tablette pour la saisie de données détaillées. Le flux de travail semble naturel et maintient le jeu de rôle immersif car les joueurs basculent physiquement entre les appareils en fonction de leur tâche en cours.

Cas d'utilisation : serveurs professionnels et économiques

Pour les serveurs dotés de systèmes à économie profonde, le pad devient un outil de gestion d’entreprise incontournable. Les restaurateurs utilisent Agency Phone pour prendre les commandes des clients via des messages texte rapides et recevoir des notifications de livraison, tandis que Agency Pad leur sert de système de point de vente, de suivi des stocks et de tableau de bord financier. Les concessionnaires automobiles parcourent leur inventaire de véhicules sur la grande grille du pad, avec des photos, des prix et des niveaux de stock, puis passent au téléphone pour appeler des acheteurs potentiels. Les agents immobiliers vérifient les listes de propriétés sur l'interface cartographique du pad et planifient les visites via le calendrier du téléphone. Le modèle est cohérent : le téléphone gère la communication et les recherches rapides, tandis que le pad gère tout ce qui bénéficie d'une fenêtre d'affichage plus grande et d'éléments d'interface utilisateur plus complexes.

Créer des applications qui fonctionnent sur les deux appareils

Si tu développes des applications personnalisées, la meilleure approche est une conception réactive qui s'adapte à l'appareil qui la charge. Utilisez des requêtes de conteneur CSS ou un style simple basé sur les classes pour ajuster les mises en page en fonction du périphérique actif. Conservez ton logique de base dans des modules JavaScript partagés et branchez uniquement la couche d'interface utilisateur. Voici un exemple pratique de composant d'application réactif qui ajuste sa disposition en grille en fonction du contexte de l'appareil :

/* styles.css - Responsive app layout */
.app-grid {
    display: grid;
    gap: 0.75rem;
    padding: 1rem;
}

.device-phone .app-grid {
    grid-template-columns: 1fr;
    font-size: 0.875rem;
}

.device-pad .app-grid {
    grid-template-columns: repeat(3, 1fr);
    font-size: 1rem;
}

.device-phone .detail-panel {
    display: none; /* Hide detail panel on phone */
}

.device-pad .detail-panel {
    display: block;
    border-left: 1px solid rgba(255,255,255,0.1);
    padding-left: 1rem;
}

/* Phone: stack navigation vertically */
.device-phone .app-nav {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
}

/* Pad: sidebar navigation */
.device-pad .app-nav {
    display: flex;
    flex-direction: column;
    width: 200px;
}

Lequel devriez-tu acheter pour ton serveur ?

Si tu utilises un serveur de jeu de rôle à usage général et que tu ne pouvez en choisir qu'un, commencez par Agency Phone. Il couvre les interactions les plus courantes entre les joueurs et chaque serveur a besoin d'un système téléphonique solide. Ajoutez Agency Pad ultérieurement lorsque ton serveur se développera vers des systèmes plus complexes tels que des MDT, des outils de gestion d'entreprise ou d'administration. Si tu construises dès le départ un serveur sérieux axé sur l’application de la loi ou axé sur l’économie, obtenez les deux. L’expérience combinée est nettement plus immersive que d’essayer de tout regrouper dans un seul appareil. Les deux produits reçoivent des mises à jour régulières et partagent le même plugin API, de sorte que tout investissement que tu effectues dans le développement d'applications personnalisées se répercute de manière transparente entre les deux appareils. Consultez notre magasin pour connaître les prix des forfaits si tu décides d’acquérir les deux.