WPF 实际应用的小技巧(一)

本文介绍了一种在WPF中使用HeaderedContentControl实现TabItem头部图片切换的方法,仅需一个样式即可完成多种控件的图片切换效果,包括步骤详解及代码示例。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

在做WPF设计的时候遇到了一个问题,tabcontrol的切换。例如下图:

你会怎么做这个控件?

1.写5个tabitem样式?

2.写一个自定义控件?

3?

我们的目标是没有代码,这样怎么能符合我们的目标。

好吧,本人比较懒的写代码,最终发现了一个方法,只用一个样式就能解决所有问题!这个神器就是HeaderedContentControl。

HeaderedContentControl的Header和Content都是object类型的,所以可以实现我们需求的功能。

1.新建一个HeaderedContentControl。

2.创建content的数据模板

3.在模板中添加一个图片

4.给图片的source添加一个绑定。(什么也不用填,直接点确定)

5.回到HeaderedContentControl的页面,对headerTemple做同样的操作。

6.做完以上操作查看下代码,你的代码应该有下图的那些东西。

7.继续编辑HeaderedContentControl的模板。

8.出现模板编辑页面后分别给两个ContentSource命名。

9.看到ContentPresenter1有个contentSource指向header,那么给ContentPresenter2的contentsource指向content

10.给HeaderedContentControl加一个触发器,判断图片的显示个影藏。美工们按照代码敲吧,程序门肯定懂什么意思了。

11.注意,注意!我们研究下下面的代码。

 <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type CheckBox}},Path=IsChecked}" Value="True">

看到AncestorType={x:Type CheckBox}你会疑问怎么是checkbox,其实这边该填写的是上级元素,如果你的是tabitem,那边这边就是tablitem,如果是button,这边就填写button。path则是触发触发器的属性,我的是checkbox,最IsChecked时触发。如果你是tabitem,则是IsSelected时触发。

12.写完这个控件可以使用了。

13.最后一步,分别给HeaderedContentControl的Header和Content赋值。图片路径用绝对路径

 

举一反三:1.到这里就结束了,两张图片的切换下次你有了另一个选择HeaderedContentControl。当你的按钮都是两张图片切换的时候,当你的tabitem

的头部为两张图片切换的时候你都可以用HeaderedContentControl解决。

2.不一定是图片,文字切换,文字和图片的切换等等,HeaderedContentControl都可以满足你。

附tabitem写法

 

自己去做一遍吧,很有用的东西。有什么不懂得可以留言,或者去群里问我。

如果觉得对你有帮助,点个推荐吧!

更多的WPF/SL实战技巧!我们的目标是没有代码!

转载于:https://www.cnblogs.com/WWLB/archive/2012/09/29/2708830.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值