Défilement de la collection d’objets — MRTK2

Scrolling object collection

La collection d’objets de défilement MRTK est un composant d’expérience utilisateur qui permet de faire défiler du contenu 3D via une zone visible contenue. Le mouvement de défilement peut être déclenché par une interaction d’entrée proche ou éloignée et par pagination discrète. Il prend en charge les objets interactifs et non interactifs.

Prise en main de la collection d’objets de défilement

Configuration de la scène

  1. Créez une scène Unity.
  2. Ajoutez MRTK à la scène en accédant au kit de ressources> Mixed RealityAjouter à la scène et à configurer.

Configuration de l’objet de défilement

  1. Créez un objet de jeu vide dans la scène et remplacez sa position par (0, 0, 1).

  2. Ajoutez un composant de collection d’objets de défilement à l’objet de jeu.

    Lorsque la collection d’objets de défilement est ajoutée, un collisionneur de boîtes et un composant tactile proche de l’interaction seront automatiquement attachés à l’objet de jeu racine. Ces composants permettent à l’objet de défilement d’écouter les événements d’entrée d’interaction proche et lointain, comme un pointeur tactile ou un clic.

    La collection d’objets de défilement MRTK comporte deux éléments importants créés en tant qu’objets de jeu enfants sous la hiérarchie d’objets de défilement racine :

    • Container - Tous les objets de contenu de défilement doivent être des enfants de l’objet de jeu conteneur.
    • Clipping bounds - Si le masquage de contenu de défilement est activé, l’élément de découpage garantit que seul le contenu défilementable à l’intérieur de ses limites est visible. L’objet de jeu de découpage a deux composants : un collisionneur de boîte désactivé et une boîte de découpage.

Scrolling object collection elements

Ajout de contenu à l’objet de défilement

La collection d’objets de défilement peut être combinée avec une collection d’objets de grille pour mettre en page le contenu dans une grille d’éléments alignés qui ont une taille uniforme et un espacement.

  1. Créez un objet de jeu vide en tant qu’enfant du conteneur de défilement.
  2. Ajoutez un composant de collection d’objets grid à l’objet de jeu.
  3. Pour un défilement de colonne unique vertical, sous l’onglet inspecteur, configurez la collection d’objets grid comme suit :
    • Nombre de colonnes : 1
    • Disposition : colonne puis ligne
    • Ancre : haut à gauche
  4. Modifiez la largeur et la hauteur des cellules en fonction des dimensions des objets de contenu.
  5. Ajoutez les objets de contenu en tant qu’enfants de l’objet grid.
  6. Appuyez sur la collection de mises à jour.

Grid layout

Important

Tout matériau d’objet de contenu de défilement doit utiliser le nuanceur standard MRTK afin que l’effet de découpage sur la zone visible fonctionne correctement.

Notes

Si le masquage de contenu de défilement est activé, la collection d’objets de défilement ajoute un composant d’instance de matériel à tous les objets de contenu qui ont un renderer attaché. Ce composant est utilisé pour gérer la durée de vie des matériaux instanceux et améliorer les performances de la mémoire.

Configuration de la zone visible de défilement

  1. Pour parcourir verticalement une seule colonne d’objets, sous l’onglet inspecteur, configurez la collection d’objets de défilement comme suit :
    • Cellules par niveau : 1
    • Choisissez le nombre de niveaux par page en fonction du nombre souhaité de lignes visibles
  2. Modifiez la largeur, la hauteur et la profondeur de la cellule de page en fonction des dimensions des objets de contenu.

Notez comment les objets de contenu qui se trouvent en dehors de la zone visible de défilement sont désormais désactivés, tandis que les objets qui croisent le wireframe de défilement peuvent être partiellement masqués par la primitive de découpage.

Viewable area

Test de la collection d’objets de défilement dans l’éditeur

  1. Appuyez sur Lire et maintenez la barre Espace enfoncée pour afficher une main de simulation d’entrée.
  2. Déplacez la main jusqu’à ce que le collisionneur de défilement ou tout contenu interactif de défilement soit en focus et déclenche le mouvement de défilement en cliquant et en faisant glisser vers le haut et vers le bas avec la souris gauche.

Contrôle de l’objet de défilement à partir du code

La collection d’objets de défilement MRTK expose quelques méthodes publiques qui permettent de déplacer le conteneur de défilement en alignant sa position en fonction de la pagination configuration des propriétés.

