-2

i'm looking for how to create a slanted button like the picture :

enter image description here

i tried some solutions : How to create parallelogram shape background? and

Android: how to create shape with skewed two-tone color? But I could not find what I was looking for

Phantômaxx
  • 37,901
  • 21
  • 84
  • 115
ali
  • 189
  • 3
  • 14

1 Answers1

1

There is a third party library, can give slanted shape Textview. you can set a listener to Textview and perform your desired function. You can change the direction of SlantedTextView by changing the value of app:slantedMode="left" and also can increase and decrease the size of SlantedTextView by changing the value of app:slantedLength="55dp".

Library:

compile 'com.haozhang.libary:android-slanted-textview:1.2'

Link: https://github.com/HeZaiJin/SlantedTextView`

XML Code:

<com.haozhang.lib.SlantedTextView
    android:layout_width="150dp"
    android:layout_height="150dp"
    android:layout_alignParentEnd="true"
    android:layout_alignParentTop="true"
    android:layout_marginEnd="96dp"
    android:layout_marginTop="139dp"
    android:gravity="center"
    app:slantedBackgroundColor="@color/colorPrimaryDark"
    app:slantedLength="55dp"
    app:slantedMode="left"
    app:slantedText="IOS"
    app:slantedTextColor="@color/colorPrimary"
    app:slantedTextSize="16sp" />

Java Code:

SlantedTextView stv = (SlantedTextView) findViewById(R.id.test);

stv.setText("PHP")
        .setTextColor(Color.WHITE)
        .setSlantedBackgroundColor(Color.BLACK)
        .setTextSize(18)
        .setSlantedLength(50)
        .setMode(SlantedTextView.MODE_LEFT);

enter image description here

If you want something similar then I have written some code in drawable. May be It can help you

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:bottom="43dp"
        android:left="43dp"
        android:right="43dp"
        android:top="43dp">

        <rotate android:fromDegrees="10">

            <shape android:shape="rectangle">
                <size
                    android:width="200dp"
                    android:height="200dp" />
                <gradient
                    android:endColor="#ecf566"
                    android:startColor="#00000000" />
                <stroke
                    android:width="2dp"
                    android:color="#1414d2" />
            </shape>
        </rotate>
    </item>
</layer-list>

enter image description here

Shahzad Afridi
  • 2,058
  • 26
  • 24