稳扎稳打Silverlight(5) - 2.0控件之ListBox, MediaElement, MultiScaleImage, PasswordBox, ProgressBar, RadioButton

作者：webabcd

介绍
Silverlight 2.0 控件一览：ListBox, MediaElement, MultiScaleImage, PasswordBox, ProgressBar, RadioButton

在线DEMO
http://webabcd.blog.51cto.com/1787395/342779

示例 
1、ListBox.xaml

<UserControl x:Class="Silverlight20.Control.ListBox" 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
        <StackPanel HorizontalAlignment="Left"> 
                 
                <!-- 
                SelectionChanged - ListBox中某个对象被选中后所触发的事件 
                --> 
                <ListBox Margin="5" Width="200" Height="100" SelectionChanged="ListBox_SelectionChanged"> 
                        <ListBoxItem Content="ListBoxItem01" /> 
                        <ListBoxItem Content="ListBoxItem02" /> 
                        <ListBoxItem Content="ListBoxItem03" /> 
                        <ListBoxItem Content="ListBoxItem04" /> 
                        <ListBoxItem Content="ListBoxItem05" /> 
                        <ListBoxItem Content="ListBoxItem06" /> 
                        <ListBoxItem Content="ListBoxItem07" /> 
                        <ListBoxItem Content="ListBoxItem08" /> 
                        <ListBoxItem Content="ListBoxItem09" /> 
                        <ListBoxItem Content="ListBoxItem10" /> 
                </ListBox> 
                 
                <!-- 
                ListBox中可以包含任何对象 
                --> 
                <ListBox Margin="5" Width="200"> 
                        <TextBlock Text="TextBlock" /> 
                        <TextBox Text="TextBox" /> 
                        <Button Content="Button" /> 
                </ListBox> 
                 
        </StackPanel> 
</UserControl>

ListBox.xaml.cs

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Net; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Documents; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Animation; 
using System.Windows.Shapes; 
 
using System.Windows.Browser; 
 
namespace Silverlight20.Control 
{ 
        public partial class ListBox : UserControl 
        { 
                public ListBox() 
                { 
                        InitializeComponent(); 
                } 
 
                private void ListBox_SelectionChanged(object sender, SelectionChangedEventArgs e) 
                { 
                        // ListBox.SelectedItem - ListBox中被选中的对象 
 
                        var lst = sender as System.Windows.Controls.ListBox; 
 
                        MessageBox.Show( 
                                ((System.Windows.Controls.ListBoxItem)lst.SelectedItem).Content + " 被单击了", 
                                "提示", 
                                MessageBoxButton.OK); 
                } 
        } 
}

2、MediaElement.xaml

<UserControl x:Class="Silverlight20.Control.MediaElement" 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
        <StackPanel HorizontalAlignment="Center"> 
                 
                <!-- 
                Source - 视频路径 
                AutoPlay - 是否自动播放 
                --> 
                <MediaElement x:Name="mediaElement" Height="250" AutoPlay="False" 
                                        Source="/Silverlight20;component/Video/Demo.wmv"    /> 
                 
                <StackPanel Orientation="Horizontal" HorizontalAlignment="Center"> 
                        <ToggleButton x:Name="play" Content="播放" Margin="5" Click="play_Click" /> 
                        <ToggleButton x:Name="mute" Content="静音" Margin="5" Click="mute_Click" /> 
                </StackPanel> 
        </StackPanel> 
</UserControl>

MediaElement.xaml.cs

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Net; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Documents; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Animation; 
using System.Windows.Shapes; 
 
namespace Silverlight20.Control 
{ 
        public partial class MediaElement : UserControl 
        { 
                public MediaElement() 
                { 
                        InitializeComponent(); 
                } 
 
                void play_Click(object sender, RoutedEventArgs e) 
                { 
                        var tb = sender as System.Windows.Controls.Primitives.ToggleButton; 
                        if (tb.IsChecked == true) 
                        { 
                                tb.Content = "暂停"; 
 
                                // MediaElement.Play() - 播放视频 
                                this.mediaElement.Play(); 
                        } 
                        else 
                        { 
                                tb.Content = "播放"; 
 
                                // MediaElement.Pause() - 暂停视频 
                                // MediaElement.Stop() - 停止视频 
                                this.mediaElement.Pause(); 
                        } 
                } 
 
                void mute_Click(object sender, RoutedEventArgs e) 
                { 
                        var tb = sender as System.Windows.Controls.Primitives.ToggleButton; 
                        if (tb.IsChecked == true) 
                        { 
                                tb.Content = "有声"; 
 
                                // MediaElement.IsMuted - 是否静音 
                                // MediaElement.Volume - 声音大小（0 - 1） 
                                this.mediaElement.IsMuted = true; 
                        } 
                        else 
                        { 
                                tb.Content = "静音"; 
                                this.mediaElement.IsMuted = false; 
                        } 
                } 
        } 
}

3、MultiScaleImage.xaml

<UserControl x:Class="Silverlight20.Control.MultiScaleImage" 
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
        <StackPanel HorizontalAlignment="Left"> 
                 
                <MultiScaleImage x:Name="msi" Width="400" Height="300"></MultiScaleImage> 
                 
        </StackPanel> 
</UserControl>

MultiScaleImage.xaml.cs（支持放大/缩小/拖动/滚轮之类的，摘自Deep Zoom Composer生成的代码）

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Net; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Documents; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Animation; 
using System.Windows.Shapes; 
 
