微信公众号
APKdemo_https://github.com/AnJiaoDe/Scale-Master/blob/master/app/build/outputs/apk/app-debug.apk
一直好奇酷狗的皮肤预览是怎么实现的。 难道是另外写了一个一模一样的布局文件,只是宽高不一样? 感觉贼吉尔神奇啊!
想想还是觉得不可能是一个个控件写上去的,一定有某种极其神奇却简单的方法。 方法就是 Android Canvas的scale,画布缩放
/**
* Preconcat the current matrix with the specified scale.
*
* @param sx The amount to scale in X
* @param sy The amount to scale in Y
*/
public void scale(float sx, float sy) {
native_scale(mNativeCanvasWrapper, sx, sy);
}
/**
* Preconcat the current matrix with the specified scale.
*
* @param sx The amount to scale in X
* @param sy The amount to scale in Y
* @param px The x-coord for the pivot point (unchanged by the scale)
* @param py The y-coord for the pivot point (unchanged by the scale)
*/
public final void scale(float sx, float sy, float px, float py) {
translate(px, py);
scale(sx, sy);
translate(-px, -py);
}
//x缩放比例,y缩放比例,px,py,缩放中心点,可以设置左顶点或者中心等顶点 canvas.scale(scale, scale, px, py);
1.先测量期望缩放至的宽高,然后将宽高设置为被缩放View的宽高
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
setMeasuredDimension(getDefaultSize(0, widthMeasureSpec), getDefaultSize(0, heightMeasureSpec));
width_self=getMeasuredWidth();
height_self=getMeasuredHeight();
super.onMeasure(MeasureSpec.makeMeasureSpec(
width_bigview, MeasureSpec.EXACTLY), MeasureSpec.makeMeasureSpec(height_bigview, MeasureSpec.EXACTLY));
}
2.计算scale缩放比例,如果以宽为基准缩放,那就是期望缩放至的宽度/被缩放View的宽度;如果以高为基准缩放,同理
@Override
protected void dispatchDraw(Canvas canvas) {
if (basedOnWidthOrHeight) {
scale = (width_self - getPaddingTop() - getPaddingBottom()) * 1f / width_bigview;
} else {
scale = (height_self - getPaddingTop() - getPaddingBottom()) * 1f / height_bigview;
}
PaintFlagsDrawFilter pfd= new PaintFlagsDrawFilter(0, Paint.ANTI_ALIAS_FLAG|Paint.FILTER_BITMAP_FLAG);
/**
* 对canvas设置抗锯齿的滤镜,防止变化canvas引起画质降低
*/
canvas.setDrawFilter(pfd);
canvas.save();
//x缩放比例,y缩放比例,px,py,缩放中心点,可以设置左顶点或者中心等顶点
canvas.scale(scale, scale, px, py);
super.dispatchDraw(canvas);
canvas.restore();
}
在这里插入代码片
上图:模拟器截图有点模糊,真实手机是没毛病的
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:id="@+id/iv"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:scaleType="centerInside"
android:src="@drawable/pic" />
<Button
android:id="@+id/btn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="缩放布局" />
</LinearLayout>
public class MainActivity extends BaseActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
findViewById(R.id.btn).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
startAppcompatActivity(ScaleViewActivity.class);
}
});
}
@Override
public void onClick(View v) {
}
}
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_scale_view"
android:layout_width="match_parent"
android:layout_height="match_parent">
</RelativeLayout>
public class ScaleViewActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_scale_view);
View layout = LayoutInflater.from(this).inflate(R.layout.activity_main, null);
ScaleFrameLayout scaleFrameLayout = new ScaleFrameLayout(this);
scaleFrameLayout.setLayoutParams(new RelativeLayout.LayoutParams(500,1300));
scaleFrameLayout.addView(layout);
// scaleFrameLayout.config(false, ScreenUtils.getScreenWidth(this),ScreenUtils.getScreenHeight(this),
// ScreenUtils.getScreenWidth(this)/2,ScreenUtils.getScreenHeight(this)/2);
scaleFrameLayout.config(false, ScreenUtils.getScreenWidth(this),ScreenUtils.getScreenHeight(this),0,0);
RelativeLayout relativeLayout = (RelativeLayout) findViewById(R.id.activity_scale_view);
relativeLayout.addView(scaleFrameLayout);
}
}
public class ScaleFrameLayout extends FrameLayout {
private float scale = 1f;
private int width_self, height_self;
private int width_bigview = 0, height_bigview = 0;
private boolean basedOnWidthOrHeight = true;//默认基于宽度,按比例缩放
private Context context;
private float px,py;//缩放中心点
public ScaleFrameLayout(Context context) {
super(context);
this.context = context;
}
public ScaleFrameLayout(Context context, AttributeSet attrs) {
super(context, attrs);
this.context = context;
}
public void config(boolean basedOnWidthOrHeight,int width_bigview, int height_bigview,float px, float py) {
this.basedOnWidthOrHeight=basedOnWidthOrHeight;
this.width_bigview = width_bigview;
this.height_bigview = height_bigview;
if (this.width_bigview == 0) this.width_bigview = ScreenUtils.getScreenWidth(context);
if (this.height_bigview == 0) this.height_bigview = ScreenUtils.getScreenHeight(context);
this.px=px;
this.py=py;
invalidate();
}
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
setMeasuredDimension(getDefaultSize(0, widthMeasureSpec), getDefaultSize(0, heightMeasureSpec));
width_self=getMeasuredWidth();
height_self=getMeasuredHeight();
super.onMeasure(MeasureSpec.makeMeasureSpec(
width_bigview, MeasureSpec.EXACTLY), MeasureSpec.makeMeasureSpec(height_bigview, MeasureSpec.EXACTLY));
}
@Override
protected void dispatchDraw(Canvas canvas) {
if (basedOnWidthOrHeight) {
scale = (width_self - getPaddingTop() - getPaddingBottom()) * 1f / width_bigview;
} else {
scale = (height_self - getPaddingTop() - getPaddingBottom()) * 1f / height_bigview;
}
PaintFlagsDrawFilter pfd= new PaintFlagsDrawFilter(0, Paint.ANTI_ALIAS_FLAG|Paint.FILTER_BITMAP_FLAG);
/**
* 对canvas设置抗锯齿的滤镜,防止变化canvas引起画质降低
*/
canvas.setDrawFilter(pfd);
canvas.save();
//x缩放比例,y缩放比例,px,py,缩放中心点,可以设置左顶点或者中心等顶点
canvas.scale(scale, scale, px, py);
super.dispatchDraw(canvas);
canvas.restore();
}
}
不需要自定义view
view.setPivotX(ScreenUtils.getScreenWidth(context) / 2);
view.setPivotY(0);
view.setScaleX(scale);
view.setScaleY(scale);
Canvas缩放还可用于广告中,缩放广告View
关注专题Android开发常用开源库