1.首先看下运行效果吧
2.再看下代码结构图吧
3.下面给出具体的实现步骤
<1>.首先先给出自定义的ScrollingImageView.java类,此类的主要作用是实现一种滚动的效果
public class ScrollingImageView extends View {
private final int speed;
private final Bitmap bitmap;
private Rect clipBounds = new Rect();
private float offset = 0;
private boolean isStarted;
public ScrollingImageView(Context context, AttributeSet attrs) {
super(context, attrs);
TypedArray ta = context.obtainStyledAttributes(attrs, R.styleable.ParallaxView, 0, 0);
try {
speed = ta.getDimensionPixelSize(R.styleable.ParallaxView_speed, 10);
bitmap = BitmapFactory.decodeResource(getResources(), ta.getResourceId(R.styleable.ParallaxView_src, 0));
} finally {
ta.recycle();
}
start();
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
setMeasuredDimension(MeasureSpec.getSize(widthMeasureSpec), bitmap.getHeight());
}
@Override
public void onDraw(Canvas canvas) {
super.onDraw(canvas);
if (canvas == null) {
return;
}
canvas.getClipBounds(clipBounds);
float layerWidth = bitmap.getWidth();
if (offset < -layerWidth) {
offset += (floor(abs(offset) / layerWidth) * layerWidth);
}
float left = offset;
while (left < clipBounds.width()) {
canvas.drawBitmap(bitmap, getBitmapLeft(layerWidth, left), 0, null);
left += layerWidth;
}
if (isStarted) {
offset -= abs(speed);
postInvalidateOnAnimation();
}
}
private float getBitmapLeft(float layerWidth, float left) {
if (speed < 0) {
return clipBounds.width() - layerWidth - left;
} else {
return left;
}
}
/**
* Start the animation
*/
public void start() {
if (!isStarted) {
isStarted = true;
postInvalidateOnAnimation();
}
}
/**
* Stop the animation
*/
public void stop() {
if (isStarted) {
isStarted = false;
invalidate();
}
}
}
<2>.实现主页面Activity类的实现方法
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
<3>.在贴出主页面的布局activity_main.xml文件
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:scrolling_image_view="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context=".MainActivity">
<TextView
style="@style/Base.TextAppearance.AppCompat.Title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Right to left scrolling background" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp">
<com.zkl.meituanload.ScrollingImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
scrolling_image_view:speed="1dp"
scrolling_image_view:src="@mipmap/scrolling_background" />
<com.zkl.meituanload.ScrollingImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
scrolling_image_view:speed="1.9dp"
scrolling_image_view:src="@mipmap/scrolling_foreground" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|bottom"
android:src="@mipmap/van" />
</FrameLayout>
<TextView
style="@style/Base.TextAppearance.AppCompat.Title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Left to right scrolling background"
android:layout_marginTop="30dp"/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp">
<com.zkl.meituanload.ScrollingImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
scrolling_image_view:speed="-1dp"
scrolling_image_view:src="@mipmap/scrolling_background" />
<com.zkl.meituanload.ScrollingImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
scrolling_image_view:speed="-1.9dp"
scrolling_image_view:src="@mipmap/scrolling_foreground" />
</FrameLayout>
<TextView
style="@style/Base.TextAppearance.AppCompat.Title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Landscape with tiles"
android:layout_marginTop="30dp"/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:src="@mipmap/layer_1"
android:scaleType="fitXY" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:src="@mipmap/layer_2" />
<com.zkl.meituanload.ScrollingImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
scrolling_image_view:speed=".3dp"
scrolling_image_view:src="@mipmap/layer_3" />
<com.zkl.meituanload.ScrollingImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
scrolling_image_view:speed=".6dp"
scrolling_image_view:src="@mipmap/layer_4" />
<com.zkl.meituanload.ScrollingImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
scrolling_image_view:speed=".9dp"
scrolling_image_view:src="@mipmap/layer_5" />
<com.zkl.meituanload.ScrollingImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
scrolling_image_view:speed="1.5dp"
scrolling_image_view:src="@mipmap/layer_6" />
<com.zkl.meituanload.ScrollingImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
scrolling_image_view:speed="1.7dp"
scrolling_image_view:src="@mipmap/layer_7" />
</FrameLayout>
</LinearLayout>
</ScrollView>
以上是车辆动态运行的一个简单的Demo,根据自定义的view,不一定是车辆的运动也可以是其它的运动效果(根据实际场景自己替换)。