반응형
프레임 내 마스킹 (자르기) 이미지
이렇게 복잡한 모양의 이미지를 보여주고 싶은 풍부한 UI 애플리케이션이 있습니다.
이제 내가 원하는 것은 마스크 이미지에 따라 이미지를 자르는 것입니다. 실제로 이미지는 동적이며 카메라 또는 갤러리 (정사각형 또는 직사각형 모양)에서 가져올 수 있으며 해당 이미지가 위와 같이 내 레이아웃 프레임에 맞기를 원합니다.
그래서 어떻게 이것을 달성했는지 궁금하십니까? 모든 아이디어 / 힌트 환영
배경 프레임
마스크
마찬가지로 이
마침내 마스크 이미지를 변경하고 Xfermode
with를 사용하면서 해결책을 얻었습니다.Bitmap
마스크
ImageView mImageView= (ImageView)findViewById(R.id.imageview_id);
Bitmap original = BitmapFactory.decodeResource(getResources(),R.drawable.content_image);
Bitmap mask = BitmapFactory.decodeResource(getResources(),R.drawable.mask);
Bitmap result = Bitmap.createBitmap(mask.getWidth(), mask.getHeight(), Config.ARGB_8888);
Canvas mCanvas = new Canvas(result);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
mCanvas.drawBitmap(original, 0, 0, null);
mCanvas.drawBitmap(mask, 0, 0, paint);
paint.setXfermode(null);
mImageView.setImageBitmap(result);
mImageView.setScaleType(ScaleType.CENTER);
mImageView.setBackgroundResource(R.drawable.background_frame);
출력 참조
Picasso 라이브러리와 사용자 지정 변환을 사용하는 것이 훨씬 더 쉽습니다.
MaskTransformation.java :
* ORIGINAL:
* Copyright (C) 2015 Wasabeef
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
package me.monori.example.utilities;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.drawable.Drawable;
import android.support.v4.content.ContextCompat;
import com.squareup.picasso.Transformation;
public class MaskTransformation implements Transformation {
private static Paint mMaskingPaint = new Paint();
private Context mContext;
private int mMaskId;
static {
mMaskingPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
}
/**
* @param maskId If you change the mask file, please also rename the mask file, or Glide will get
* the cache with the old mask. Because getId() return the same values if using the
* same make file name. If you have a good idea please tell us, thanks.
*/
public MaskTransformation(Context context, int maskId) {
mContext = context.getApplicationContext();
mMaskId = maskId;
}
@Override public Bitmap transform(Bitmap source) {
int width = source.getWidth();
int height = source.getHeight();
Bitmap result = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
Drawable mask = getMaskDrawable(mContext, mMaskId);
Canvas canvas = new Canvas(result);
mask.setBounds(0, 0, width, height);
mask.draw(canvas);
canvas.drawBitmap(source, 0, 0, mMaskingPaint);
source.recycle();
return result;
}
@Override public String key() {
return "MaskTransformation(maskId=" + mContext.getResources().getResourceEntryName(mMaskId)
+ ")";
}
public Drawable getMaskDrawable(Context context, int maskId) {
Drawable drawable = ContextCompat.getDrawable(context, maskId);
if (drawable == null) {
throw new IllegalArgumentException("maskId is invalid");
}
return drawable;
}
}
그런 다음 간단히 한 줄로 정의합니다.
Picasso.with(context)
.load(imageUrl)
.transform(new MaskTransformation(context, _maskDrawableId))
.placeholder(R.drawable.drawableId)
.into(imageView);
final ImageView mImageView = (ImageView) findViewById(R.id.image);
mImageView.setBackgroundResource(R.drawable.user_outer_circle_icon);
mImageView.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
if(b){
mImageView.setBackgroundResource(R.drawable.profil_circle);
Bitmap original = BitmapFactory.decodeResource(getResources(),R.drawable.doge);
Bitmap mask = BitmapFactory.decodeResource(getResources(),R.drawable.mask_white);
Bitmap mask1 = BitmapFactory.decodeResource(getResources(),R.drawable.pencil_bg);
original = Bitmap.createScaledBitmap(original, mask.getWidth(),mask.getHeight(), true);
Bitmap result = Bitmap.createBitmap(mask.getWidth(), mask.getHeight(),Config.ARGB_8888);
Canvas mCanvas = new Canvas(result);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
mCanvas.drawBitmap(original, 0, 0, null);
mCanvas.drawBitmap(mask, 0, 0, paint);
mCanvas.drawBitmap(mask1, 0, 0, null);
Bitmap mask2 = BitmapFactory.decodeResource(getResources(), R.drawable.ic_pencil);
mCanvas.drawBitmap(mask2, 0, 0, null);
mImageView.setImageBitmap(result);
mImageView.setScaleType(ScaleType.FIT_XY);
b=false;
}else{
ImageView mImageView = (ImageView) findViewById(R.id.image);
Bitmap original = BitmapFactory.decodeResource(getResources(),
R.drawable.doge);
Bitmap mask = BitmapFactory.decodeResource(getResources(),
R.drawable.mask_white);
original = Bitmap.createScaledBitmap(original, mask.getWidth(),
mask.getHeight(), true);
Bitmap result = Bitmap.createBitmap(mask.getWidth(), mask.getHeight(),
Config.ARGB_8888);
Canvas mCanvas = new Canvas(result);
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_IN));
mCanvas.drawBitmap(original, 0, 0, null);
mCanvas.drawBitmap(mask, 0, 0, paint);
paint.setXfermode(null);
mImageView.setImageBitmap(result);
mImageView.setScaleType(ScaleType.FIT_XY);
// mImageView.setBackgroundResource(R.drawable.user_outer_circle_icon);
b= true;
}
}
});
참고 URL : https://stackoverflow.com/questions/12614542/maskingcrop-image-in-frame
반응형
'programing' 카테고리의 다른 글
MailMessage 개체를 * .eml 또는 * .msg 파일로 디스크에 저장하는 방법 (0) | 2020.10.05 |
---|---|
node.js 초보자 자습서? (0) | 2020.10.05 |
이미지 처리, 파이썬? (0) | 2020.10.05 |
비밀번호 재설정을 구현하는 방법? (0) | 2020.10.05 |
Android 프로젝트에서 대상 빌드를 변경하는 방법은 무엇입니까? (0) | 2020.10.05 |