Scanner de codes-barres

Aperçu

Le composant Avonni Barcode Scanner permet aux utilisateurs de scanner des codes-barres à l'aide de la caméra d'un appareil au sein des composants dynamiques Avonni. Il est idéal pour le suivi des stocks, la gestion des actifs ou la capture rapide de données, offrant des modes de numérisation flexibles et un retour visuel.

Le composant Barcode Scanner ne fonctionne que lorsqu'il est utilisé dans l'application mobile Salesforce. Bien que vous puissiez le configurer dans l'application Dynamic Components Builder, utilisez-le exclusivement dans l'application mobile.

Fonctionnalités clés :

• Démarrage automatique ou manuel : Ouvrir le scanner au chargement ou via un bouton.

• Prise en charge des types de codes-barres : Scanner des formats de codes-barres spécifiques ou tous les formats pris en charge.

• Interface personnalisable : Définir les instructions, les messages de succès, la taille et les animations.

• Options de numérisation multiple : Prise en charge du traitement en masse ou simultané.

• Interactions : Déclencher des actions après des scans réussis (par ex., mettre à jour des enregistrements).

• Contrôle de la caméra : Choisir la caméra avant/arrière et prévisualiser les données.

Astuce: Utilisez dans les Flows pour une numérisation adaptée au mobile ; associez aux interactions pour traiter les données scannées instantanément.

Cas d'utilisation

• Gestion des stocks (par ex., scanner les codes-barres des produits pour mettre à jour le stock).

• Suivi des actifs (par ex., enregistrer les identifiants d'équipements dans Salesforce).

• Enregistrements d'événements (par ex., scanner les billets des participants).

• Systèmes de point de vente (par ex., capturer plusieurs articles en masse).

• Service sur le terrain (par ex., scanner des numéros de série pour enregistrer la maintenance).

---

Configuration

Sélectionnez le Barcode Scanner sur la zone de travail pour accéder aux propriétés dans le panneau Propriétés à droite.

Propriétés de base

Celles-ci contrôlent le comportement du scanner et la gestion des données.

Propriété	Type	Description	Exemple
Nom API	Texte	Identifiant unique pour l'instance.	BarcodeScanner
Ouverture au chargement	Booléen	Si activé, le scanner s'ouvre automatiquement lors du chargement du composant.	Désactivé.
Types de codes-barres	Sélection/Liste	Types à scanner (par ex., QR, UPC) ; par défaut, tous les formats pris en charge.	QR, Code128.
Texte d'instruction	Texte	Instruction affichée dans l'interface du scanner.	"Pointez la caméra vers le code-barres."
Texte de succès	Texte	Message affiché après un scan réussi.	"Scan réussi !"
Activer le scan en masse	Booléen	Permet plusieurs scans jusqu'à ce que l'utilisateur annule ou quitte.	Activé.
Activer la numérisation multiple	Booléen	Scanne plusieurs codes-barres simultanément (active automatiquement le scan en masse).	Désactivé.
Afficher la coche de succès	Booléen	Affiche une coche lors d'un scan réussi.	Activé.
Taille du scanner	Sélectionner	Taille de la vue de la caméra en pourcentage de l'écran de l'appareil.	Moyen (50%).
Orientation de la caméra	Sélectionner	Caméra : avant ou arrière.	arrière.
Présenter avec animation	Booléen	Anime l'entrée/sortie du scanner lors de l'ouverture/fermeture.	Activé.
Confirmation manuelle	Booléen	Exige que l'utilisateur confirme chaque scan.	Désactivé.
Aperçu des données du code-barres	Booléen	Affiche les données du code-barres pendant la numérisation.	Activé.

Meilleure pratique : Utilisez le Texte d'instruction pour guider clairement les utilisateurs ; activez le scan en masse pour les tâches à fort volume.

Paramètres du bouton

Personnalisez le bouton qui déclenche le scanner (si non Ouverture au chargement).

Propriété	Type	Description	Options/Exemples
Libellé	Texte	Texte du bouton.	"Démarrer le scan"
Variant	Sélectionner	Style : par ex., brand, neutral, destructive.	brand.
Nom de l'icône	Texte (Optionnel)	Icône (SLDS/Avonni).	utility:scan
Type	Sélectionner	Type de bouton (par ex., standard, icône).	standard.
Étirer	Booléen	Étirer le bouton à la largeur du conteneur.	Désactivé.
Désactivé	Booléen	Désactive le bouton.	Désactivé.

Astuce: Utilisez une variante audacieuse comme « brand » et une icône comme « utility:scan » pour une expérience utilisateur claire.

Onglet Interactions

Définissez les actions sur scans réussis.

Propriété	Type	Description
Lors d'un scan réussi	Paramètres	Déclencher au scan : Accédez aux données via $Component.BarcodeScanner.Value (par ex., Mettre à jour l'enregistrement, Ouvrir un Flow).

