Android：繪製歪斜的角落形狀

Question

我想爲我的按鈕使用背景。但是當我使用png時，它會減慢應用程序的速度。因此，我想使用xml形狀，但我不知道如何使切角（如圖片上所示）。

現在我有以下的形狀僅僅是一個矩形：

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
    <solid android:color="@color/blue_semi_transparent"/> 
    <padding android:bottom="10dp" android:right="10dp" android:top="10dp" android:left="10dp"/> 
    <margin android:bottom="10dp" android:right="10dp" android:top="10dp" android:left="10dp"/> 
</shape> 

怎樣繪製右下角？

Answer 1

你可以試試這個，

skewed_background.xml

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 

    <item> 
     <shape android:shape="rectangle" > 


      <solid android:color="#3F8EEB" /> 
     </shape> 
    </item> 
    <item> 
     <rotate 
      android:fromDegrees="110" 
      android:pivotX="90%" 
      android:pivotY="90%" 
      > 
      <shape android:shape="rectangle" > 
       <solid android:color="#FFF" /> 
      </shape> 
     </rotate> 
    </item> 

</layer-list> 

sample_layout.xml

<?xml version="1.0" encoding="utf-8"?> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:padding="16dp" 
    android:orientation="vertical" > 

    <View 
     android:layout_width="200dp" 
     android:layout_height="50dp" 
     android:background="@drawable/triangle1"/> 

</LinearLayout> 

如果你想修改傾斜區域，您只需更改skewed_background.xml中第二項中的fromDegrees，pivotX和pivotY值的值即可。

Answer 2

這會給你你想要的結果

<?xml version="1.0" encoding="utf-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 
<item android:drawable="@color/colorPrimary"/> 


<item android:top="-20dp" 
    android:bottom="-50dp" 
    android:left="350dp" 
    android:right="-120dp"> 
    <rotate 
     android:fromDegrees="10" 
     android:pivotX="50%" 
     android:pivotY="0%"> 
     <shape 
      android:shape="rectangle"> 
      <solid 
       android:color="?android:colorBackground"/> 
     </shape> 
    </rotate> 
</item> 
</layer-list> 

Answer 3

這正是你在尋找什麼

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" android:layout_width="match_parent" 
    android:layout_height="match_parent"> 


    <Button 
     android:id="@+id/button2" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:background="@drawable/bg" 
     android:paddingRight="15dp" 
     android:textColor="#ffffff" 
     android:layout_centerInParent="true" 

     android:text="Button" /> 
</RelativeLayout> 

bg.xml

<?xml version="1.0" encoding="UTF-8"?> 
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" > 


    <item> 
     <shape android:shape="rectangle"> 
      <size 
       android:width="100dp" 
       android:height="40dp" /> 
      <solid android:color="#13a89e" /> 
     </shape> 
    </item> 


    <item 
     android:right="100dp" 
     android:left="100dp" 
     android:top="-100dp" 
     android:bottom="-100dp"> 
     <rotate 
      android:fromDegrees="45"> 
      <shape android:shape="rectangle"> 
       <solid android:color="#ffffff" /> 
      </shape> 
     </rotate> 
    </item> 


    <item 
     android:right="-100dp" 
     android:left="100dp" 
     android:top="-100dp" 
     android:bottom="-100dp"> 
     <rotate 
      android:fromDegrees="45"> 
      <shape android:shape="rectangle"> 
       <solid android:color="#ffffff" /> 
      </shape> 
     </rotate> 
    </item> 

</layer-list> 

輸出