Você pode usar controles deslizantes para mostrar uma barra de carregamento, de progresso ou de navegação no parte inferior da tela. Os controles deslizantes são componentes globais de UX e precisam ser tratados com cuidado ao implementá-los em seu Glassware.
Controle deslizante de rolagem
Os controles deslizantes de rolagem são usados para indicar a posição de um card quando você desliza.
em vários cartões. Você pode criar o mesmo tipo de efeito usando
Slider.Scroller
- Usar
Slider.from()
para criarSlider
que usa umView
para exibir o controle deslizante. - Crie o
Slider.Scroller
usandostartScroller()
e defina as posições inicial e máxima.
Confira uma implementação simples que anima um botão de rolagem para a próxima posição quando o usuário toca:
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();
}
}
Controle deslizante do período de carência
Os controles deslizantes do período de carência funcionam em atividades em que é útil para o usuário
receber uma notificação, mas a interação do usuário não é necessária. Você pode adicionar isso
animação usando
Slider.GracePeriod
- Usar
Slider.from()
para criarSlider
que usa umView
para exibir o controle deslizante. - Crie um
GracePeriod.Listener
e implementaronGracePeriodEnd()
eonGracePeriodCancel()
para lidar com esses eventos. - Crie um
Slider.GracePeriod
e inicie a animação transmitindo oGracePeriod.Listener
aostartGracePeriod()
. - Substitua as informações
onBackPressed()
para processar o gesto de deslizar para baixo. - Se o usuário deslizar para baixo, chame
cancel()
no(a)Slider.GracePeriod
para dispensar o controle deslizante.
No exemplo a seguir, o botão de rolagem do período de carência é iniciado com um listener que emite um som de sucesso quando o período termina e um som dispensado se o o controle deslizante do período de carência foi cancelado:
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();
}
}
}
Controle deslizante para determinar
Controles deslizantes determinados são usados principalmente para mostrar o progresso, em que é possível calcular quando
até que uma tarefa seja concluída. É possível adicionar essa animação usando
Slider.Determinate
- Usar
Slider.from()
para criarSlider
que usa umView
para exibir o controle deslizante. - Crie o
Slider.Determinate
usandostartScroller()
e defina as posições inicial e máxima. - Quando a animação terminar, chame o método
hide()
na classeSlider.Determinate
para ocultar o controle deslizante.
Veja aqui uma implementação simples que anima o botão de rolagem para uma posição definida quando o o usuário toca em:
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);
}
}
Controle deslizante indeterminado
Controles deslizantes indeterminados podem ser usados para telas de carregamento em que é difícil
a calcular quando a tarefa terminar. Você pode adicionar isso
animação usando
Slider.Indeterminate
- Usar
Slider.from()
para criarSlider
que usa umView
para exibir o controle deslizante. - Inicie a animação com o
método
Slider.startIndeterminate()
. - Quando estiver pronto para parar a animação, chame o método
método
hide()
naSlider.Indeterminate
Veja aqui uma implementação simples que cria o botão de rolagem indeterminado quando o o usuário toca no card e o oculta quando toca novamente:
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);
}
}