namespace Silverlight20.Control 
{ 
        public partial class MultiScaleImage : UserControl 
        { 
                // 
                // Based on prior work done by Lutz Gerhard, Peter Blois, and Scott Hanselman 
                // 
                Point lastMousePos = new Point(); 
 
                double _zoom = 1; 
                bool mouseButtonPressed = false; 
                bool mouseIsDragging = false; 
                Point dragOffset; 
                Point currentPosition; 
 
                public double ZoomFactor 
                { 
                        get { return _zoom; } 
                        set { _zoom = value; } 
                } 
 
                public MultiScaleImage() 
                { 
                        InitializeComponent(); 
 
                        // 
                        // We are setting the source here, but you should be able to set the Source property via 
                        // 
                        this.msi.Source = new DeepZoomImageTileSource(new Uri("/DeepZoomImages/dzc_output.xml", UriKind.Relative)); 
 
                        // 
                        // Firing an event when the MultiScaleImage is Loaded 
                        // 
                        this.msi.Loaded += new RoutedEventHandler(msi_Loaded); 
 
                        // 
                        // Firing an event when all of the images have been Loaded 
                        // 
                        this.msi.ImageOpenSucceeded += new RoutedEventHandler(msi_ImageOpenSucceeded); 
 
                        // 
                        // Handling all of the mouse and keyboard functionality 
                        // 
                        this.MouseMove += delegate(object sender, MouseEventArgs e) 
                        { 
                                if (mouseButtonPressed) 
                                { 
                                        mouseIsDragging = true; 
                                } 
                                this.lastMousePos = e.GetPosition(this.msi); 
                        }; 
 
                        this.MouseLeftButtonDown += delegate(object sender, MouseButtonEventArgs e) 
                        { 
                                mouseButtonPressed = true; 
                                mouseIsDragging = false; 
                                dragOffset = e.GetPosition(this); 
                                currentPosition = msi.ViewportOrigin; 
                        }; 
 
                        this.msi.MouseLeave += delegate(object sender, MouseEventArgs e) 
                        { 
                                mouseIsDragging = false; 
                        }; 
 
                        this.MouseLeftButtonUp += delegate(object sender, MouseButtonEventArgs e) 
                        { 
                                mouseButtonPressed = false; 
                                if (mouseIsDragging == false) 
                                { 
                                        bool shiftDown = (Keyboard.Modifiers & ModifierKeys.Shift) == ModifierKeys.Shift; 
 
                                        ZoomFactor = 2.0; 
                                        if (shiftDown) ZoomFactor = 0.5; 
                                        Zoom(ZoomFactor, this.lastMousePos); 
                                } 
                                mouseIsDragging = false; 
                        }; 
 
                        this.MouseMove += delegate(object sender, MouseEventArgs e) 
                        { 
                                if (mouseIsDragging) 
                                { 
                                        Point newOrigin = new Point(); 
                                        newOrigin.X = currentPosition.X - (((e.GetPosition(msi).X - dragOffset.X) / msi.ActualWidth) * msi.ViewportWidth); 
                                        newOrigin.Y = currentPosition.Y - (((e.GetPosition(msi).Y - dragOffset.Y) / msi.ActualHeight) * msi.ViewportWidth); 
                                        msi.ViewportOrigin = newOrigin; 
                                } 
                        }; 
 
                        new MouseWheelHelper(this).Moved += delegate(object sender, MouseWheelEventArgs e) 
                        { 
                                e.Handled = true; 
                                if (e.Delta > 0) 
                                        ZoomFactor = 1.2; 
                                else 
                                        ZoomFactor = .80; 
 
                                Zoom(ZoomFactor, this.lastMousePos); 
                        }; 
                } 
 
                void msi_ImageOpenSucceeded(object sender, RoutedEventArgs e) 
                { 
                        //If collection, this gets you a list of all of the MultiScaleSubImages 
                        // 
                        //foreach (MultiScaleSubImage subImage in msi.SubImages) 
                        //{ 
                        //        // Do something 
                        //} 
                } 
 
                void msi_Loaded(object sender, RoutedEventArgs e) 
                { 
                        // Hook up any events you want when the image has successfully been opened 
                } 
 
                public void Zoom(double zoom, Point pointToZoom) 
                { 
                        Point logicalPoint = this.msi.ElementToLogicalPoint(pointToZoom); 
                        this.msi.ZoomAboutLogicalPoint(zoom, logicalPoint.X, logicalPoint.Y); 
                } 
 
                /* 
                 *    Sample event handlerrs tied to the Click of event of various buttons for    
                 *    showing all images, zooming in, and zooming out! 
                 *    
                private void ShowAllClick(object sender, RoutedEventArgs e) 
                { 
                        this.msi.ViewportOrigin = new Point(0, 0); 
                        this.msi.ViewportWidth = 1; 
                        ZoomFactor = 1; 
                } 
 
                private void zoomInClick(object sender, RoutedEventArgs e) 
                { 
                        Zoom(1.2, new Point(this.ActualWidth / 2, this.ActualHeight / 2)); 
                } 
 
                private void zoomOutClick(object sender, RoutedEventArgs e) 
                { 
                        Zoom(.8, new Point(this.ActualWidth / 2, this.ActualHeight / 2)); 
                } 
                 * */ 
        } 
}

未完待续>>

OK
[源码下载]

     本文转自webabcd 51CTO博客，原文链接：http://blog.51cto.com/webabcd/342827，如需转载请自行联系原作者