2016-12-20 3 views
1

아래처럼 이미지를 자르는 사용자 정의 이미지 뷰를 만들려고합니다.사용자 정의 이미지 뷰 기울임

enter image description here 많은 솔루션을 확인했지만 내가 본 가장 가까운 대답은 link입니다. 그러나 그것의 반대편에 경사지는 것은 구석에서 너무. 다른면을 비스듬히하고 조금 아래에서 시작하여 어떻게 이미지를자를 수 있습니까?

+0

시도'path.moveTo (0, 0); path.lineTo (0, h); path.lineTo (w, h-h/3); path.lineTo (w, 0); path.close(); ' –

+0

여기에 어떤 이미지가 "자르기"되어 있습니까? 파란색 사다리꼴 말이야? 그래서 만약 당신이 어떤 사용자 정의보기가 필요 없어, 당신은 사용자 정의'Drawable', 뭔가가 필요합니다 [this] (http://stackoverflow.com/a/41211322/2252830) – pskink

답변

1

// Custom View 
 

 
public class SlantView extends View { 
 
    private Context mContext; 
 
    Paint paint ; 
 
    Path path; 
 

 
    public SlantView(Context ctx, AttributeSet attrs) { 
 
     super(ctx, attrs); 
 
     mContext = ctx; 
 
     setWillNotDraw(false); 
 
     paint = new Paint(Paint.ANTI_ALIAS_FLAG); 
 
    } 
 

 
    @Override 
 
    protected void onDraw(Canvas canvas) { 
 

 
     int w = getWidth(), h = getHeight(); 
 
     paint.setStrokeWidth(2); 
 
     paint.setColor(Color.WHITE); 
 
     paint.setStyle(Paint.Style.FILL_AND_STROKE); 
 
     paint.setAntiAlias(true); 
 

 
     path = new Path(); 
 
     path.setFillType(Path.FillType.EVEN_ODD); 
 
     path.moveTo(0,0); 
 
     path.lineTo(0,h); 
 
     path.lineTo(w,h); 
 
     path.close(); 
 
     canvas.drawPath(path, paint); 
 
    } 
 
}

여기 난 RelativeLayout의 연장.

package com.blin.sharedelementtransition; 

import android.annotation.TargetApi; 
import android.content.Context; 
import android.graphics.Canvas; 
import android.graphics.Paint; 
import android.graphics.Path; 
import android.graphics.PorterDuff; 
import android.graphics.PorterDuffXfermode; 
import android.graphics.Xfermode; 
import android.os.Build; 
import android.util.AttributeSet; 
import android.util.TypedValue; 
import android.widget.FrameLayout; 
import android.widget.RelativeLayout; 

/** 
* Created by wituser on 12/12/16. 
*/ 
public class cutLayout extends RelativeLayout { 
    private Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG); 
    private Xfermode pdMode = new PorterDuffXfermode(PorterDuff.Mode.CLEAR); 
    private Path path = new Path(); 

    public cutLayout(Context context) { 
     super(context); 
    } 

    public cutLayout(Context context, AttributeSet attrs) { 
     super(context, attrs); 
    } 

    public cutLayout(Context context, AttributeSet attrs, int defStyleAttr) { 
     super(context, attrs, defStyleAttr); 
    } 

    @TargetApi(Build.VERSION_CODES.LOLLIPOP) 
    public cutLayout(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) { 
     super(context, attrs, defStyleAttr, defStyleRes); 
    } 
    @Override 
    protected void dispatchDraw(Canvas canvas) { 
     int saveCount = canvas.saveLayer(0, 0, getWidth(), getHeight(), null, Canvas.ALL_SAVE_FLAG); 
     super.dispatchDraw(canvas); 
     paint.setXfermode(pdMode); 
     path.reset(); 
//  path.moveTo(0, getHeight() - TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 50, getResources().getDisplayMetrics())); 
     path.moveTo(0, getHeight()); 
     path.lineTo(getWidth(), getHeight()); 
     path.lineTo(getWidth(), getHeight() - TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 50, getResources().getDisplayMetrics())); 

// change value (50) to change the the slope.50 means 50dp. 
//  path.lineTo(getWidth()/2, getHeight()); 


//  path.moveTo(0,0);        // (0,0) 
//  path.lineTo(getPx(50),0);      // (50,0) 
//  path.lineTo(0,getPx(50));      // (0,50) 
// 
//  path.lineTo(0,getHeight()-getPx(50));   // (0,H-50) 
//  path.lineTo(getPx(50),getHeight());    // (50,H) 
//  path.lineTo(0,getHeight());      // (0,H) 
// 
//  path.lineTo(0,0);        // (0,0) 
//  path.lineTo(getWidth()-getPx(50),0);   // (W-50,0) 
//  path.lineTo(getWidth(),getPx(50));    // (W,50) 
//  path.lineTo(getWidth(),0);      // (W,0) 
// 
//  path.lineTo(getWidth(),getHeight()-getPx(50)); // (W,H-50) 
//  path.lineTo(getWidth()-getPx(50),getHeight()); // (W-50,H) 
//  path.lineTo(getWidth(),getHeight());   // (W,H) 
//  path.lineTo(getWidth(),0);      // (W,0) 


     path.close(); 
     canvas.drawPath(path, paint); 
     canvas.restoreToCount(saveCount); 
     paint.setXfermode(null); 
    } 

    private float getPx(int i) { 
     return TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, i, getResources().getDisplayMetrics()); 
    } 

} 

및 XML에서, <your.package.name.cutLayout (cutLayout라는 이름의 자바 파일을 만듭니다). cutLayout은 javafile의 이름입니다.

<com.blin.sharedelementtransition.cutLayout 
    android:layout_width="match_parent" 
    android:layout_height="300dp" 
    android:layout_margin="8dp"> 

    <ImageView 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:background="@drawable/bg2" 
     android:layout_marginBottom="0.5dp"/> 

</com.blin.sharedelementtransition.cutLayout> 

enter image description here

+0

나는 같은 결과를 얻지 못할거야. 나는 xml에 커스텀 레이아웃을 추가하고 그 레이아웃의 배경 이미지를 추가했지만 같은 결과를 얻지 못했다. 그래서 내가 뭔가 잘못하고있는 것일까 요? 올바른 방법을 보여줄 수 있습니까? @B Lin –

+0

업데이트 된 답변을 확인하십시오. 테스트를 거쳤습니다. 작동하지 않으면 코드를 제공합니다 .i 도울 수 있습니다. –

+0

고마워요. 너는 내 하루를 보냈다! 이제 제대로 작동합니다. –