WindowImageView.gif
前幾天看到知乎里的雙11廣告有這么一個效果，就決定仿一個出來。
項目地址在 https://github.com/Bleoo/WindowImageView，覺得不錯就給個star吧~
該庫已上傳至 jitpack，可直接引用。
圖片已處理，避免OOM，并且支持Fresco，加載網絡圖片。
以下是效果實現的核心思路，具體實現請到項目中看。
Draw
思路是先將canvas坐標系垂直偏移出View，即偏移量為負數，然后在將drawable繪制在(0,0)點處，這時候的(0,0)點已經在View可視范圍之外了。
public void draw(Canvas canvas) {
...
// canvas的坐標系先偏移到view之外的某個點，disPlayTop垂直偏移量
canvas.translate(0, disPlayTop);
// 再將drawable繪制出來，rescaleHeight圖片處理后的高度
drawable.setBounds(0, 0, getWidth(), rescaleHeight);
drawable.draw(canvas);
...
}
disPlayTop 垂直偏移量
這個得結合 View的當前位置 及 translationMultiple偏移倍數 來計算。
// 當圖片處理完成后的回調
public void onProcessFinished(int width, int height) {
rescaleHeight = height;
// 計算出RecyclerView高度與圖片高度不一致時的偏移倍數translationMultiple
resetTransMultiple(height);
// 獲取View所在坐標
getLocationInWindow(location);
// 當圖片處理完成，計算垂直偏移量，rvLocationRecyclerView所在坐標
disPlayTop = -(location[1] - rvLocation[1]) * translationMultiple;
...
}
translationMultiple 偏移倍數
通過 圖片高度 及 RecyclerView的高度 來計算偏移倍數。
private void resetTransMultiple(int scaledHeight) {
...
// 計算最小垂直偏移量
mMimDisPlayTop = -scaledHeight + getHeight();
// 計算垂直偏移倍數，rvHeight為RecyclerView的高度
translationMultiple = 1.0f * -mMimDisPlayTop / (rvHeight - getHeight());
...
}
onScrolled 滑動
通過 RecyclerView的滑動回調 及 translationMultiple偏移倍數 來計算 disPlayTop垂直偏移量，然后主動重繪。
@Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
super.onScrolled(recyclerView, dx, dy);
...
disPlayTop += dy * translationMultiple;
invalidate();
...
}
項目地址 https://github.com/Bleoo/WindowImageView，覺得不錯就給個star吧~