Un exemple d’accès à l’interface de pagination de collection d’objets de défilement est disponible pour l’utiliser sous le MRTK/Examples/Demos/ScrollingObjectCollection/Scripts dossier. L’exemple de script pagination défilementable peut être lié à n’importe quelle collection d’objets de défilement existante dans la scène. Le script peut ensuite être référencé par des composants de scène exposant des événements Unity (par exemple, bouton MRTK).

public class ScrollablePagination : MonoBehaviour
{
    [SerializeField]
    private ScrollingObjectCollection scrollView;

    public void ScrollByTier(int amount)
    {
        scrollView.MoveByTiers(amount);
    }
}

Défilement des propriétés de la collection d’objets

Général Description
Direction de défilement Direction dans laquelle le contenu doit faire défiler.
Pagination Description
Cellules par niveau Nombre de cellules d’une ligne en mode défilement haut vers le bas ou nombre de cellules d’une colonne dans la vue de défilement gauche-droite.
Niveaux par page Nombre de niveaux visibles dans la zone de défilement.
Cellule de page Dimensions de la cellule pagination.
Paramètres avancés Description
Mode d’édition du masque Modes d’édition pour définir les limites de masquage de zone de découpage. « Auto » utilise automatiquement des valeurs de pagination. 'Manual' permet une manipulation directe de l’objet de boîte de découpage.
Mode d’édition du collisionneur Modes d’édition pour définir les limites des collisionneurs d’interaction de défilement. « Auto » utilise automatiquement des valeurs de pagination. « Manuel » permet une manipulation directe du collisionneur.
Peut faire défiler Active/désactive le défilement avec une interaction proche/loin.
Utiliser sur le rendu préalable Bascule si le défilementObjectCollection utilisera l’événement OnPreRender Caméra pour gérer la visibilité du contenu.
Courbe de pagination Courbe d’animation pour la pagination.
Longueur de l’animation La durée (en secondes) de la PaginationCurve prend une évaluation.
Seuil de défilement delta de main La distance, en mètres, le pointeur actuel peut se déplacer le long de la direction de défilement avant de déclencher un glisser-défilement.
Distance tactile frontale Distance, en mètres, pour positionner un plan xy local utilisé pour vérifier si une interaction tactile a démarré en face de la vue de défilement.
Seuil de mise en production Retirez la quantité, en mètres, des limites de défilement nécessaires pour passer du contact engagé à la libération.
Vélocité Description
Type de vitesse Type de chute de vitesse souhaité pour le défilement.
Multiplicateur de vitesse Quantité de vitesse (supplémentaire) à appliquer au défilement.
Humidité de la vitesse Quantité de chute appliquée à la vitesse.
Multiplicateur de rebond Multiplicateur pour ajouter plus de rebond à la surscroll d’une liste lors de l’utilisation de falloff par frame ou de falloff par élément.
Options de débogage Description
Masque activé Mode de visibilité du contenu de défilement. La valeur par défaut masque tous les objets en dehors de la zone visible par défilement.
Afficher les plans de seuil Si la valeur est true, l’éditeur affiche les plans de seuil de libération tactile autour des limites de défilement.
Déboguer la pagination Utilisez cette section pour déboguer la pagination de défilement pendant l’exécution.
Événements Description
En cliquant sur Déclenché lorsque le collisionneur d’arrière-plan de défilement ou l’un de ses contenus interactifs reçoit un clic.
À l’écran tactile démarré Déclenché lorsque le collisionneur d’arrière-plan de défilement ou l’un de ses contenus interactifs reçoit une interaction tactile proche.
Fin de l’interaction tactile Déclenché lorsqu’une interaction tactile active est arrêtée lorsque le pointeur d’interaction proche franchit un plan de seuil de mise en production.
Sur l’élan démarré Déclenché lorsque le conteneur de défilement commence à se déplacer par interaction, baisse de vitesse ou pagination.
Sur l’élan terminé Déclenché lorsque le conteneur de défilement cesse de se déplacer par interaction, baisse de vitesse ou pagination.

Exemple de scène de défilement

L’exemple de scène ScrollingObjectCollection.unity se compose de 3 exemples de défilement, chacun avec une configuration de secours de vitesse différente. L’exemple de scène contient des murs pour montrer le comportement de placement de la surface qui est désactivé par défaut dans la hiérarchie. L’exemple de scène se trouve sous le MRTK/Examples/Demos/ScrollingObjectCollection/Scenes dossier.

Scrolling object collection example scene

Exemple de préfabriqués de défilement

Pour des raisons pratiques, deux préfabriqués de collection d’objets à défilement sont disponibles. Les exemples de préfabriqués se trouvent sous le MRTK/Examples/Demos/ScrollingObjectCollection/Prefabs dossier.

Scrolling object collection prefabs

Voir aussi