WP7有约(七):实现铃声设置的播放图标的效果
2011-12-07 23:10
393 查看
WP7有约(七):实现铃声设置的播放图标的效果
Written by Allen Lee
sjcxyf同学通过站内消息提到这样一个问题:
我现在想做一个功能就是当ListPicker弹出全屏幕的时候每一项前面是一个播放图片,后面是音乐名称,然后我点击前面的播放的时候播放当前的音乐,不让他选择这一项的值并返回 要选择后面的字之后才返回 就是像Phone 7真机里面设置铃声那种效果怎么做?
我们来看一个山寨版的铃声设置,如图1所示,无论用户单击铃声名字还是它左边那个播放图标,都会关闭ListPicker页面。sjcxyf同学想要的效果是单击播放图标将会播放对应的铃声,而单击铃声名字才是确认选择。问题是,即使你单击铃声下面的空白地方,ListPicker页面也会关闭,为什么?
图 1 山寨版铃声设置
查看ListPickerPage.xaml.cs文件,我们将会发现ListPicker页面的ListBox控件添加了Tap事件处理程序,如代码1所示。从中我们不难看出,ListPicker页面表现出来的行为是预期的,即在单选模式下,单击ListBox控件里的选项或者空白地方将会关闭ListPicker页面。于是,sjcxyf同学的需求可以重新描述成在用户单击播放图标时防止ListBox控件的事件处理程序被执行,但是,怎样才能做到?
代码 1 ListBox控件的Tap事件处理程序
Silverlight支持一种叫做路由事件(routed event)的概念,这种事件的触发会从子元素沿着对象树向上传递给各个父元素,直至到达根元素为止。并非所有事件都是路由事件,但Tap事件刚好就是路由事件,换句话说,当用户单击播放图标时,ListBox控件作为播放图标的父元素,虽然不是直接包含的父元素,也能感知传递过来的Tap事件。于是,sjcxyf同学的需求可以重新描述成防止播放图标的Tap事件向上传递给父元素,但是,怎样才能做到?
Tap事件处理程序的第二个参数有一个Handled属性,这个属性正是用来处理这种需求的。假设播放图标是一个Image控件,如代码2所示,我们可以为它添加一个Tap事件处理程序,并在里面把Handled属性设为true,如代码3所示,这样,Silverlight的事件系统将会停止把Tap事件向上传递给各个父元素。
代码 2 播放图标的XAML代码
代码 3 播放图标的Tap事件处理程序
不过,当用户单击播放图标时,当前选中的铃声也会发生改变,这显然不是Windows Phone 7的铃声设置的做法。我们希望单击播放图标时只是播放铃声,但不改变当前选中的铃声,如果此时按Back键返回,铃声设置将会维持原状。这个效果的实现方式和前面的一样,只不过这次换成了MouseLeftButtonUp事件,因此我把它留给你课后实践一下。
Written by Allen Lee
sjcxyf同学通过站内消息提到这样一个问题:
我现在想做一个功能就是当ListPicker弹出全屏幕的时候每一项前面是一个播放图片,后面是音乐名称,然后我点击前面的播放的时候播放当前的音乐,不让他选择这一项的值并返回 要选择后面的字之后才返回 就是像Phone 7真机里面设置铃声那种效果怎么做?
我们来看一个山寨版的铃声设置,如图1所示,无论用户单击铃声名字还是它左边那个播放图标,都会关闭ListPicker页面。sjcxyf同学想要的效果是单击播放图标将会播放对应的铃声,而单击铃声名字才是确认选择。问题是,即使你单击铃声下面的空白地方,ListPicker页面也会关闭,为什么?
图 1 山寨版铃声设置
查看ListPickerPage.xaml.cs文件,我们将会发现ListPicker页面的ListBox控件添加了Tap事件处理程序,如代码1所示。从中我们不难看出,ListPicker页面表现出来的行为是预期的,即在单选模式下,单击ListBox控件里的选项或者空白地方将会关闭ListPicker页面。于是,sjcxyf同学的需求可以重新描述成在用户单击播放图标时防止ListBox控件的事件处理程序被执行,但是,怎样才能做到?
代码 1 ListBox控件的Tap事件处理程序
private void OnPickerTapped(object sender, System.Windows.Input.GestureEventArgs e) { // We listen to the tap event because SelectionChanged does not fire if the user picks the already selected item. // Only close the page in Single Selection mode. if (SelectionMode == SelectionMode.Single) { // Commit the value and close SelectedItem = Picker.SelectedItem; ClosePickerPage(); } }
Silverlight支持一种叫做路由事件(routed event)的概念,这种事件的触发会从子元素沿着对象树向上传递给各个父元素,直至到达根元素为止。并非所有事件都是路由事件,但Tap事件刚好就是路由事件,换句话说,当用户单击播放图标时,ListBox控件作为播放图标的父元素,虽然不是直接包含的父元素,也能感知传递过来的Tap事件。于是,sjcxyf同学的需求可以重新描述成防止播放图标的Tap事件向上传递给父元素,但是,怎样才能做到?
Tap事件处理程序的第二个参数有一个Handled属性,这个属性正是用来处理这种需求的。假设播放图标是一个Image控件,如代码2所示,我们可以为它添加一个Tap事件处理程序,并在里面把Handled属性设为true,如代码3所示,这样,Silverlight的事件系统将会停止把Tap事件向上传递给各个父元素。
代码 2 播放图标的XAML代码
<Image Source="/play.png" Stretch="None" HorizontalAlignment="Left" VerticalAlignment="Center" Tap="Image_Tap" Margin="0,0,12,0"/>
代码 3 播放图标的Tap事件处理程序
private void Image_Tap(object sender, System.Windows.Input.GestureEventArgs e) { // 添加播放音乐的代码 e.Handled = true; }
不过,当用户单击播放图标时,当前选中的铃声也会发生改变,这显然不是Windows Phone 7的铃声设置的做法。我们希望单击播放图标时只是播放铃声,但不改变当前选中的铃声,如果此时按Back键返回,铃声设置将会维持原状。这个效果的实现方式和前面的一样,只不过这次换成了MouseLeftButtonUp事件,因此我把它留给你课后实践一下。
相关文章推荐
- Android 4.3实现类似iOS在音乐播放过程中如果有来电则音乐声音渐小铃声渐大的效果
- Android 4.3实现类似iOS在音乐播放过程中如果有来电则音乐声音渐小铃声渐大的效果
- Android 4.3实现类似iOS在音乐播放过程中如果有来电则音乐声音渐小铃声渐大的效果
- iOS 实现后台 播放音乐声音 AVAudioPlayer 以及铃声设置(循环播放震动)
- WP7有约(八):在ListPicker控件的选择页面上播放铃声
- Android 4.3实现类似iOS在音乐播放过程中如果有来电则音乐声音渐小铃声渐大的效果(二)
- UItabBar设置的一些设置 合一些效果实现 设置badgeValue的方法封装
- UIScrollView 实现广告栏的无限轮播(可设置自动播放时间)
- Android高级控件(四)——VideoView 实现引导页播放视频欢迎效果,超级简单却十分的炫酷
- 利用DecorView实现播放视频开灯/关灯效果和仿QQ消息提示框
- [WP7]实现类似tree效果
- JS特效实现图片自动播放并可控的效果
- html5实现乐器的播放效果
- 顺序播放效果js实现小窍门
- WPF技术触屏上的应用系列(三): 视频播放器的使用及视频播放、播放、暂停、可拖动播放进度效果实现
- 实现幻灯片播放图片效果
- 金蝶EAS,代码实现窗口最大化,按钮可用,图标设置
- Android图片加载神器之Fresco-更灵活的设置加载特效[Java代码实现XML效果]
- Activity透明/半透明效果的设置transparent(两种实现方法)
- 滑屏自动播放效果实现步骤