如何在Android Studio中创建菱形按钮 [英] How to create a rhombus shaped button in android studio

问题描述

我想创建一个带有菱形形状的按钮，就像在材料网站上一样:

I want to create a button with a rhombus shape like on the Material website:

(这是图片)

我在网上搜索并没有找到答案，所以我在这里问.

I searched the web and didn't find an answer so I'm asking it here.

我已经发现了如何创建菱形形状:

I already found out how to create a rhombus shape:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

<item
    android:height="60dp"
    android:width="60dp"

    android:right="20dp"
    android:left="20dp"
    android:gravity="center">
    <rotate
        android:fromDegrees="45"
        android:pivotX="50%"
        android:pivotY="50%" >
        <shape
            android:shape="rectangle">
            <solid
                android:color="@color/black" />
        </shape>
    </rotate>
</item>

这是我的图像按钮:

<ImageButton
    android:layout_width="85dp"
    android:layout_height="85dp"
    android:background="@drawable/button_test"
    android:src="@drawable/ic_pause_white"
    />

"@ drawable/ic_pause_white"是我导入的暂停图标矢量.

"@drawable/ic_pause_white" is a pause icon vector I imported.

现在，我有一个带有菱形形状的暂停按钮，但是我的问题是，点击框与图像(如预期的那样)

Now I have a pause button with a rhombus shape but my problem is that the hitbox doesn't match the image (like expected)

我已经尝试创建 OnTouchListener

ImageButton btnPlay = findViewById(R.id.btnPlay_Song);

btnPlay.setOnTouchListener(new View.OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {

        int eventPadTouch = event.getAction();
        float iX=event.getX();
        float iY=event.getY();

        switch (eventPadTouch) {

            case MotionEvent.ACTION_DOWN:
                bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.button_test);

                if (iX>=0 & iY>=0 & iX<bitmap.getWidth() & iY<bitmap.getHeight()) { //Makes sure that X and Y are not less than 0, and no more than the height and width of the image.
                    if (bitmap.getPixel((int) iX, (int) iY)!=0) {
                        // actual image area is clicked(alpha not equal to 0), do something
                        Toast.makeText(ActivityPlayerSong.this, "Play", Toast.LENGTH_SHORT).show();
                    }
                }
                return true;
        }
        return false;
    }
});

但是我想知道是否有一种更简单的方法，并且是否没有使用上面的代码"BitmapFactory.decodeResource(getResources()，R.drawable.button_test)" 是返回 null ，我不知道为什么.

but I was wondering if there is an easier method to do it and if there isn't using the code above "BitmapFactory.decodeResource(getResources(), R.drawable.button_test)" is returning null and I don't know why.

谢谢，向所有试图帮助我的人致以诚意！

Thank You in advance to everyone who tries to help me!

推荐答案

更技术上正确"的解决方案的替代方案:如果使用方形背景，然后将图标顺时针旋转45度，然后将整个按钮旋转45度，该怎么办?逆时针方向?

An alternative to a more "technically correct" solution: What if you used a square background and then rotated the icon 45 degrees clockwise and rotated the whole button 45 degrees counter-clockwise?

<ImageButton
    android:background="@color/black"
    app:srcCompat="@drawable/ic_camera_45deg"
    android:rotation="-45"
    android:layout_width="48dp"
    android:layout_height="48dp"/>

此处背景为纯色，因此您不会收到任何视觉触摸反馈.为此，您需要在Android 4上使用< selector> 可绘制对象，在Android 5+上使用< ripple> 可绘制对象.

Here the background is a solid color so you won't get any visual touch feedback. You'll want to use a <selector> drawable on Android 4 and <ripple> drawable on Android 5+ for that.

<vector xmlns:android="http://schemas.android.com/apk/res/android"
        android:width="24dp"
        android:height="24dp"
        android:tint="@color/white"
        android:viewportHeight="24.0"
        android:viewportWidth="24.0">

    <group
        android:pivotX="12"
        android:pivotY="12"
        android:rotation="45">
        <!-- Original paths go here. -->
    </group>
</vector>

注意 tint 属性.如果图标不是24x24，请确保枢轴点位于 viewportWidth 和 viewportHeight 的中间.

Notice the tint attribute. Make sure the pivot point is in the middle of viewportWidth and viewportHeight if your icon is not 24x24.

这篇关于如何在Android Studio中创建菱形按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！