Exemples

Exemple 1 : Scan d'inventaire d'un seul code-barres

Cet exemple scanne un seul code-barres produit pour mettre à jour l'inventaire.

1. Configurer le scanner :

   • Nom API : InventoryScanner

   • Ouverture au chargement : Désactivé

   • Types de codes-barres : UPC

   • Texte d'instruction : "Scanner le code-barres du produit"

   • Texte de succès : "Produit ajouté !"

   • Afficher la coche de succès : Activé

   • Taille du scanner : Moyen

   • Orientation de la caméra : arrière

2. Paramètres du bouton :

   • Libellé : "Scanner l'article"

   • Variant : brand

   • Nom de l'icône : utility:scan

3. Ajouter une interaction :

   • Lors d'un scan réussi : Mettre à jour l'enregistrement (par ex., définir le champ Product Inventory__c en utilisant $Component.InventoryScanner.Value).

Résultat : Cliquer sur le bouton ouvre le scanner ; un scan réussi met à jour l'enregistrement et affiche une coche.

---

Exemple 2 : Scan d'actifs en masse

Cet exemple scanne plusieurs codes-barres d'actifs avec un panneau latéral pour les résultats.

1. Configurer le scanner :

   • Nom API : AssetScanner

   • Activer le scan en masse : Activé

   • Activer la numérisation multiple : Activé

   • Texte d'instruction : "Scanner plusieurs actifs"

   • Taille du scanner : Grande

   • Aperçu des données du code-barres : Activé

2. Paramètres du bouton :

   • Libellé : "Démarrer le scan en masse"

   • Variant : neutral

3. Ajouter une interaction :

   • Lors d'un scan réussi : Ajouter des résultats.

Résultat : Les utilisateurs scannent plusieurs codes-barres, une liste.

---

Considérations clés

• Gestion des données : Les données scannées sont disponibles en tant que $Component.API_Name.Value ; utilisez-les pour des mises à jour ou des flows.

• Types de codes-barres : Limitez les types pour réduire les erreurs (par ex., uniquement QR pour les billets).

• Scan en masse vs numérisation multiple : Le mode en masse permet des scans séquentiels ; la numérisation multiple capture plusieurs codes dans un seul cadre.

• Optimisation mobile : Testez la Taille du scanner / l'Orientation de la caméra sur des appareils ; les caméras arrière sont de meilleure qualité.

• Interactions : Lie les données de scan aux Variables ou aux Flows pour le traitement (par ex., mises à jour d'inventaire).

• Accessibilité : Assurez-vous que les Textes d'instruction/de succès sont clairs ; les animations aident le retour visuel.

---

Dépannage des problèmes courants

• Le scanner ne s'ouvre pas : Vérifiez l'Ouverture au chargement ou si le bouton est Désactivé ; assurez-vous de l'accès à la caméra de l'appareil.

• Aucun scan détecté : Vérifiez que les Types de codes-barres correspondent aux codes scannés ; testez les conditions d'éclairage.

• Données non capturées : Confirmez que l'interaction lie correctement $Component.API_Name.Value.

• Problèmes d'interface : Ajustez la Taille du scanner pour l'adapter à l'écran ; désactivez les animations si elles provoquent des ralentissements.

• La numérisation multiple échoue : Assurez-vous que l'appareil prend en charge la détection simultanée ; basculez sur le scan en masse en secours.

• Le bouton n'apparaît pas : Vérifiez le Variant/Type ; assurez-vous qu'il n'est pas Désactivé.

---

Résumé

Le composant Avonni Barcode Scanner simplifie la capture de codes-barres avec des modes flexibles et des intégrations pour les workflows Salesforce. Il est parfait pour l'inventaire, les actifs ou les événements.