这个控件如果找到正确的方法实现起来并不难,之前由于思路错误,导致走了很多弯路
注:使用可放大缩小的图片控件,之后在上面绘制区域不可行,绘制的区域不能放大缩小和移动
之后在网上找到一个可放大缩小的Fragmentlayout控件,在该控件布局包裹下的控件均可以实现放大缩小和移动,这个问题才得以解决
下面是控件地址:
一个可随手势拖拽布局
- 拿到背景图片之后先计算图片占区域的高度,用屏幕高度减去状态栏和其他布局高度可得出此高度,然后根据图片的宽高比来计算出图片所占区域的宽度,从而算图片出在布局中的位置
((RecView2) view).setImageBitmap(bitmap);
//获取图片和屏幕的缩放比例
DisplayMetrics dm = new DisplayMetrics();
getWindowManager().getDefaultDisplay().getMetrics(dm);
//获取屏幕信息
//720
int screenWidth = dm.widthPixels;
//1280
int screenHeight = dm.heightPixels;
final float scale1 = HiddenPhotoActivity.this.getResources().getDisplayMetrics().density;
//966
int rlHeight = screenHeight - (int) ((114 + 162) * scale1 + TDevice.getStatusBarHeight(HiddenPhotoActivity.this));
//720
int rlWidth = screenWidth;
float imageHeight = bitmap.getHeight();//basedata.getData().getImageHeight();
float imageWidth = bitmap.getWidth();//basedata.getData().getImageWidth();
RelativeLayout.LayoutParams lp = (RelativeLayout.LayoutParams) mRecView2.getLayoutParams();
if ((imageHeight / rlHeight) > (imageWidth / rlWidth)) {
scale = imageHeight / rlHeight;
lp.width = (int) (imageWidth / scale);
lp.addRule(RelativeLayout.CENTER_IN_PARENT, RelativeLayout.TRUE);
lp.height = rlHeight;
} else {
scale = imageWidth / screenWidth;
lp.width = screenWidth;
lp.addRule(RelativeLayout.CENTER_IN_PARENT, RelativeLayout.TRUE);
lp.height = (int) (imageHeight / scale);
}
mRecView2.setLayoutParams(lp);
2.根据宽高缩放比例,从新计算每一组区域中每一个区域原点和宽高的大小,放入三组集合用于之后切换三个按钮时使用
3.切换按钮时,通过上述集合动态给拖拽布局内添加imageButton,具体在哪个区位显示由刚刚算出两个点决定,顺便把显示图片数量和imageView和textView定位到区域中间。每点击按钮清除之前的view,加载新的view
private void drawSingleAreas(List<HouseInformation> list){
mFrameLayout.removeAllViews();
int templeft, tempTop;
for(int i = 0; i < list.size(); i ++){
final HouseInformation lbInfo = list.get(i);
ImageButton ib = new ImageButton(HiddenPhotoActivity.this);
ImageView iv = new ImageView(HiddenPhotoActivity.this);
TextView tv = new TextView(HiddenPhotoActivity.this);
FrameLayout.LayoutParams params = new FrameLayout.LayoutParams((int)lbInfo.getWidth(), (int)lbInfo.getHeight());
params.width = (int) lbInfo.getWidth();
params.height = (int) lbInfo.getHeight();
params.setMargins((int)lbInfo.getOriginX(), (int)lbInfo.getOriginY(), 0 , 0);
templeft = (int)lbInfo.getOriginX() + (int) lbInfo.getWidth() / 2 - 30;
tempTop = (int)lbInfo.getOriginY() + (int) lbInfo.getHeight() / 2 - 60;
if(lbInfo.getPhotoNum() > 0){
ib.setBackgroundDrawable(getResources().getDrawable(R.drawable.shape_house_uploaded_photo));
}else{
ib.setBackgroundDrawable(getResources().getDrawable(R.drawable.shape_house_no_upload_photo));
}
ib.setLayoutParams(params);
FrameLayout.LayoutParams ivParams = new FrameLayout.LayoutParams(60, 60);
ivParams.setMargins(templeft, tempTop, 0 , 0);
iv.setLayoutParams(ivParams);
iv.setImageResource(R.drawable.behalf_pic_no_empty_icon);
FrameLayout.LayoutParams tvParams = new FrameLayout.LayoutParams(60, 60);
tvParams.setMargins(templeft , tempTop , 0 , 0);
if(lbInfo.getPhotoNum() > 0){
tv.setText(lbInfo.getPhotoNum() + "");
}else{
tv.setText("0");
}
tv.setTextSize(10);
tv.setGravity(Gravity.CENTER);
tv.setLayoutParams(tvParams);
ib.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
}
}
});
mFrameLayout.addView(ib);
mFrameLayout.addView(iv);
mFrameLayout.addView(tv);
}
}