如何制作跟踪选中的单选按钮的选择边框?

时间:2011-02-19 12:00:05

标签: android android-layout

我有一组带有自定义样式的RadioButton。我想在当前选中的按钮周围显示边框。这应该很容易使用XML,但现在我想要边框动画。如果选中了一个新的单选按钮,边框应该用一个奇特的动画“飞”到新的位置:

+------+
|* btn1| o btn2
+------+

    +------+
 o b|n1  * |tn2
    +------+

        +------+
 o btn1 |* btn2|
        +------+

因此,我决定将边框设置为单独的View对象,因此我可以正确地设置它的动画。问题在于跟踪屏幕上相应单选按钮的位置。

我试图让它在没有动画的情况下首先运行。我当前的尝试看起来像这样(只显示相关属性):

    <RelativeLayout
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true">
        <RadioGroup
            android:id="@+id/radio_group">
            <RadioButton/>
            <RadioButton/>
            <RadioButton/>
        </RadioGroup>
        <View
            android:id="@+id/selection_border"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"/>
    </RelativeLayout>

OnCheckedChangeListener的{​​{1}}中,我通过设置边距来移动选区边框(我可以设置位置,但RadioGroup更难一点):< / p>

RelativeLayout

然而,在初始化时会发生故障。由于尚未进行布局,因此边框的位置设置不正确。似乎不可能立即强制重新布局,并且在布局完成后似乎也无法获得事件。

所有这些麻烦让我相信必须有一种更清洁的方式来实现我想要的东西。有什么好主意吗?

2 个答案:

答案 0 :(得分:1)

我认为最佳方式是将复选框视为图像。检查/未检查两种类型。然后你基本上是在屏幕上移动图像。如果用户鼠标按下您知道已选择的图像区域,则使用TouchEvents和图像处理外观。这很简单,因为现在你只处理图像,画布和标准x,y坐标。

答案 1 :(得分:1)

为了解决你的初始化问题(过去我自己遇到了很多麻烦):如果我需要知道视图的布局何时完成,我在Activity.onCreate()中给它一个runnable然后调用它从View.onSizeChanged()运行。我已经开始使用这种模式了,我发现它非常可靠。你只需要记住,如果新的宽度和高度大于0,并且它们不等于旧的宽度和高度,则只从onSizeChanged()调用runnable。

所以在你的活动中:

public void onCreate() {
    ...
    yourView.setLayoutRunnable(new Runnable() {
        @Override
        public void run() {
            //do post-layout stuff...
        }
    });
    ...
}

并在您看来:

public Runnable layoutRunner;

public void setLayoutRunnable(Runnable runner) {
    layoutRunner = runner;
}

@Override
public void onSizeChanged(int w, int h, int oldw, int oldh) {
    if (w > 0 && h > 0 && (w != oldw || h != oldh)) {
        if (layoutRunner != null) layoutRunner.run();
    }
}

如果您有多个视图需要在完成任务之前完成布局,那么您必须在收到通知时保持计数,以便知道它们何时完成。

关于你的主题,我在我写的游戏中实现了与你的单选按钮概念类似的东西,但我决定从头开始覆盖View来做到这一点。我在一个视图中有一个集合的所有选项,所以我真的替换了RadioGroup视图而不是RadioButton视图。每个选项都有一个值和一个范围。我总是使用文字,但图像也很容易。然后我只是跟踪相对于选项范围的点击和拖动,并将“选择器”移动到定时处理程序(javascript中的la动画)。