Mit Schiebereglern können Sie am unteren Bildschirmrand eine Lade-, eine Fortschritts- oder Navigationsleiste einblenden. Slider sind globale UX-Komponenten und sollten mit Sorgfalt behandelt werden, wenn sie in Ihrer Glassware implementiert werden.
Schieberegler
Mit Schiebereglern wird die Position einer Karte beim Wischen durch mehrere Karten angegeben. Mit Slider.Scroller
können Sie denselben Effekt erstellen.
- Verwenden Sie
Slider.from()
, um einenSlider
zu erstellen, der einView
zum Anzeigen des Schiebereglers verwendet. - Erstellen Sie den
Slider.Scroller
mitstartScroller()
und legen Sie die maximale und die Anfangsposition fest.
Hier sehen Sie eine einfache Implementierung, bei der ein Scroller zur nächsten Position animiert wird, wenn der Nutzer tippt:
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();
}
}
Kulanzzeitraum-Schieberegler
Schieberegler für Kulanzzeiträume funktionieren in Aktivitäten, bei denen es für einen Nutzer hilfreich ist, eine Benachrichtigung anzusehen. Eine Nutzerinteraktion ist jedoch nicht erforderlich. Sie können diese Animation mit Slider.GracePeriod
hinzufügen.
- Verwenden Sie
Slider.from()
, um einenSlider
zu erstellen, der einView
zum Anzeigen des Schiebereglers verwendet. - Erstellen Sie einen
GracePeriod.Listener
und implementieren SieonGracePeriodEnd()
undonGracePeriodCancel()
, um diese Ereignisse zu verarbeiten. - Erstellen Sie einen
Slider.GracePeriod
und starten Sie die Animation. Dazu übergeben Sie denGracePeriod.Listener
an die MethodestartGracePeriod()
. - Überschreiben Sie die
onBackPressed()
der Aktivität, um die Wischbewegung nach unten zu verarbeiten. - Wenn der Nutzer nach unten wischt, ruf
cancel()
aufSlider.GracePeriod
auf, um den Schieberegler zu schließen.
Im folgenden Beispiel wird der Kulanzzeitraum-Scroller mit einem Listener gestartet, der nach Ablauf des Zeitraums einen Erfolgton ausgibt, und einen verworfenen Ton, wenn der Schieberegler für den Kulanzzeitraum abgebrochen wird:
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();
}
}
}
Schieberegler bestimmen
Bestimmte Schieberegler werden hauptsächlich zum Anzeigen des Fortschritts verwendet, bei dem Sie den Abschluss einer Aufgabe berechnen können. Sie können diese Animation mit Slider.Determinate
hinzufügen.
- Verwenden Sie
Slider.from()
, um einenSlider
zu erstellen, der einView
zum Anzeigen des Schiebereglers verwendet. - Erstellen Sie den
Slider.Determinate
mitstartScroller()
und legen Sie die maximale und die Anfangsposition fest. - Wenn die Animation abgeschlossen ist, rufen Sie die Methode
hide()
inSlider.Determinate
auf, um den Schieberegler auszublenden.
Hier sehen Sie eine einfache Implementierung, bei der der Scroller an eine festgelegte Position animiert wird, wenn der Nutzer tippt:
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);
}
}
Unbestimmter Schieberegler
Unbestimmte Schieberegler können zum Laden von Bildschirmen verwendet werden, deren Abschluss nach Abschluss der Aufgabe schwierig zu berechnen ist. Sie können diese Animation mit Slider.Indeterminate
hinzufügen.
- Verwenden Sie
Slider.from()
, um einenSlider
zu erstellen, der einView
zum Anzeigen des Schiebereglers verwendet. - Starten Sie die Animation mit der Methode
Slider.startIndeterminate()
. - Wenn Sie die Animation beenden möchten, rufen Sie die Methode
hide()
auf derSlider.Indeterminate
auf.
Mit dieser einfachen Implementierung wird der unbestimmte Scroller erstellt, wenn der Nutzer auf die Karte tippt und ausgeblendet, wenn der Nutzer noch einmal tippt:
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);
}
}