Suwak

Za pomocą suwaków możesz wyświetlić pasek ładowania, postępu lub nawigacji u dołu ekranu. Suwaki to komponenty UX na całym świecie, które należy traktować ostrożnie podczas wdrażania w Glassware.

Ważne:

• Szkła są udostępniane między różnymi czynnościami w Google Glass. Jeśli na przykład uruchomisz suwak w aktywności, a użytkownik wstrzyma ją, aby rozpocząć nową aktywność, która uruchamia własny suwak, przy wznowieniu aktywności, suwak nie będzie kontynuowany. Jeśli chcesz, by suwak znowu się wyświetlał, musisz wykonać tę czynność.
• Żądania suwaka muszą być powiązane z widokiem danych, a żądania te są przestrzegane tylko wtedy, gdy okno zawierające ten widok jest zaznaczone. Jeśli na Google Glass pojawi się kolejne okno, system ukryje suwak.

Suwak przewijania

Suwaki przewijania służą do wskazywania pozycji karty podczas przesuwania wielu kart. Ten sam efekt możesz utworzyć za pomocą Slider.Scroller.

1. Użyj Slider.from(), aby utworzyć Slider, która wyświetla suwak przy użyciu View.
2. Utwórz Slider.Scroller za pomocą startScroller() i ustaw pozycje maksymalne i początkowe.

Oto prosta implementacja, która animuje przewijanie do następnej pozycji, gdy użytkownik kliknie:

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

Suwak okresu prolongaty

Suwaki okresu prolongaty działają w sytuacjach, w których użytkownik widzi powiadomienie, ale interakcja z nim nie jest wymagana. Możesz dodać tę animację za pomocą Slider.GracePeriod.

1. Użyj Slider.from(), aby utworzyć Slider, która wyświetla suwak przy użyciu View.
2. Utwórz GracePeriod.Listener i zaimplementuj onGracePeriodEnd() oraz onGracePeriodCancel() do obsługi tych zdarzeń.
3. Utwórz Slider.GracePeriod i rozpocznij animację, przekazując właściwość GracePeriod.Listener do metody startGracePeriod().
4. Zastąp onBackPressed() aktywności, aby wykonać gest przesuwania w dół.
5. Jeśli użytkownik przesunie palcem w dół, wywołaj przycisk cancel() na urządzeniu Slider.GracePeriod, aby zamknąć suwak.

W tym przykładzie przewijanie okresu prolongaty rozpoczyna się od słuchacza, który odtwarza dźwięk po zakończeniu okresu, a dźwięk zamyka się, gdy suwak okresu prolongaty zostanie anulowany:

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

Określ suwak

Suwaki wyznaczające służą głównie do pokazywania postępu, gdy zadanie jest wykonywane. Możesz dodać tę animację za pomocą Slider.Determinate.

1. Użyj Slider.from(), aby utworzyć Slider, która wyświetla suwak przy użyciu View.
2. Utwórz Slider.Determinate za pomocą startScroller() i ustaw pozycje maksymalne i początkowe.
3. Po zakończeniu animacji wywołaj metodę hide() na obiekcie Slider.Determinate, aby ukryć suwak.

Oto prosta implementacja, która animuje przewijanie do określonej pozycji, gdy użytkownik kliknie:

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

Nieokreślony suwak

Do ładowania ekranów, na których trudno jest obliczyć czas po zakończeniu zadania, można użyć nieokreślonych suwaków. Możesz dodać tę animację za pomocą Slider.Indeterminate.

1. Użyj Slider.from(), aby utworzyć Slider, która wyświetla suwak przy użyciu View.
2. Uruchom animację za pomocą metody Slider.startIndeterminate().
3. Aby zatrzymać animację, wywołaj metodę hide() w Slider.Indeterminate.

Oto prosta implementacja, która powoduje, że gdy użytkownik klika kartę, a następnie ukrywa ją, gdy użytkownik ją kliknie:

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