Bạn có thể sử dụng thanh trượt để hiển thị thanh đang tải, tiến trình hoặc điều hướng trên cuối màn hình. Thanh trượt là thành phần trải nghiệm người dùng toàn cục và cần được xử lý khi triển khai chúng trong Đồ thuỷ tinh của bạn.
Thanh trượt cuộn
Thanh trượt cuộn dùng để cho biết vị trí của thẻ khi bạn vuốt
thông qua nhiều thẻ. Bạn có thể tạo cùng loại hiệu ứng bằng cách sử dụng
Slider.Scroller
.
- Sử dụng
Slider.from()
để tạo mộtSlider
sử dụngView
để hiện thanh trượt. - Tạo
Slider.Scroller
đang sử dụngstartScroller()
và đặt vị trí tối đa và vị trí ban đầu.
Dưới đây là cách triển khai đơn giản sẽ tạo hiệu ứng ảnh động cho trình cuộn đến vị trí tiếp theo khi người dùng nhấn vào:
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();
}
}
Thanh trượt thời gian gia hạn
Thanh trượt thời gian ân hạn hoạt động trong các hoạt động hữu ích cho người dùng
thấy thông báo nhưng không cần có sự tương tác của người dùng. Bạn có thể thêm đoạn mã này
hoạt ảnh bằng cách sử dụng
Slider.GracePeriod
.
- Sử dụng
Slider.from()
để tạo mộtSlider
sử dụngView
để hiện thanh trượt. - Tạo một
GracePeriod.Listener
và triển khaionGracePeriodEnd()
vàonGracePeriodCancel()
xử lý các sự kiện đó. - Tạo một
Slider.GracePeriod
và bắt đầu ảnh động bằng cách truyền vàoGracePeriod.Listener
vàostartGracePeriod()
. - Ghi đè thuộc tính của hoạt động
onBackPressed()
để xử lý cử chỉ vuốt xuống. - Nếu người dùng vuốt xuống, hãy gọi
cancel()
trênSlider.GracePeriod
để đóng thanh trượt.
Trong ví dụ sau, trình cuộn thời gian gia hạn được kích hoạt với một trình nghe phát ra âm thanh thành công khi khoảng thời gian kết thúc và âm thanh bị bỏ qua nếu Thanh trượt thời gian ân hạn đã bị huỷ:
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();
}
}
}
Xác định thanh trượt
Thanh trượt xác định chủ yếu được dùng để hiển thị tiến trình mà bạn có thể tính toán thời điểm
một tác vụ kết thúc. Bạn có thể thêm ảnh động này bằng cách sử dụng
Slider.Determinate
.
- Sử dụng
Slider.from()
để tạo mộtSlider
sử dụngView
để hiện thanh trượt. - Tạo
Slider.Determinate
đang sử dụngstartScroller()
và đặt vị trí tối đa và vị trí ban đầu. - Khi ảnh động kết thúc, hãy gọi
hide()
trênSlider.Determinate
để ẩn thanh trượt.
Dưới đây là cách triển khai đơn giản sẽ tạo hiệu ứng ảnh động cho trình cuộn đến một vị trí đã đặt khi người dùng nhấn:
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);
}
}
Thanh trượt không xác định
Có thể dùng thanh trượt không xác định để tải màn hình khi gặp khó khăn
để tính toán thời điểm kết thúc tác vụ. Bạn có thể thêm đoạn mã này
hoạt ảnh bằng cách sử dụng
Slider.Indeterminate
.
- Sử dụng
Slider.from()
để tạo mộtSlider
sử dụngView
để hiện thanh trượt. - Bắt đầu ảnh động bằng
Phương thức
Slider.startIndeterminate()
. - Khi bạn đã sẵn sàng dừng ảnh động, hãy gọi phương thức
Phương thức
hide()
trênSlider.Indeterminate
.
Dưới đây là cách triển khai đơn giản để tạo trình cuộn không xác định khi người dùng nhấn vào thẻ và ẩn thẻ khi người dùng nhấn lại:
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);
}
}