带按钮的自定义视图 [英] Custom view with buttons

问题描述

我需要构建以下视图:

按钮可以是常规按钮，可以使用findViewById()方法从Java代码访问.

Where the buttons can be regular buttons that are accessed from java code using findViewById() method.

我不确定是否可以使用 LayerList 还是需要从头开始实现自定义视图?谁能建议我可以遵循的一些方法来实现这一目标?

I'm not sure if i can do that using LayerList or if I need to implement a custom view from scratch? Can anyone suggest some path that I can follow to achieve this?

更新

现在我有这个了

我现在需要做的是: -隐藏圈外的东西； -仅位于cicle内部的按钮的一部分应触发onClick事件.

What I need to do for now is: - hide what is outside the circle; - only parts of the buttons that are inside the cicle should fire the onClick event.

我应该使用自定义视图组来做到这一点吗?我尝试过，但是我无法在按钮顶部绘制圆圈(应该可以在onDraw()方法中执行吗?)...

Should I use a custom viewgroup to do that? I tried, but I wasn't able to draw the circle on top of the buttons (should be possible do that in the onDraw() method?)...

这是我的代码:

main_layout.xml

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

        <include layout="@layout/custom_layout" />
    </LinearLayout>

</RelativeLayout>

custom_layou.xml

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

    <LinearLayout
        android:id="@+id/buttons_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="14dp"
        android:paddingBottom="10dp"
        android:background="#CC0000FF"
        android:orientation="vertical">

        <Button
            android:id="@+id/button1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Button1" />

        <Button
            android:id="@+id/button2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Button2" />

        <Button
            android:id="@+id/button3"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Button3" />

        <Button
            android:id="@+id/button4"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="Button4" />
    </LinearLayout>

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignTop="@+id/buttons_layout"
        android:layout_alignLeft="@+id/buttons_layout"
        android:layout_alignBottom="@+id/buttons_layout"
        android:src="@drawable/circle_foreground" />

</RelativeLayout>

circle_foreground.xml

<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="ring"
android:innerRadius="100dp"
android:thickness="0dp"
android:useLevel="false" >

<solid android:color="@android:color/transparent" />

<stroke android:width="4dp"
    android:color="#000000"/>

</shape>

推荐答案

必须结合的两件事:

1. 通过用ImageView(上层)覆盖按钮(下层)来构建布局，其中ImageView(上层)中有一个孔. 在这里查看如何操作.可以用FrameLayout

1. Build the layout by overlaying your buttons (lower layer) with an ImageView (upper layer), that has a hole in it. See here, how to do that. The two layers can be defined with a FrameLayout

现在，您必须将圆圈上的所有触摸都委托给按钮.通过在ImageView上设置TouchListener，这应该是可能的.如果触摸在圆外，则此Touchlistener返回true，否则返回false.返回false时，Android应该将触摸向下传递到下一层，即带有按钮的图层.

Now you must delegate all touches on the circle down to the buttons. This should be possible by setting a TouchListener on the ImageView. This Touchlistener returns true, if the touch was outside the circle, otherwise false. When returning false, Android should pass the touch down to the next level, which is the layer with the buttons.

总的来说，我希望结果值得进行这项工作，因为这似乎需要大量的工作和测试工作.

All in all, I hope the outcoming effect is worth the work as it seems to be a lot of work and testing effort.

这篇关于带按钮的自定义视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！