編輯：關於Android編程
最近做一個項目類似於QQ空間，做到照片浏覽的功能，對於QQ空間中點擊圖片放大至全屏，感覺效果很贊，於是也做了個類似的效果。如下。
vc28xqzP6sfp0rPD5qOs06a4w8rHtNPSu7j2QWN0aXZpdHnM+Neqtb3B7c3i0ru49kFjdGl2aXR5o6zTprjDzbzGrM/qx+nSs8Pm0rLT0LrctuCy2df3o6zTw1ZpZXe78tXfRGlhbG9nsrvKx7rcusOho8v50tTP1tTaxNG1477NysejrMjnus7KubXDx7DSu7j2vefD5rXESW1hZ2VWaWV31NrB7c3i0ru49r3nw+bX9sv1t8XH0Ljutq+7raGjPC9wPgo8cD7Su7Djy/XC1L3nw+a1xEltYWdlVmlld7XEysfI58nPzbzL+cq+tcTV/be90M61xKOssqLH0srHQ0VOVEVSX0NST1DL9bfFyvTQ1LXEoaNDRU5URVJfQ1JPUMr00NS74bW81sJJbWFnZVZpZXfW0M/Uyr61xEJpdG1hcNPQsbvH0LjutO+1vczus+S1xNCnufuhozwvcD4KPHA+tvjP6sfp0rPD5rXESW1hZ2VWaWV30ruw47a8ysdGSVRfQ0VOVEVStcTL9bfFyvTQ1KGjy/nS1NKqsaPWpNXiuPbM+Neqtq+7rbXEwfezqaOs0qrX9sjnz8K1xLHku6+jujwvcD4KPHA+MaGiQml0bWFwtcTL9bfFo6zS8s6qy/XC1M28us3P6sfpzby1xMv1t8WxyMD9v8+2qLK70rvR+TwvcD4KPHA+MqGiQml0bWFwzrvWw7XExr3SxqOs0vLOqsv1wtTNvLXEzrvWw8rHsrvIt7aotcSjrM7Sw8fSqsq5y/vGvdLGtb3W0LzkPC9wPgo8cD4zoaJCaXRtYXC1xMfQuO6jrNLyzqpDRU5URVJfQ1JPUMrHx9C47rn9tcOjrLb4RklUX0NFTlRFUsrHw7vT0MfQuO61xKOsxMfDtMG9t/nNvM/Uyr61xMTayN3H+NPyyseyu82stcSjrMv50tTSstKqz9TKvsf40/K1xMa9u6yx5Lu7oaM8L3A+CjxwPjxicj4KPC9wPgo8cD7Sqs3qs8nJz8PmtcTQp7n7o6zI57n7taW1pcrH1ri21EltYWdlVmlld9f20ru49ravu62x5Lu7o6zO0r71tcPKx83qs8myu8HL1eK49tKqx/O1xKGjy/nS1NfUvLrW2NC0wctJbWFnZVZpZXfAtM3qs8nJz8r2tcSx5Lu7oaM8L3A+CjxwPtaxvdPM+cnP1vfSqrXESW1hZ2VWaWV3PC9wPgo8cD48cHJlIGNsYXNzPQ=="brush:java;">package com.roamer.ui.view;
import android.animation.Animator;
import android.animation.PropertyValuesHolder;
import android.animation.ValueAnimator;
import android.app.Activity;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Paint.Style;
import android.graphics.drawable.BitmapDrawable;
import android.util.AttributeSet;
import android.util.Log;
import android.view.animation.AccelerateDecelerateInterpolator;
import android.widget.ImageView;
/**
* 2d平滑變化的顯示圖片的ImageView
* 僅限於用於:從一個ScaleType==CENTER_CROP的ImageView，切換到另一個ScaleType=
* FIT_CENTER的ImageView，或者反之 (當然，得使用同樣的圖片最好)
*
* @author Dean Tao
*
*/
public class SmoothImageView extends ImageView {
private static final int STATE_NORMAL = 0;
private static final int STATE_TRANSFORM_IN = 1;
private static final int STATE_TRANSFORM_OUT = 2;
private int mOriginalWidth;
private int mOriginalHeight;
private int mOriginalLocationX;
private int mOriginalLocationY;
private int mState = STATE_NORMAL;
private Matrix mSmoothMatrix;
private Bitmap mBitmap;
private boolean mTransformStart = false;
private Transfrom mTransfrom;
private final int mBgColor = 0xFF000000;
private int mBgAlpha = 0;
private Paint mPaint;
public SmoothImageView(Context context) {
super(context);
init();
}
public SmoothImageView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public SmoothImageView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
private void init() {
mSmoothMatrix = new Matrix();
mPaint=new Paint();
mPaint.setColor(mBgColor);
mPaint.setStyle(Style.FILL);
// setBackgroundColor(mBgColor);
}
public void setOriginalInfo(int width, int height, int locationX, int locationY) {
mOriginalWidth = width;
mOriginalHeight = height;
mOriginalLocationX = locationX;
mOriginalLocationY = locationY;
// 因為是屏幕坐標，所以要轉換為該視圖內的坐標，因為我所用的該視圖是MATCH_PARENT，所以不用定位該視圖的位置,如果不是的話，還需要定位視圖的位置，然後計算mOriginalLocationX和mOriginalLocationY
mOriginalLocationY = mOriginalLocationY - getStatusBarHeight(getContext());
}
/**
* 獲取狀態欄高度
*
* @return
*/
public static int getStatusBarHeight(Context context) {
Class c = null;
Object obj = null;
java.lang.reflect.Field field = null;
int x = 0;
int statusBarHeight = 0;
try {
c = Class.forName("com.android.internal.R$dimen");
obj = c.newInstance();
field = c.getField("status_bar_height");
x = Integer.parseInt(field.get(obj).toString());
statusBarHeight = context.getResources().getDimensionPixelSize(x);
return statusBarHeight;
} catch (Exception e) {
e.printStackTrace();
}
return statusBarHeight;
}
/**
* 用於開始進入的方法。 調用此方前，需已經調用過setOriginalInfo
*/
public void transformIn() {
mState = STATE_TRANSFORM_IN;
mTransformStart = true;
invalidate();
}
/**
* 用於開始退出的方法。 調用此方前，需已經調用過setOriginalInfo
*/
public void transformOut() {
mState = STATE_TRANSFORM_OUT;
mTransformStart = true;
invalidate();
}
private class Transfrom {
float startScale;// 圖片開始的縮放值
float endScale;// 圖片結束的縮放值
float scale;// 屬性ValueAnimator計算出來的值
LocationSizeF startRect;// 開始的區域
LocationSizeF endRect;// 結束的區域
LocationSizeF rect;// 屬性ValueAnimator計算出來的值
void initStartIn() {
scale = startScale;
try {
rect = (LocationSizeF) startRect.clone();
} catch (CloneNotSupportedException e) {
e.printStackTrace();
}
}
void initStartOut() {
scale = endScale;
try {
rect = (LocationSizeF) endRect.clone();
} catch (CloneNotSupportedException e) {
e.printStackTrace();
}
}
}
/**
* 初始化進入的變量信息
*/
private void initTransform() {
if (getDrawable() == null) {
return;
}
if (mBitmap == null || mBitmap.isRecycled()) {
mBitmap = ((BitmapDrawable) getDrawable()).getBitmap();
}
//防止mTransfrom重復的做同樣的初始化
if (mTransfrom != null) {
return;
}
if (getWidth() == 0 || getHeight() == 0) {
return;
}
mTransfrom = new Transfrom();
/** 下面為縮放的計算 */
/* 計算初始的縮放值，初始值因為是CENTR_CROP效果，所以要保證圖片的寬和高至少1個能匹配原始的寬和高，另1個大於 */
float xSScale = mOriginalWidth / ((float) mBitmap.getWidth());
float ySScale = mOriginalHeight / ((float) mBitmap.getHeight());
float startScale = xSScale > ySScale ? xSScale : ySScale;
mTransfrom.startScale = startScale;
/* 計算結束時候的縮放值，結束值因為要達到FIT_CENTER效果，所以要保證圖片的寬和高至少1個能匹配原始的寬和高，另1個小於 */
float xEScale = getWidth() / ((float) mBitmap.getWidth());
float yEScale = getHeight() / ((float) mBitmap.getHeight());
float endScale = xEScale < yEScale ? xEScale : yEScale;
mTransfrom.endScale = endScale;
/**
* 下面計算Canvas Clip的范圍，也就是圖片的顯示的范圍，因為圖片是慢慢變大，並且是等比例的，所以這個效果還需要裁減圖片顯示的區域
* ，而顯示區域的變化范圍是在原始CENTER_CROP效果的范圍區域
* ，到最終的FIT_CENTER的范圍之間的，區域我用LocationSizeF更好計算
* ，他就包括左上頂點坐標，和寬高，最後轉為Canvas裁減的Rect.
*/
/* 開始區域 */
mTransfrom.startRect = new LocationSizeF();
mTransfrom.startRect.left = mOriginalLocationX;
mTransfrom.startRect.top = mOriginalLocationY;
mTransfrom.startRect.width = mOriginalWidth;
mTransfrom.startRect.height = mOriginalHeight;
/* 結束區域 */
mTransfrom.endRect = new LocationSizeF();
float bitmapEndWidth = mBitmap.getWidth() * mTransfrom.endScale;// 圖片最終的寬度
float bitmapEndHeight = mBitmap.getHeight() * mTransfrom.endScale;// 圖片最終的寬度
mTransfrom.endRect.left = (getWidth() - bitmapEndWidth) / 2;
mTransfrom.endRect.top = (getHeight() - bitmapEndHeight) / 2;
mTransfrom.endRect.width = bitmapEndWidth;
mTransfrom.endRect.height = bitmapEndHeight;
mTransfrom.rect = new LocationSizeF();
}
private class LocationSizeF implements Cloneable{
float left;
float top;
float width;
float height;
@Override
public String toString() {
return "[left:"+left+" top:"+top+" width:"+width+" height:"+height+"]";
}
@Override
public Object clone() throws CloneNotSupportedException {
// TODO Auto-generated method stub
return super.clone();
}
}
/* 下面實現了CENTER_CROP的功能 的Matrix，在優化的過程中，已經不用了 */
private void getCenterCropMatrix() {
if (getDrawable() == null) {
return;
}
if (mBitmap == null || mBitmap.isRecycled()) {
mBitmap = ((BitmapDrawable) getDrawable()).getBitmap();
}
/* 下面實現了CENTER_CROP的功能 */
float xScale = mOriginalWidth / ((float) mBitmap.getWidth());
float yScale = mOriginalHeight / ((float) mBitmap.getHeight());
float scale = xScale > yScale ? xScale : yScale;
mSmoothMatrix.reset();
mSmoothMatrix.setScale(scale, scale);
mSmoothMatrix.postTranslate(-(scale * mBitmap.getWidth() / 2 - mOriginalWidth / 2), -(scale * mBitmap.getHeight() / 2 - mOriginalHeight / 2));
}
private void getBmpMatrix() {
if (getDrawable() == null) {
return;
}
if (mTransfrom == null) {
return;
}
if (mBitmap == null || mBitmap.isRecycled()) {
mBitmap = ((BitmapDrawable) getDrawable()).getBitmap();
}
/* 下面實現了CENTER_CROP的功能 */
mSmoothMatrix.setScale(mTransfrom.scale, mTransfrom.scale);
mSmoothMatrix.postTranslate(-(mTransfrom.scale * mBitmap.getWidth() / 2 - mTransfrom.rect.width / 2),
-(mTransfrom.scale * mBitmap.getHeight() / 2 - mTransfrom.rect.height / 2));
}
@Override
protected void onDraw(Canvas canvas) {
if (getDrawable() == null) {
return; // couldn't resolve the URI
}
if (mState == STATE_TRANSFORM_IN || mState == STATE_TRANSFORM_OUT) {
if (mTransformStart) {
initTransform();
}
if (mTransfrom == null) {
super.onDraw(canvas);
return;
}
if (mTransformStart) {
if (mState == STATE_TRANSFORM_IN) {
mTransfrom.initStartIn();
} else {
mTransfrom.initStartOut();
}
}
if(mTransformStart){
Log.d("Dean", "mTransfrom.startScale:"+mTransfrom.startScale);
Log.d("Dean", "mTransfrom.startScale:"+mTransfrom.endScale);
Log.d("Dean", "mTransfrom.scale:"+mTransfrom.scale);
Log.d("Dean", "mTransfrom.startRect:"+mTransfrom.startRect.toString());
Log.d("Dean", "mTransfrom.endRect:"+mTransfrom.endRect.toString());
Log.d("Dean", "mTransfrom.rect:"+mTransfrom.rect.toString());
}
mPaint.setAlpha(mBgAlpha);
canvas.drawPaint(mPaint);
int saveCount = canvas.getSaveCount();
canvas.save();
// 先得到圖片在此刻的圖像Matrix矩陣
getBmpMatrix();
canvas.translate(mTransfrom.rect.left, mTransfrom.rect.top);
canvas.clipRect(0, 0, mTransfrom.rect.width, mTransfrom.rect.height);
canvas.concat(mSmoothMatrix);
getDrawable().draw(canvas);
canvas.restoreToCount(saveCount);
if (mTransformStart) {
mTransformStart=false;
startTransform(mState);
}
} else {
//當Transform In變化完成後，把背景改為黑色，使得Activity不透明
mPaint.setAlpha(255);
canvas.drawPaint(mPaint);
super.onDraw(canvas);
}
}
private void startTransform(final int state) {
if (mTransfrom == null) {
return;
}
ValueAnimator valueAnimator = new ValueAnimator();
valueAnimator.setDuration(300);
valueAnimator.setInterpolator(new AccelerateDecelerateInterpolator());
if (state == STATE_TRANSFORM_IN) {
PropertyValuesHolder scaleHolder = PropertyValuesHolder.ofFloat("scale", mTransfrom.startScale, mTransfrom.endScale);
PropertyValuesHolder leftHolder = PropertyValuesHolder.ofFloat("left", mTransfrom.startRect.left, mTransfrom.endRect.left);
PropertyValuesHolder topHolder = PropertyValuesHolder.ofFloat("top", mTransfrom.startRect.top, mTransfrom.endRect.top);
PropertyValuesHolder widthHolder = PropertyValuesHolder.ofFloat("width", mTransfrom.startRect.width, mTransfrom.endRect.width);
PropertyValuesHolder heightHolder = PropertyValuesHolder.ofFloat("height", mTransfrom.startRect.height, mTransfrom.endRect.height);
PropertyValuesHolder alphaHolder = PropertyValuesHolder.ofInt("alpha", 0, 255);
valueAnimator.setValues(scaleHolder, leftHolder, topHolder, widthHolder, heightHolder, alphaHolder);
} else {
PropertyValuesHolder scaleHolder = PropertyValuesHolder.ofFloat("scale", mTransfrom.endScale, mTransfrom.startScale);
PropertyValuesHolder leftHolder = PropertyValuesHolder.ofFloat("left", mTransfrom.endRect.left, mTransfrom.startRect.left);
PropertyValuesHolder topHolder = PropertyValuesHolder.ofFloat("top", mTransfrom.endRect.top, mTransfrom.startRect.top);
PropertyValuesHolder widthHolder = PropertyValuesHolder.ofFloat("width", mTransfrom.endRect.width, mTransfrom.startRect.width);
PropertyValuesHolder heightHolder = PropertyValuesHolder.ofFloat("height", mTransfrom.endRect.height, mTransfrom.startRect.height);
PropertyValuesHolder alphaHolder = PropertyValuesHolder.ofInt("alpha", 255, 0);
valueAnimator.setValues(scaleHolder, leftHolder, topHolder, widthHolder, heightHolder, alphaHolder);
}
valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
@Override
public synchronized void onAnimationUpdate(ValueAnimator animation) {
mTransfrom.scale = (Float) animation.getAnimatedValue("scale");
mTransfrom.rect.left = (Float) animation.getAnimatedValue("left");
mTransfrom.rect.top = (Float) animation.getAnimatedValue("top");
mTransfrom.rect.width = (Float) animation.getAnimatedValue("width");
mTransfrom.rect.height = (Float) animation.getAnimatedValue("height");
mBgAlpha = (Integer) animation.getAnimatedValue("alpha");
invalidate();
((Activity)getContext()).getWindow().getDecorView().invalidate();
}
});
valueAnimator.addListener(new ValueAnimator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {
}
@Override
public void onAnimationRepeat(Animator animation) {
}
@Override
public void onAnimationEnd(Animator animation) {
/*
* 如果是進入的話，當然是希望最後停留在center_crop的區域。但是如果是out的話，就不應該是center_crop的位置了
* ， 而應該是最後變化的位置，因為當out的時候結束時，不回復視圖是Normal，要不然會有一個突然閃動回去的bug
*/
// TODO 這個可以根據實際需求來修改
if (state == STATE_TRANSFORM_IN) {
mState = STATE_NORMAL;
}
if (mTransformListener != null) {
mTransformListener.onTransformComplete(state);
}
}
@Override
public void onAnimationCancel(Animator animation) {
}
});
valueAnimator.start();
}
public void setOnTransformListener(TransformListener listener) {
mTransformListener = listener;
}
private TransformListener mTransformListener;
public static interface TransformListener {
/**
*
* @param mode
* STATE_TRANSFORM_IN 1 ,STATE_TRANSFORM_OUT 2
*/
void onTransformComplete(int mode);// mode 1
}
}
使用的時候，從前一個Activity傳遞到詳情Activity下面幾個主要的信息：
Intent intent = new Intent(MainActivity.this, SpaceImageDetailActivity.class);
intent.putExtra("images", (ArrayList) datas);//非必須
intent.putExtra("position", position);
int[] location = new int[2];
imageView.getLocationOnScreen(location);
intent.putExtra("locationX", location[0]);//必須
intent.putExtra("locationY", location[1]);//必須
intent.putExtra("width", imageView.getWidth());//必須
intent.putExtra("height", imageView.getHeight());//必須
startActivity(intent);
overridePendingTransition(0, 0); 在詳情Activity接受到這些參數，並對SmoothImageView初始化位置信息，然後就可以進行變化了。
mDatas = (ArrayList) getIntent().getSerializableExtra("images"); mPosition = getIntent().getIntExtra("position", 0); mLocationX = getIntent().getIntExtra("locationX", 0); mLocationY = getIntent().getIntExtra("locationY", 0); mWidth = getIntent().getIntExtra("width", 0); mHeight = getIntent().getIntExtra("height", 0); imageView = new SmoothImageView(this); imageView.setOriginalInfo(mWidth, mHeight, mLocationX, mLocationY); imageView.transformIn(); imageView.setLayoutParams(new ViewGroup.LayoutParams(-1, -1)); imageView.setScaleType(ScaleType.FIT_CENTER); setContentView(imageView); ImageLoader.getInstance().displayImage(mDatas.get(mPosition), imageView);
上面的就已經完成了圖片的縮放效果，但是還需要設置下Activity透明的風格，才能使得alpha效果體驗出來，用戶體驗更好。
對Activity設置如下風格，另外說明，在SmoothImageView中沒有定位視圖的位置，只是做了對狀態欄的處理，所以要設置Activity 為NotitleBar，具體style如下：
Android開發之MOB短信驗證SDK的使用（二）
我已經介紹了如何快速集成MOB短信驗證SDK，那今天我們講什麼呢？我們今天講一下如何不使用SDK中的GUI界面。對！我們今天來學習怎麼自定義GUI，說的直白點就是自定義界
Android開發技巧——使用PopupWindow實現彈出菜單
在本文當中，我將會與大家分享一個封裝了PopupWindow實現彈出菜單的類，並說明它的實現與使用。 因對界面的需求，android原生的彈出菜單已不能滿足我們的需求，自
Android下如何使用百度地圖sdk
可以使用該套 SDK開發適用於Android系統移動設備的地圖應用，通過調用地圖SDK接口，您可以輕松訪問百度地圖服務和數據，構建功能豐富、交互性強的LBS（地圖類）應用
Android UI設計系列之自定義TextView屬性實現帶下劃線的文本框（4）
在Android開發過程中，如果Android系統自帶的屬性不能滿足我們日常開發的需求，那麼就需要我們給系統控件添加額外的屬性了。假如有個需求是實現帶下劃線的文本顯示（下
