Android佈局對角線切割

Question

如何用內部對角線對角線切割佈局（LinearLayout或RelativeLayout）？

的樣機看起來像這樣：

我試圖用對角佈局庫，例如https://github.com/florent37/DiagonalLayout但我不能似乎得到的圖像的右側和第二佈局與左此切圖書館或自定義視圖。

任何幫助，將不勝感激。

Answer 1

可以繪製每一個ViewGroup的背景由你自己。

有在此解決方案的一些關鍵點：

1. 您需要擴展所需ViewGroup：

   public class DiagonalLayout extends LinearLayout 
   

2. 覆蓋功能：

   protected void dispatchDraw(Canvas canvas)

3. 填寫方法d以上。下面是示例代碼：

   @Override 
   protected void dispatchDraw(Canvas canvas) { 
       int height = canvas.getHeight(); 
       int width = canvas.getWidth(); 
       Path path = new Path(); 
       path.moveTo(0, 0); 
       path.lineTo(width/3 + width/10, 0); 
       path.lineTo(width/3 - width/10, height); 
       path.lineTo(0, height); 
       path.close(); 
       canvas.save(); 
       canvas.clipPath(path, Region.Op.INTERSECT); 
       canvas.drawColor(ContextCompat.getColor(getContext(), android.R.color.holo_red_dark)); 
       canvas.restore(); 
       path = new Path(); 
       path.moveTo(width/3 + width/10 + width/10, 0); 
       path.lineTo(width, 0); 
       path.lineTo(width, height); 
       path.lineTo(width/3, height); 
       path.close(); 
       canvas.save(); 
       canvas.clipPath(path, Region.Op.INTERSECT); 
       Paint paint = new Paint(); 
       paint.setStrokeWidth(8); 
       paint.setStyle(Paint.Style.STROKE); 
       paint.setColor(ContextCompat.getColor(getContext(), android.R.color.black)); 
       canvas.drawPath(path, paint); 
       canvas.restore(); 
       super.dispatchDraw(canvas); 
   } 
   

代碼上面的效果是：

什麼上面的代碼的作用是：

1. 上繪製多邊形左邊。
2. 保存Canvas狀態，夾Canvas到多邊形，並用彩色
3. 填充它還原Canvas到原始大小，繪製第二多邊形

要繪製的位圖，而不是使用與紅色填充它drawBitmap (Bitmap bitmap, Matrix matrix, Paint paint)方法。

Answer 2

似乎切口方向和角度與XML指定屬性：

diagonal:diagonal_angle="" 
diagonal:diagonal_gravity="" 

您需要在對角線工作：以創建切口diagonal_gravity，我只是看到了一些例子，但我認爲有了它，你可以決定在哪裏砍。

例如：您的左邊塊應該有diagonal:diagonal_gravity="right|top"這應該從右上方切割，並且在diagonal:diagonal_angle中指定的角度。

你需要編寫兩個塊，所以你需要有LinearLayout和兩個DiagonalLayout

發揮讓我知道如果這樣的事情可以工作：

<!-- above this there's an outer Layout block --> 
<!-- This LinearLayout block is to create a container for the images --> 
<LinearLayout   
android:layout_width="match_parent" 
android:layout_height="wrap_content" 
android:orientation="orizontal"> 

    <!-- Left image block --> 
    <com.github.florent37.diagonallayout.DiagonalLayout 
     android:layout_width="what-you-need" 
     android:layout_height="what-you-need" 
     app:diagonal_angle="choose" 
     app:diagonal_gravity="right|top"> 

     <ImageView 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:src="image" /> 
    </com.github.florent37.diagonallayout.DiagonalLayout> 

    <!-- Right image block --> 
    <com.github.florent37.diagonallayout.DiagonalLayout 
     android:layout_width="what-you-need" 
     android:layout_height="what-you-need" 
     app:diagonal_angle="choose" 
     app:diagonal_gravity="left|bottom"> 

     <ImageView 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:src="image" /> 
    </com.github.florent37.diagonallayout.DiagonalLayout> 

</LinearLayout>