Control deslizante

Puedes usar los controles deslizantes para mostrar la barra de carga, progreso o navegación en la parte inferior de la pantalla. Los controles deslizantes son componentes de UX globales y deben tratarse con cuidado cuando se implementan en la cristalería.

Importante:

• Los controles deslizantes se comparten entre diferentes actividades de Glass. Por ejemplo, si inicias un control deslizante en tu actividad y el usuario pausa tu actividad para iniciar una nueva que inicia su propio control deslizante, cuando se reanude tu actividad, no se continuará con el control deslizante. Si deseas que el control deslizante vuelva a aparecer, debes manejar esta situación.
• Las solicitudes del control deslizante deben asociarse con una vista, y esas solicitudes solo se respetan cuando la ventana que contiene esa vista tiene el foco. Si se enfoca otra ventana en Glass, el sistema ocultará el control deslizante.

Control deslizante

Los controles deslizantes de desplazamiento se usan para indicar la posición de una tarjeta cuando te deslizas por varias tarjetas. Puedes crear el mismo tipo de efecto con Slider.Scroller.

1. Usa Slider.from() a fin de crear un Slider que use un View para mostrar el control deslizante.
2. Crea el Slider.Scroller con startScroller() y establece las posiciones máximas y iniciales.

A continuación, se incluye una implementación simple que anima un desplazador a la siguiente posición cuando el usuario presiona:

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();
    }
}

Control deslizante de período de gracia

Los controles deslizantes de período de gracia funcionan en actividades en las que es útil que un usuario vea una notificación, pero no la interacción del usuario. Puedes agregar esta animación mediante Slider.GracePeriod.

1. Usa Slider.from() a fin de crear un Slider que use un View para mostrar el control deslizante.
2. Crea un GracePeriod.Listener y, luego, implementa los objetos onGracePeriodEnd() y onGracePeriodCancel() para controlar esos eventos.
3. Para crear una Slider.GracePeriod y comenzar la animación, pasa el objeto GracePeriod.Listener al método startGracePeriod().
4. Anula el objeto onBackPressed() de la actividad para controlar el gesto de deslizar hacia abajo.
5. Si el usuario desliza el dedo hacia abajo, llama a cancel() en Slider.GracePeriod para descartar el control deslizante.

En el siguiente ejemplo, el desplazador de período de gracia se inicia con un objeto de escucha que reproduce un sonido de éxito cuando termina el período y un sonido descartado si el control deslizante del período de gracia se cancela:

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();
        }
    }
}

Control deslizante

Los controles deslizantes determinados se usan principalmente para mostrar el progreso cuando puedes calcular cuándo finaliza una tarea. Puedes agregar esta animación mediante Slider.Determinate.

1. Usa Slider.from() a fin de crear un Slider que use un View para mostrar el control deslizante.
2. Crea el Slider.Determinate con startScroller() y establece las posiciones máximas y iniciales.
3. Cuando finalice la animación, llama al método hide() en el Slider.Determinate para ocultar el control deslizante.

A continuación, se incluye una implementación simple que anima el desplazador a una posición establecida cuando el usuario presiona:

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);
    }
}

Control deslizante indeterminado

Los controles deslizantes indeterminados se pueden usar para cargar pantallas en las que es difícil calcular cuándo finaliza la tarea. Puedes agregar esta animación mediante Slider.Indeterminate.

1. Usa Slider.from() a fin de crear un Slider que use un View para mostrar el control deslizante.
2. Inicia la animación con el método Slider.startIndeterminate().
3. Cuando estés listo para detener la animación, llama al método hide() en el Slider.Indeterminate.

A continuación, se incluye una implementación simple que crea el desplazador indeterminado cuando el usuario presiona la tarjeta y la oculta cuando vuelve a presionar:

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);
    }
}