Làm thế nào để tạo hình nền hình bình hành?

Question

Tôi cố gắng để làm cho nền hình bình hành cho TextView của tôi, nhưng nó không hiển thị đúng ... nó hiển thị sau đầu ra

<layer-list > 
    <item> 
     <rotate 
      android:fromDegrees="10" 
      android:toDegrees="10" 
      android:pivotX="-40%" 
      android:pivotY="87%" > 
      <shape 
       android:shape="rectangle" > 
       <stroke android:color="#000000" android:width="10dp"/> 

      </shape> 

     </rotate> 

    </item> 
</layer-list> 

tôi cần đầu ra như thế này ........

Answer 1

Khi thay thế cho câu trả lời của @ mmlooloo, người mà tín dụng đến, tôi đề xuất giải pháp có thể vẽ được xml (vì bạn chưa nhấn mạnh chính xác loại giải pháp mà bạn đang tìm kiếm). Trong ví dụ dưới đây, tôi đã sử dụng tổng quát View, tuy nhiên bạn có thể sử dụng bất kỳ loại nào khác.

Đây là View

<View 
    android:layout_width="100dp" 
    android:layout_height="40dp" 
    android:layout_centerInParent="true" 
    android:background="@drawable/shape" /> 

và shape.xml tự

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

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

<!-- This rectangle for the left side --> 
<!-- Its color should be the same as layout's background --> 
<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> 

<!-- This rectangle for the right side --> 
<!-- Their color should be the same as layout's background --> 
<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> 

Sau đây là cách nó trông giống như:

Answer 2

Bạn có đang đề cập đến menu điều hướng không? Nếu vậy, bạn có thể sử dụng mã này để tạo ra một hình bình hành:

ul#nav li a { 
display: inline-block; 
text-decoration:none; 
padding:4px 10px; 
border-radius:3px; 
transform: skew(-10deg); 
-o-transform: skew(-10deg); 
-moz-transform: skew(-10deg); 
-webkit-transform: skew(-10deg); 
color:#000000; 
} 
ul#nav li a span { 
display: inline-block; 
transform: skew(10deg); 
-o-transform: skew(10deg); 
-moz-transform: skew(10deg); 
-webkit-transform: skew(10deg); 
} 

Bạn cũng có thể kiểm tra phiên bản HTML và CSS trong codepen.

Hy vọng điều này sẽ hữu ích.

Answer 3

bạn có thể đạt được điều đó bằng cách tạo ra tùy chỉnh Textview như thế này:

public class ParallogramTextView extends TextView { 


     Paint mBoarderPaint; 
     Paint mInnerPaint; 

     public ParallogramTextView(Context context) { 
      super(context); 
      init(); 
     } 

     public ParallogramTextView(Context context, AttributeSet attrs, int defStyle) { 
      super(context, attrs, defStyle); 
      init(); 
     } 

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


     private void init() { 
      mBoarderPaint = new Paint(); 
      mBoarderPaint.setAntiAlias(true); 
      mBoarderPaint.setColor(Color.BLACK); 
      mBoarderPaint.setStyle(Paint.Style.STROKE); 
      mBoarderPaint.setStrokeWidth(6); 

      mInnerPaint = new Paint(); 
      mInnerPaint.setAntiAlias(true); 
      mInnerPaint.setColor(Color.parseColor("#13a89e")); 
      mInnerPaint.setStyle(Paint.Style.FILL); 
      mInnerPaint.setStrokeJoin(Paint.Join.ROUND); 
     } 


     @Override 
     public void draw(Canvas canvas) { 
      super.draw(canvas); 
      Path path = new Path(); 
      path.moveTo(getWidth(),0); 
      path.lineTo(getWidth()/2, 0); 
      path.lineTo(0, getHeight()); 
      path.lineTo(getWidth()/2,getHeight()); 
      path.lineTo(getWidth(), 0); 
      canvas.drawPath(path, mInnerPaint); 
      canvas.drawPath(path, mBoarderPaint); 
     } 

} 

và trong file bố trí sử dụng nó như dưới đây:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:gravity="center"> 



    <com.example.ParallogramTextView 
     android:id = "@+id/result" 
     android:layout_width="500dp" 
     android:layout_height="500dp" 
     android:layout_centerInParent="true" 
     android:gravity="center" 
     android:layout_margin="32dp" /> 


</RelativeLayout> 

kết quả là:

Answer 4

<item 
    android:bottom="-25dp" 
    android:top="-25dp" 
    android:left="25dp" 
    android:right="25dp"> 
    <rotate android:fromDegrees="20"> 
     <shape android:shape="rectangle"> 
      <size 
       android:width="50dp" 
       android:height="100dp"/> 
      <solid android:color="#13a8de"/> 
     </shape> 

    </rotate> 
</item> 

Cái này hoạt động trên nền alle không chỉ trắng như trong ví dụ trên