您的位置:首页 > 移动开发 > Android开发

android中简单的图片翻页效果

2013-03-23 21:23 411 查看
public class PageWidget extends View {
private Bitmap foreImage;
private Bitmap bgImage;
private PointF touchPt;
private int screenWidth;
private int screenHeight;
private GradientDrawable shadowDrawableRL;
private GradientDrawable shadowDrawableLR;
private ColorMatrixColorFilter mColorMatrixFilter;
private Scroller mScroller;
private int lastTouchX;

public PageWidget(Context context) {
super(context);
// TODO Auto-generated constructor stub
touchPt = new PointF(-1,-1);

//ARGB A(0-透明,255-不透明)
int[] color = { 0xb0333333 ,0x00333333};
shadowDrawableRL = new GradientDrawable(GradientDrawable.Orientation.RIGHT_LEFT, color);
shadowDrawableRL.setGradientType(GradientDrawable.LINEAR_GRADIENT);

shadowDrawableLR = new GradientDrawable(GradientDrawable.Orientation.LEFT_RIGHT, color);
shadowDrawableLR.setGradientType(GradientDrawable.LINEAR_GRADIENT);

float array[] = { 0.55f,    0,    0,     0, 80.0f,
0    ,0.55f,    0,     0, 80.0f,
0    ,    0,0.55f,     0, 80.0f,
0    ,    0,    0,  0.2f, 0};
ColorMatrix cm = new ColorMatrix();
cm.set(array);
/*
* |A*0.55 + 80|
* |R*0.55 + 80|
* |G*0.55 + 80|
* |B*0.2|
*/
//      cm.setSaturation(0);
mColorMatrixFilter = new ColorMatrixColorFilter(cm);

//利用滚动条来实现接触点放开后的动画效果
mScroller = new Scroller(context);
}

@Override
public void computeScroll() {
// TODO Auto-generated method stub
if (mScroller.computeScrollOffset()) {
touchPt.x = mScroller.getCurrX();
touchPt.y = mScroller.getCurrY();

postInvalidate();
}
else{
//            touchPt.x = -1;
//            touchPt.y = -1;
}

super.computeScroll();
}

public void SetScreen(int screenWidth,int screenHeight){
this.screenWidth = screenWidth;
this.screenHeight = screenHeight;
}

public Bitmap getForeImage() {
return foreImage;
}

public void setForeImage(Bitmap foreImage) {
this.foreImage = foreImage;
}

public Bitmap getBgImage() {
return bgImage;
}

public void setBgImage(Bitmap bgImage) {
this.bgImage = bgImage;
}

@Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
drawPageEffect(canvas);
super.onDraw(canvas);
}

/**
* 画前景图片
* @param canvas
*/
private void drawForceImage(Canvas canvas) {
// TODO Auto-generated method stub
Paint mPaint = new Paint();

if (foreImage!=null) {
canvas.drawBitmap(foreImage, 0, 0, mPaint);
}
}

/**
* 画背景图片
* @param canvas
*/
private void drawBgImage(Canvas canvas,Path path) {
// TODO Auto-generated method stub
Paint mPaint = new Paint();

if (bgImage!=null) {
canvas.save();

//只在与路径相交处画图
canvas.clipPath(path,Op.INTERSECT);
canvas.drawBitmap(bgImage, 0, 0, mPaint);
canvas.restore();
}
}

/**
* 画翻页效果
* @param canvas
*/
private void drawPageEffect(Canvas canvas) {
// TODO Auto-generated method stub
drawForceImage(canvas);
Paint mPaint = new Paint();
if (touchPt.x!=-1 && touchPt.y!=-1) {
//翻页左侧书边
canvas.drawLine(touchPt.x, 0, touchPt.x,screenHeight, mPaint);

//左侧书边画阴影
shadowDrawableRL.setBounds((int)touchPt.x - 20, 0 ,(int)touchPt.x, screenHeight);
shadowDrawableRL.draw(canvas);

//翻页对折处
float halfCut = touchPt.x + (screenWidth - touchPt.x)/2;
canvas.drawLine(halfCut, 0, halfCut, screenHeight, mPaint);

//对折处左侧画翻页页图片背面
Rect backArea = new Rect((int)touchPt.x,0,(int)halfCut,screenHeight);
Paint backPaint = new Paint();
backPaint.setColor(0xffdacab0);
canvas.drawRect(backArea, backPaint);

//将翻页图片正面进行处理水平翻转并平移到touchPt.x点
Paint fbPaint = new Paint();
fbPaint.setColorFilter(mColorMatrixFilter);
Matrix matrix = new Matrix();

matrix.preScale(-1,1);
matrix.postTranslate(foreImage.getWidth() + touchPt.x,0);

canvas.save();
canvas.clipRect(backArea);
canvas.drawBitmap(foreImage, matrix, fbPaint);
canvas.restore();

//对折处画左侧阴影
shadowDrawableRL.setBounds((int)halfCut - 50, 0 ,(int)halfCut, screenHeight);
shadowDrawableRL.draw(canvas);

Path bgPath = new Path();

//可以显示背景图的区域
bgPath.addRect(new RectF(halfCut,0,screenWidth,screenHeight), Direction.CW);

//对折出右侧画背景
drawBgImage(canvas,bgPath);

//对折处画右侧阴影
shadowDrawableLR.setBounds((int)halfCut, 0 ,(int)halfCut + 50, screenHeight);
shadowDrawableLR.draw(canvas);
}
}

@Override
public boolean onTouchEvent(MotionEvent event) {
// TODO Auto-generated method stub
if (event.getAction() == MotionEvent.ACTION_DOWN) {
touchPt.x = event.getX();
touchPt.y =    event.getY();
}
else if(event.getAction() == MotionEvent.ACTION_MOVE){
lastTouchX = (int)touchPt.x;
touchPt.x = event.getX();
touchPt.y =    event.getY();

postInvalidate();
}
else if(event.getAction() == MotionEvent.ACTION_UP){
int dx,dy;

dy = 0;

//向右滑动
if (lastTouchX<touchPt.x) {
dx = foreImage.getWidth() - (int)touchPt.x + 30;
}
else{
//向左滑动
dx = -(int)touchPt.x - foreImage.getWidth();
}

mScroller.startScroll((int)touchPt.x,(int)touchPt.y,dx,dy,1000);
postInvalidate();
}

//必须为true,否则无法获取ACTION_MOVE及ACTION_UP事件
return true;
}
}

public class PageActivity extends Activity {
protected void onCreate(android.os.Bundle savedInstanceState) {
requestWindowFeature(Window.FEATURE_NO_TITLE);

PageWidget pageWidget = new PageWidget(this);

Display display = getWindowManager().getDefaultDisplay();
int width  = display.getWidth();
int height = display.getHeight();

pageWidget.SetScreen(width, height);

Bitmap bm1 = BitmapFactory.decodeResource(getResources(), R.drawable.pre7);
Bitmap bm2 = BitmapFactory.decodeResource(getResources(), R.drawable.after7);

Bitmap foreImage = Bitmap.createScaledBitmap(bm1, width, height,false);
Bitmap bgImage = Bitmap.createScaledBitmap(bm2, width, height,false);

pageWidget.setBgImage(bgImage);
pageWidget.setForeImage(foreImage);

setContentView(pageWidget);

super.onCreate(savedInstanceState);
};
}


效果图:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: