需求:制作一组RadioButton,像下面这样的效果:

【MVVM】要显示一组RadioButton按钮,想法是Controller层联网获取到数据后,将数据进行处理,然后加到一个ObservableCollection集合中(或者List集合),然后前台准备一个列表控件,绑定这个集合。

最初想法是前台使用一个ItemsControl控件,然后设置它的DataTemplate,大致如下:

<ItemsControl x:Name="areaIC" ItemsSource="{Binding AreaNumList}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<RadioButton Content="{Binding areaVal}" GroupName="area" Style="{StaticResource myRadioButton2}"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</<ItemsControl>

然后,运行后看不到这组按钮,但可以点击。去掉Style属性就只能显示RadioButton左边的圆圈,右边文字Content内容为空,而且按钮组无法切换,问题很多。。。。。

搜了一下解决方案,看到下面这个:
http://stackoverflow.com/questions/5891924/wpf-mvvm-radio-buttons-on-itemscontrol

根据老外的建议,应该使用ListBox而不是ItemsControl ,并且还得设置各种依赖属性的数据源,最后改为如下:

 <ListBox x:Name="areaLB" ItemsSource="{Binding AreaNumList}" SelectedItem="{Binding SelectedItem}" BorderThickness="0" Background="White">
<ListBox.ItemTemplate>
<DataTemplate>
<RadioButton x:Name="radioBtn" FontSize="14" GroupName="area" Style="{StaticResource myRadioButton2}">
<RadioButton.IsChecked>
<Binding Path="IsSelected" RelativeSource="{RelativeSource AncestorType=ListBoxItem}" Mode="TwoWay" />
</RadioButton.IsChecked>
<RadioButton.Content>
<Binding Path="Content" RelativeSource="{RelativeSource AncestorType=ListBoxItem}" Mode="TwoWay" />
</RadioButton.Content>
</RadioButton>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

【WPF】MVVM前台绑定一组RadioButton按钮的更多相关文章

  1. wpf纯前台绑定

    <Window x:Class="Example1.MainWindow" ... xmlns:local="clr-namespace:Example1" ...

  2. WPF采用MVVM模式(绑定:纯前台、命令:触发器绑定命令)

    MVVM绑定 view-viewModel-model,模型介绍省略,就是创建类,添加字段封装属性.注:控件的绑定只能绑定到属性上,不能绑定到字段上: 接下来就是代码 (view): <Wind ...

  3. WPF MVVM从入门到精通6:RadioButton等一对多控件的绑定

    原文:WPF MVVM从入门到精通6:RadioButton等一对多控件的绑定   WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM ...

  4. WPF MVVM从入门到精通5:PasswordBox的绑定

    原文:WPF MVVM从入门到精通5:PasswordBox的绑定   WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM从入门到精通 ...

  5. WPF 关于ComboBox在前台绑定XML数据的一些方法,使用XML数据提供器 XmlDataProvider

    关于使用 数据提供器:XmlDataProvider 的一些问题,以及在WPF中是如何使用的一些介绍,还有踩到的一些坑,希望其他和我碰到一样问题的,可以更快的解决. 首先,要求是 在WPF 的前台代码 ...

  6. 【.NET6+WPF】WPF使用prism框架+Unity IOC容器实现MVVM双向绑定和依赖注入

    前言:在C/S架构上,WPF无疑已经是"桌面一霸"了.在.NET生态环境中,很多小伙伴还在使用Winform开发C/S架构的桌面应用.但是WPF也有很多年的历史了,并且基于MVVM ...

  7. WPF之Treeview实现MVVM双向绑定

    Treeview分别有两个数据模板HierarchicalDataTemplate(层级数据模板)和DataTemplate(数据模板),分别应用于生成子数据项和普通数据项. 在使用过程中,如果对两个 ...

  8. WPF MVVM从入门到精通8:数据验证

    原文:WPF MVVM从入门到精通8:数据验证 WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM从入门到精通3:数据绑定 WPF M ...

  9. WPF MVVM从入门到精通7:关闭窗口和打开新窗口

    原文:WPF MVVM从入门到精通7:关闭窗口和打开新窗口 WPF MVVM从入门到精通1:MVVM模式简介 WPF MVVM从入门到精通2:实现一个登录窗口 WPF MVVM从入门到精通3:数据绑定 ...

随机推荐

  1. hdu 4031(树状数组+辅助数组)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4031 Attack Time Limit: 5000/3000 MS (Java/Others)    ...

  2. HDUOJ----John

    John Time Limit: 5000/1000 MS (Java/Others)    Memory Limit: 65535/32768 K (Java/Others)Total Submis ...

  3. Numpy库应用实例——GPS定位

    背景介绍 定位系统 GPS全球定位系统(Global Positioning System)以GPS系统为例介绍卫星定位的计算方法 GPS定位的基本原理 GPS定位的基本原理是根据高速运动卫星的 ...

  4. JavaScript:用JS实现加载页面前弹出模态框

    用JS实现加载页面前弹出模态框 主要的JavaScript 代码是: <script> //加载模态框 $('#myModal').modal(); $(document).ready(f ...

  5. Javascript-js实现多线程

    原文地址:https://www.cnblogs.com/haodawang/articles/5850822.html 在讲之前,大家都知道js是基于单线程的,而这个线程就是浏览器的js引擎.首先来 ...

  6. List Set Map以及子接口用法总结(转)

    Collection ├List│├LinkedList│├ArrayList│└Vector│ └Stack└SetMap├Hashtable├HashMap └WeakHashMap list 和 ...

  7. map+pair Bayan 2015 Contest Warm Up D题

    D. CGCDSSQ time limit per test 2 seconds memory limit per test 256 megabytes input standard input ou ...

  8. 深入Javascript中apply、call、bind

    最近在看一下node package的源码,发现很多里面都包含了function这个对象的apply.call.bind这三个方法,于是想拿出来再看看.. apply.call 在 javascrip ...

  9. laravel中间件简单使用

    laravel内置了一个中间件来验证用户是否经过认证,如果用户没有经过认证,中间件会将用户重定向到登录页面,否则如果用户经过认证,中间件就会允许请求继续往前进入下一步操作. 当然,除了认证之外,中间件 ...

  10. Excel中不常用的一些公式用法

    INDIRECT函数 http://baike.baidu.com/view/3222185.htm 用于使用单元格内容拼凑公式的情况. 1.采用  [工作表名]!单元格名  的形式读取内容: 2.所 ...