Flex4 DataGrid中如何嵌入RadioButton

在Flex开发中，DataGrid组件可以说是最常用的数据展示控件之一。不过，当我们需要在表格行前加上一个RadioButton来实现单选功能时，事情就没那么简单了——因为DataGrid本身并不直接支持RadioButton的选择逻辑。下面就来聊聊具体的实现思路。

DataGrid代码

先来看DataGrid部分的配置。这里定义了一个名为viewDg的DataGrid，宽度和高度都设为100%，字体使用微软雅黑，同时关闭了水平滚动条并隐藏了边框。数据源绑定到viewList这个集合上。

在列定义部分，我们通过来配置各列。第一列比较特殊，宽度只占整体宽度的2%，并且不允许用户调整大小，这一列用来放置RadioButton，因此指定了自定义的itemRenderer为RadioButtonGridItemRenderer。后面三列分别显示名称、地名和URL，对应的数据字段分别是xysj02、xysj02name和xysj04，最后一列是备注，对应xysj05字段。

这里面有个细节值得注意：宽度的计算用了{wid*0.02}这样的表达式，意味着整个表格的宽度分配需要配合wid这个变量来动态计算，这样布局会更灵活。

MXML页面

接下来是关键的GridItemRenderer部分。这里定义了一个继承自GridItemRenderer的组件，内部包含一个RadioButton控件。

在Script代码块中，重写了prepare方法。这个方法在GridItemRenderer每次被重用时都会调用，是更新UI状态的理想位置。核心逻辑很清晰：首先获取当前DataGrid的选中项集合，然后判断当前行数据是否在选中项集合中。如果在，就把RadioButton的selected属性设为true，否则设为false。

需要注意的一点是，RadioButton的enabled属性被设置为false，也就是禁用了用户交互。为什么这么做？因为RadioButton在这里只作为一个视觉指示器，用来反映当前行的选中状态，真正的选择逻辑是通过DataGrid的行选择机制来控制的。这样既保持了UI的一致性，又避免了用户直接操作RadioButton导致的状态混乱。

从实现角度来看，这种做法其实挺巧妙的——利用RadioButton的视觉反馈来增强用户对行选择状态的感知，同时又不破坏DataGrid本身的选择机制。在实际项目中，这种方案既简单又高效，尤其是当表格数据量较大时，性能表现也很不错。