我想让图像滑块像 Marquee 图像一样吗?
I want make image slider like Marquee image?
http://www.talk4u.in/TagoreAcadmy/marque.html
这是我的 url,现在是 html 格式,我想要这样的构建图像滑块,但我不想使用 webview。我想使用 android 视图进行开发
并且图像移动应该像地球仪一样从重新开始到结束。
我有多个图像 url 从 mysql 数据库中提取,而不是像选取框一样显示在滑块上。
谢谢你
将 ValueAnimator 和 setTranslationX 与 "two images" 结合使用。
看到这个:
此外,在您的情况下,您需要更改滚动方向。
注意下面的"Modified"。
final ImageView backgroundOne = (ImageView) findViewById(R.id.background_one);
final ImageView backgroundTwo = (ImageView) findViewById(R.id.background_two);
final ValueAnimator animator = ValueAnimator.ofFloat(0.0f, -1.0f); // Modified
animator.setRepeatCount(ValueAnimator.INFINITE);
animator.setInterpolator(new LinearInterpolator());
animator.setDuration(10000L);
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
final float progress = (float) animation.getAnimatedValue();
final float width = backgroundOne.getWidth();
final float translationX = width * progress;
backgroundOne.setTranslationX(translationX);
backgroundTwo.setTranslationX(translationX - width);
}
});
animator.start();
编辑1:
如果你想使用来自服务器的图片,我建议你使用毕加索图片库。
http://square.github.io/picasso/
将 picasso 依赖项添加到 Build.gradle 文件。 (
- 将下面添加到依赖项中
编译 'com.squareup.picasso:picasso:2.5.2'
- 然后按 Android 工作室顶部的同步按钮
使用 picasso 加载图像。
final ImageView backgroundOne = (ImageView) findViewById(R.id.background_one);
final ImageView backgroundTwo = (ImageView) findViewById(R.id.background_two);
Picasso.with(this).load("http://www.talk4u.in/wp-content/uploads/2017/02/cropped-logo2.png").into(backgroundOne);
Picasso.with(this).load("http://www.talk4u.in/wp-content/uploads/2017/02/cropped-logo2.png").into(backgroundTwo);
final ValueAnimator animator = ValueAnimator.ofFloat(0.0f, -1.0f); // Modified
animator.setRepeatCount(ValueAnimator.INFINITE);
animator.setInterpolator(new LinearInterpolator());
animator.setDuration(10000L);
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
final float progress = (float) animation.getAnimatedValue();
final float width = backgroundOne.getWidth();
final float translationX = width * progress;
backgroundOne.setTranslationX(translationX);
backgroundTwo.setTranslationX(translationX - width);
}
});
animator.start();
- 添加网络权限以访问互联网。
http://www.talk4u.in/TagoreAcadmy/marque.html
这是我的 url,现在是 html 格式,我想要这样的构建图像滑块,但我不想使用 webview。我想使用 android 视图进行开发 并且图像移动应该像地球仪一样从重新开始到结束。
我有多个图像 url 从 mysql 数据库中提取,而不是像选取框一样显示在滑块上。
谢谢你
将 ValueAnimator 和 setTranslationX 与 "two images" 结合使用。
看到这个:
此外,在您的情况下,您需要更改滚动方向。 注意下面的"Modified"。
final ImageView backgroundOne = (ImageView) findViewById(R.id.background_one);
final ImageView backgroundTwo = (ImageView) findViewById(R.id.background_two);
final ValueAnimator animator = ValueAnimator.ofFloat(0.0f, -1.0f); // Modified
animator.setRepeatCount(ValueAnimator.INFINITE);
animator.setInterpolator(new LinearInterpolator());
animator.setDuration(10000L);
animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public void onAnimationUpdate(ValueAnimator animation) {
final float progress = (float) animation.getAnimatedValue();
final float width = backgroundOne.getWidth();
final float translationX = width * progress;
backgroundOne.setTranslationX(translationX);
backgroundTwo.setTranslationX(translationX - width);
}
});
animator.start();
编辑1:
如果你想使用来自服务器的图片,我建议你使用毕加索图片库。 http://square.github.io/picasso/
将 picasso 依赖项添加到 Build.gradle 文件。 (
- 将下面添加到依赖项中
编译 'com.squareup.picasso:picasso:2.5.2' - 然后按 Android 工作室顶部的同步按钮
- 将下面添加到依赖项中
使用 picasso 加载图像。
final ImageView backgroundOne = (ImageView) findViewById(R.id.background_one); final ImageView backgroundTwo = (ImageView) findViewById(R.id.background_two); Picasso.with(this).load("http://www.talk4u.in/wp-content/uploads/2017/02/cropped-logo2.png").into(backgroundOne); Picasso.with(this).load("http://www.talk4u.in/wp-content/uploads/2017/02/cropped-logo2.png").into(backgroundTwo); final ValueAnimator animator = ValueAnimator.ofFloat(0.0f, -1.0f); // Modified animator.setRepeatCount(ValueAnimator.INFINITE); animator.setInterpolator(new LinearInterpolator()); animator.setDuration(10000L); animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() { @Override public void onAnimationUpdate(ValueAnimator animation) { final float progress = (float) animation.getAnimatedValue(); final float width = backgroundOne.getWidth(); final float translationX = width * progress; backgroundOne.setTranslationX(translationX); backgroundTwo.setTranslationX(translationX - width); } }); animator.start();
- 添加网络权限以访问互联网。