专栏首页dino.c的专栏[Silverlight]用ListBox实现SlideShow

[Silverlight]用ListBox实现SlideShow

用Silverlight2整整一年了,上个星期公司全面转去Silverlight3,作为纪念就把用SL2写的最后一个东西发出来吧。效果如下:

只是一个很简单的程序,甚至懒得写到Generic.xaml中,直接使用UserControl。而用ListBox做也是为了图方便,ListBox中GetContainerForItemOverride()方法能很方便地将Object转换成DependencyObject.不必要修改ListBox,只需要给它一个样式即可.

1        <Style TargetType="ListBox" x:Key="ListBoxStyle">
 2            <Setter Property="Template">
 3                <Setter.Value>
 4                    <ControlTemplate TargetType="ListBox">
 5                        <Border Loaded="OnBorderLoaded">
 6                            <Border.Resources>
 7                                <Storyboard x:Key="StoryBoardCenter" Duration="0:0:0.5">
 8                                    <DoubleAnimationUsingKeyFrames  Duration="0:0:0.5" Storyboard.TargetName="ItemsPresenter" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(TranslateTransform.X)">
 9                                        <SplineDoubleKeyFrame  KeySpline="0.1,0.6,0.6,1"  Value="1"/>
10                                    </DoubleAnimationUsingKeyFrames>
11                                </Storyboard>
12                            </Border.Resources>
13                            <ScrollViewer x:Name="ScrollViewer" Padding="0" 
14                                              HorizontalScrollBarVisibility="Hidden"
15                                              VerticalScrollBarVisibility="Hidden"
16                          BorderThickness="0">
17                                <ItemsPresenter x:Name="ItemsPresenter">
18                                    <ItemsPresenter.RenderTransform>
19                                        <TransformGroup>
20                                            <TranslateTransform  X="0"/>
21                                        </TransformGroup>
22                                    </ItemsPresenter.RenderTransform>
23                                </ItemsPresenter>
24                            </ScrollViewer>
25                        </Border>
26                    </ControlTemplate>
27                </Setter.Value>
28            </Setter>
29            <Setter Property="ItemsPanel">
30                <Setter.Value>
31                    <ItemsPanelTemplate>
32                        <StackPanel Orientation="Horizontal"/>
33                    </ItemsPanelTemplate>
34                </Setter.Value>
35            </Setter>
36        </Style>
37
38
39
40     <Style TargetType="ListBoxItem" x:Key="ListBoxItemStyle">
41            <Setter Property="Template">
42                <Setter.Value>
43                    <ControlTemplate TargetType="ListBoxItem">
44                        <Grid  Loaded="OnGridLoaded">
45                            <Border  >
46                                <Grid>
47                                    <ContentPresenter    x:Name="contentPresenter"
48            Content="{TemplateBinding Content}"
49            ContentTemplate="{TemplateBinding ContentTemplate}"
50           />
51
52
53                                </Grid>
54                            </Border>
55                        </Grid>
56
57                    </ControlTemplate>
58                </Setter.Value>
59            </Setter>
60        </Style>

之後只要想方法觸發StoryBoardCenter這個StoryBoard了,當然還需要修改它的Value,代碼就不貼出了,下面有下載(動畫效果寫得比較簡單,見笑了)。

完成後的調用方法比較簡單:

1    <Grid x:Name="LayoutRoot">
2        <local:SliderControl   x:Name="sliderControl">
3            <local:SliderControl.ItemTemplate>
4                <DataTemplate>
5                    <Image Source="{Binding Source}"  Stretch="UniformToFill"/>
6                </DataTemplate>
7            </local:SliderControl.ItemTemplate>
8        </local:SliderControl>
9    </Grid>
1  public MainPage()
 2        {
 3            InitializeComponent();
 4
 5            List<AdObject> list = new List<AdObject>();
 6            AdObject obj = new AdObject { Source = "http://www.asp.net/AJAX/AjaxControlToolkit/Samples/SlideShow/images/Water%20lilies.jpg" };
 7            list.Add(obj);
 8             obj = new AdObject { Source = "http://www.asp.net/AJAX/AjaxControlToolkit/Samples/SlideShow/images/Sunset.jpg" };
 9            list.Add(obj);
10             obj = new AdObject { Source = "http://www.asp.net/AJAX/AjaxControlToolkit/Samples/SlideShow/images/Winter.jpg" };
11            list.Add(obj);
12             obj = new AdObject { Source = "http://www.asp.net/AJAX/AjaxControlToolkit/Samples/SlideShow/images/Blue%20hills.jpg" };
13            list.Add(obj);
14            sliderControl.ItemsSource = list;
15        }

OK,完成了。

源代碼

PS:其实不一定要用ListBox,用ItemsControl就可以了,之所以選用ListBox是因為我貪圖ListBox一次只選中一個的特性。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • [UWP]CompositionLinearGradientBrush加BlendEffect,双倍的快乐

    上一篇文章介绍了CompositionLinearGradientBrush的基本用法, 这篇文章再结合BlendEffec介绍一些更复杂的玩法。

    dino.c
  • [UWP 自定义控件]了解模板化控件(10):原则与技巧

    一个控件是否好用,很大一部分取决于名称。好的命名能让使用者用起来更得心应手,坏的命名只会让代码更混淆。下面总结了UWP控件命名的一般模式:

    dino.c
  • [WPF自定义控件库]以Button为例谈谈如何模仿Aero2主题

    除了以外观为卖点的控件库,WPF的控件库都默认使用“素颜”的外观,然后再提供一些主题包。这样做的最大好处是可以和原生控件或其它控件库兼容,而且对于大部分人来说模...

    dino.c
  • package reflect

    reflect包实现了运行时反射,允许程序操作任意类型的对象。典型用法是用静态类型interface{}保存一个值,通过调用TypeOf获取其动态类型信息,该函...

    李海彬
  • [705]debian设置分辨率

    在几乎所有的虚拟机安装的Linux上都有一个问题,就是安装后分辨率无法调整, 这个对于在虚拟上面操作体验非常差,好在有命令行可以解决这个问题。但是无法保存。

    周小董
  • 数据库系统简明教程 第三章关系数据库 课后习题

    题目链接http://blog.csdn.net/cnlht/article/details/13020739#comments

    week
  • c++ LeetCode (网易面试题和链表以及树篇) 五道算法例题代码详解(三)

    为了表示给定链表中的环,我们使用整数 pos 来表示链表尾连接到链表中的位置(索引从 0 开始)。 如果 pos 是 -1,则在该链表中没有环。

    徐飞机
  • phpMyAdmin 4.8.x(最新版) 本地文件包含漏洞利用

    本文转载自:phpMyAdmin 4.8.x LFI Exploit -http://blog.vulnspy.com/2018/06/21/phpMyAdmi...

    Ambulong
  • 国标GB28181流媒体服务器分辨率会导致视频无法播放吗?

    今天我们继续解答用户问题,有用户问我分辨率不对的话,会不会导致视频无法播放,这个问题是可能存在的,分辨率的设定还会影响视频的播放流畅度、清晰度等。那么当分辨率设...

    EasyNVR
  • 渗透一个网站,你该怎么做?

    想必大家一定过了一个红包满满的春节了,或许也有人利用这几天的时间继续学习提升,最近就会有群里的朋友问我,渗透一个网站怎么做,我说我在公众号里给大家一起说...

    网e渗透安全部

扫码关注云+社区

领取腾讯云代金券