android - 如何使用此图片上的按钮创建布局？ (实际上是三角形的按钮，而不是 mask )

Question

这是想要的布局: Layout

我坚持了很长时间。尝试旋转某种按钮以掩盖其他按钮和其他方式，例如:

            <rotate
            android:fromDegrees="45"
            android:toDegrees="45"
            android:pivotX="-40%"
            android:pivotY="87%" />

这个布局怎么写代码，按钮需要自定义形状，不能点击周围，实现点击一致？

编辑 我试过了 Making a triangle shape using xml definitions? , Creating a triangular shaped button for android application

但这就是我得到的:http://i.stack.imgur.com/X88P0.png

Answer 1

这是 TriangleButton 的代码，它绘制三角形并仅当您的手指位于三角形区域时才对 clickEvent() 作出 react 。在这里你可以设置颜色(正常和按下):

类:

public class TriangleButton extends Button {

    private final float RADIUS = 50.0f;

    private boolean mIsPressed;

    private Region mPathRegion;
    private final Path mPath = new Path();

    private final Paint mNormalPaint = new Paint(Paint.ANTI_ALIAS_FLAG) {
        {
            setDither(true);
            setStyle(Style.FILL);
            setPathEffect(new CornerPathEffect(RADIUS));
        }
    };

    private final Paint mPressedPaint = new Paint(Paint.ANTI_ALIAS_FLAG) {
        {
            setDither(true);
            setStyle(Style.FILL);
            setPathEffect(new CornerPathEffect(RADIUS));
        }
    };

    public TriangleButton(final Context context) {
        this(context, null);
    }

    public TriangleButton(final Context context, final AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public TriangleButton(final Context context, final AttributeSet attrs, final int defStyleAttr) {
        super(context, attrs, defStyleAttr);

        setWillNotDraw(false);
        setBackgroundColor(Color.TRANSPARENT);
        setColors(Color.RED, Color.GRAY);
    }

    public void setColors(final int color, final int pressed) {
        mNormalPaint.setColor(color);
        mPressedPaint.setColor(pressed);
    }

    @Override
    protected void onSizeChanged(final int w, final int h, final int oldw, final int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);

        // Set triangle
        mPath.reset();
        mPath.moveTo(0.0f, h);
        mPath.lineTo(w / 2.0f, 0.0f);
        mPath.lineTo(w, h);
        mPath.close();

        // Create region for touch detecting
        final RectF rectF = new RectF();
        mPath.computeBounds(rectF, true);
        mPathRegion = new Region();
        mPathRegion.setPath(
                mPath,
                new Region(
                        (int) rectF.left,
                        (int) rectF.top,
                        (int) rectF.right,
                        (int) rectF.bottom)
        );
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        if (mPathRegion.contains((int) event.getX(), (int) event.getY())) {
            switch (event.getAction()) {
                case MotionEvent.ACTION_DOWN:
                    mIsPressed = true;
                    break;
                case MotionEvent.ACTION_UP:
                    mIsPressed = false;
                    performClick();
                    break;
                case MotionEvent.ACTION_CANCEL:
                    mIsPressed = false;
                    break;
            }
            postInvalidate();
        } else {
            mIsPressed = false;
            postInvalidate();
            return false;
        }

        postInvalidate();
        return true;
    }

    @Override
    protected void onDraw(final Canvas canvas) {
        canvas.drawPath(mPath, mIsPressed ? mPressedPaint : mNormalPaint);
        super.onDraw(canvas);
    }
}

XML:

<FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <com.example.user.timezonetest.TriangleButton
            android:id="@+id/btn_bottom"
            android:layout_width="300dp"
            android:layout_height="250dp"
            android:text="Second Button"
            android:textColor="#000"
            android:layout_gravity="center_horizontal"
            android:gravity="bottom|center_horizontal"
            android:padding="30dp"/>

        <com.example.user.timezonetest.TriangleButton
            android:id="@+id/btn_top"
            android:layout_width="180dp"
            android:layout_height="160dp"
            android:text="First Button"
            android:textColor="#000"
            android:layout_gravity="center_horizontal"
            android:gravity="bottom|center_horizontal"
            android:layout_margin="30dp"
            android:padding="30dp"/>

 </FrameLayout>

代码:

final TriangleButton bottomButton = (TriangleButton) findViewById(R.id.btn_bottom);
final TriangleButton topButton = (TriangleButton) findViewById(R.id.btn_top);

bottomButton.setColors(Color.RED, Color.GRAY);
topButton.setColors(Color.YELLOW, Color.GRAY);