Android 运动的小车

来源:互联网 发布:java框架有必要学吗 编辑:程序博客网 时间:2024/04/30 04:57

先看看第一种效果
这里写图片描述

第一种效果是背景动,小车不动,看上去是小车在动!
这里需要三张背景图这里写图片描述

这里写图片描述

然后来看看怎么实现
先自定义一个view来使背景移动
附上代码

public class ScrollingView extends View {    private float mSpeed;    private Bitmap mBitmap;    private Paint mPaint;    private float mOffset = 0;    public ScrollingView(Context context) {        super(context);    }    public ScrollingView(Context context, AttributeSet attrs) {        super(context, attrs);        //读取自定义的背景和速度        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.ScrollingView);        mSpeed = typedArray.getFloat(R.styleable.ScrollingView_speed, 1.0f);        int resourceId = typedArray.getResourceId(R.styleable.ScrollingView_scrollingBackground, 0);        //设置位图        mBitmap = BitmapFactory.decodeResource(getResources(), resourceId);        //回收typedArray        typedArray.recycle();        mPaint = new Paint();    }    //确定控件大小    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        //已经知道了mode,直接拿大小        int width = MeasureSpec.getSize(widthMeasureSpec);        setMeasuredDimension(width, mBitmap.getHeight());    }    //画出来    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        if(mOffset<-mBitmap.getWidth()) {            mOffset=0;        }        int left = (int) mOffset;        while (left < getMeasuredWidth()) {            canvas.drawBitmap(mBitmap, left, 0, mPaint);            left = left + getMeasuredWidth();        }        mOffset = mOffset - mSpeed;        //调用ondraw        invalidate();    }}

布局

  <FrameLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content">        <!--背景-->        <com.sihaiwanlian.cmccnev.widget.ScrollingView            android:id="@+id/scrollingView_bg"            android:layout_width="match_parent"            android:layout_height="wrap_content"            yoyo:scrollingBackground="@mipmap/scrolling_background"            yoyo:speed="3.0" />        <!--前景-->        <com.sihaiwanlian.cmccnev.widget.ScrollingView            android:id="@+id/scrollingView_fore"            android:layout_width="match_parent"            android:layout_height="wrap_content"            yoyo:scrollingBackground="@mipmap/scrolling_foreground"            yoyo:speed="4.8" />        <ImageView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_gravity="center_horizontal"            android:src="@mipmap/scrolling_car" />    </FrameLayout>

搞定!

再来看看第二种效果
这里写图片描述

当然图片还是一样

代码就不一样了

public class ScrollingView extends View {    private float mSpeed;    private Bitmap mBitmap;    private Paint mPaint;    private float mOffset = 0;    public ScrollingView(Context context) {        super(context);    }    public ScrollingView(Context context, AttributeSet attrs) {        super(context, attrs);        //读取自定义的背景和速度        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.ScrollingView);        mSpeed = typedArray.getFloat(R.styleable.ScrollingView_speed, 1.0f);        int resourceId = typedArray.getResourceId(R.styleable.ScrollingView_scrollingBackground, 0);        //设置位图        mBitmap = BitmapFactory.decodeResource(getResources(), resourceId);        //回收typedArray        typedArray.recycle();        mPaint = new Paint();    }    //确定控件大小    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        super.onMeasure(widthMeasureSpec, heightMeasureSpec);        //已经知道了mode,直接拿大小        int width = MeasureSpec.getSize(widthMeasureSpec);        setMeasuredDimension(width, mBitmap.getHeight());    }    //画出来    @Override    protected void onDraw(Canvas canvas) {        super.onDraw(canvas);        if (mOffset > getMeasuredWidth()) {            mOffset = 0;        }        int left = (int) mOffset;        canvas.drawBitmap(mBitmap, left, 0, mPaint);        mOffset = mOffset + mSpeed;        invalidate();    }}

布局

   <FrameLayout        android:layout_width="wrap_content"        android:layout_height="wrap_content">        <ImageView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_gravity="center_horizontal"            android:src="@mipmap/scrolling_foreground" />        <ImageView            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_gravity="center_horizontal"            android:src="@mipmap/scrolling_background" />        <com.sihaiwanlian.cmccnev.widget.ScrollingView            android:id="@+id/scrollingView_fore"            android:layout_width="match_parent"            android:layout_height="wrap_content"            yoyo:scrollingBackground="@mipmap/scrolling_car"            yoyo:speed="4.8" />    </FrameLayout>

ok,搞定!