Curseur

Vous pouvez utiliser des curseurs pour afficher une barre de chargement, de progression ou de navigation en bas de l'écran. Les curseurs sont des composants d'expérience utilisateur globaux et doivent être traités avec précaution lors de leur mise en œuvre dans vos Glassware.


Curseur

Les curseurs de défilement permettent d'indiquer la position d'une fiche lorsque vous la parcourez. Vous pouvez créer le même type d'effet à l'aide de Slider.Scroller.

  1. Utilisez Slider.from() pour créer un Slider qui utilise un View pour afficher le curseur.
  2. Créez le Slider.Scroller à l'aide de startScroller() et définissez les positions maximale et initiale.

Voici une implémentation simple qui anime un curseur à la position suivante lorsque l'utilisateur appuie:

public final class SliderActivity extends Activity {

    private static final int MAX_SLIDER_VALUE = 5;
    private static final long ANIMATION_DURATION_MILLIS = 5000;

    private CardScrollView mCardScroller;
    private Slider mSlider;

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        // Create the cards for the view
        mCardScroller = new CardScrollView(this);
        mCardScroller.setAdapter(new CardAdapter(createCards()));

        // Set the view for the Slider
        mSlider = Slider.from(mCardScroller);

        mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                    int position, long id) {
                processSliderRequest(position+1);
            }
        });

        setContentView(mCardScroller);
    }

    private void processSliderRequest(position) {
        Slider.Scroller scroller = mSlider.startScroller(MAX_SLIDER_VALUE, 0);

        // Animate the slider to the next position. The slider
        // automatically hides after the duration has elapsed
        ObjectAnimator.ofFloat(scroller, "position", 0, position)
            .setDuration(ANIMATION_DURATION_MILLIS)
            .start();
    }
}

Curseur du délai de grâce

Les curseurs pour le délai de grâce fonctionnent dans les activités où l'utilisateur peut voir une notification, mais l'interaction de l'utilisateur n'est pas obligatoire. Vous pouvez ajouter cette animation à l'aide de la commande Slider.GracePeriod.

  1. Utilisez Slider.from() pour créer un Slider qui utilise un View pour afficher le curseur.
  2. Créez un GracePeriod.Listener et implémentez les onGracePeriodEnd() et onGracePeriodCancel() pour gérer ces événements.
  3. Créez un Slider.GracePeriod et démarrez l'animation en transmettant le GracePeriod.Listener à la méthode startGracePeriod().
  4. Remplacez le onBackPressed() de l'activité pour gérer le geste de balayage vers le bas.
  5. Si l'utilisateur balaie l'écran vers le bas, appelez cancel() sur Slider.GracePeriod pour fermer le curseur.

Dans l'exemple suivant, le curseur de défilement du délai de grâce est lancé avec un écouteur qui émet un son de réussite à la fin du cycle et un son ignoré si le curseur du délai de grâce est annulé:

public final class SliderActivity extends Activity {

    ...
    private Slider.GracePeriod mGracePeriod;

    private final GracePeriod.Listener mGracePeriodListener =
        new GracePeriod.Listener() {

        @Override
        public void onGracePeriodEnd() {
            // Play a SUCCESS sound to indicate the end of the grace period.
            AudioManager am = (AudioManager) getSystemService(Context.AUDIO_SERVICE);
            am.playSoundEffect(Sounds.SUCCESS);
            mGracePeriod = null;
        }

        @Override
        public void onGracePeriodCancel() {
            // Play a DIMISS sound to indicate the cancellation of the grace period.
            AudioManager am = (AudioManager) getSystemService(Context.AUDIO_SERVICE);
            am.playSoundEffect(Sounds.DISMISSED);
            mGracePeriod = null;
        }
    };

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        // Create the cards for the view
        mCardScroller = new CardScrollView(this);
        mCardScroller.setAdapter(new CardAdapter(createCards()));

        // Set the view for the Slider
        mSlider = Slider.from(mCardScroller);

        mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                    int position, long id) {
                mGracePeriod = mSlider.startGracePeriod(mGracePeriodListener);
            }
        });

        setContentView(mCardScroller);
    }

    @Override
    public void onBackPressed() {
        // If the Grace Period is running,
        // cancel it instead of finishing the Activity.
        if (mGracePeriod != null) {
            mGracePeriod.cancel();
        } else {
            super.onBackPressed();
        }
    }
}

Curseur de détermination

Les curseurs déterminants sont principalement utilisés pour afficher la progression permettant de calculer la fin d'une tâche. Vous pouvez ajouter cette animation à l'aide de la commande Slider.Determinate.

  1. Utilisez Slider.from() pour créer un Slider qui utilise un View pour afficher le curseur.
  2. Créez le Slider.Determinate à l'aide de startScroller() et définissez les positions maximale et initiale.
  3. Une fois l'animation terminée, appelez la méthode hide() sur Slider.Determinate pour masquer le curseur.

Voici une implémentation simple qui anime le curseur lorsque l'utilisateur appuie sur une position définie:

public final class SliderActivity extends Activity {

    ...
    private Slider.Determinate mDeterminate;

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        // Create the cards for the view
        mCardScroller = new CardScrollView(this);
        mCardScroller.setAdapter(new CardAdapter(createCards()));

        // Set the view for the Slider
        mSlider = Slider.from(mCardScroller);

        mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                   int position, long id) {
                mDeterminate = mSlider.startDeterminate(MAX_SLIDER_VALUE, 0);
                ObjectAnimator animator = ObjectAnimator.ofFloat(mDeterminate,
                    "position", 0, MAX_SLIDER_VALUE);

                // Hide the slider when the animation stops.
                animator.addListener(new AnimatorListenerAdapter() {
                    @Override
                    public void onAnimationEnd(Animator animation) {
                        mDeterminate.hide();
                    }
                });

                // Start an animation showing the different positions of the slider.
                animator.setDuration(ANIMATION_DURATION_MILLIS).start();
            }
        });

        setContentView(mCardScroller);
    }
}

Curseur indéterminé

Les curseurs indéterminés peuvent être utilisés pour charger des écrans dans lesquels il est difficile de calculer la fin de la tâche. Vous pouvez ajouter cette animation à l'aide de la commande Slider.Indeterminate.

  1. Utilisez Slider.from() pour créer un Slider qui utilise un View pour afficher le curseur.
  2. Démarrez l'animation avec la méthode Slider.startIndeterminate().
  3. Lorsque vous êtes prêt à arrêter l'animation, appelez la méthode hide() sur Slider.Indeterminate.

Voici une implémentation simple qui crée le curseur de défilement indéterminé lorsque l'utilisateur appuie sur la carte et la masque lorsque l'utilisateur appuie à nouveau:

public final class SliderActivity extends Activity {

    ...
    private Slider.Indeterminate mIndeterminate;

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        // Create the cards for the view
        mCardScroller = new CardScrollView(this);
        mCardScroller.setAdapter(new CardAdapter(createCards()));

        // Set the view for the Slider
        mSlider = Slider.from(mCardScroller);

        mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                   int position, long id) {
                // Toggle between showing/hiding the indeterminate slider.
                if (mIndeterminate != null) {
                    mIndeterminate.hide();
                    mIndeterminate = null;
                } else {
                    mIndeterminate = mSlider.startIndeterminate();
                }
        });

        setContentView(mCardScroller);
    }
}