Opening a Local File from a Silverlight Application

1. Problem

You need to select a local file on the client machine and upload it to the server.

2. Solution

Create an instance of the OpenFileDialog class, and display it to the user with the ShowDialog method. You can send the files to the server for processing, but we recommend that you let the user know anytime a file is sent to the server.

3. How It Works

The OpenFileDialog class displays a standard Windows, Mac, or Linux open file dialog depending on the platform that allows users to browse to files anywhere on their system. This dialog box is not available if running in Full Screen Mode.

The OpenFileDialog class has Filter and FilterIndex properties, which allow you to set the file filter in much the same way a .NET developer would do in a WPF or Windows Forms application. You can specify the types of files you wish to open by specifying Filter like this:

fileDlg.Filter = "Tiff Files (*.tif)|*.tif|All Files (*.*)|*.*";

This value suggests that a TIFF file is expected, but the Filter value can be overridden by the user. The format is a description of the filter, such as Tiff Files (*.tif), followed by the filter pattern, such as *.tiff. Each filter option is separated by the pipe symbol. You can also have a more generic Filter, say for all image files, by separating the filter patterns with semicolons, like this:

Image Files(*.BMP;*.JPG;*.GIF)|*.BMP;*.JPG;*.GIF|All files (*.*)|*.*

You can set the FileIndex property to a zero-based index to configure which filter is the default; you can also allow the user to make multiple selections by setting the Multiselect property to true.

The OpenFileDialog class also has a Multiselect property, which defaults to false. When set to true, it allows the user to select multiple files. The ShowDialog method displays the dialog shown in Figure 1.

Figure 1. The Open File dialog in Windows

4. The Code

The sample code for this recipe has a button that allows the user to select files in the local file system, including instances where Multiselect is set to true. The files that are selected are listed in a ListBox control.

When the user clicks the Select Files button in the test application, an Open File dialog appears with a filter configured for TIFF files, as shown in Figure 1. Figure 2 shows the test application UI after the user selects several files and clicks the Open button in the dialog.

Figure 2. Recipe 4's test application UI after selecting files using the Open File dialog

Clicking Open in the operating system's Open File dialog causes the ShowDialog method to return true. Clicking Cancel causes the method to return false. When it returns true, you can use the Count() method on the OpenFileDialog.Files collection to determine the number of files returned.

To iterate over the selected files, you can use a foreach loop that steps through the Files collection. In the sample code, you simply add the filename to a ListBoxFiles collection stores FileDialogFileInfo objects that contain two methods, OpenRead and OpenText. The OpenRead method returns a StreamStreamReader class. The OpenText method returns a StreamReader with UTF-8 encoding that reads an existing text file. Listings 1 and 2 show the code for the Recipe 2-4 test application. object. However, the object that allows a developer to read the file using a

Listing 1. Recipe 4's MainPage.xaml File

<UserControl x:Class="Ch02_ProgrammingModel.Recipe2_4.MainPage" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="400"> <Grid x:Name="LayoutRoot"> <Grid.Background> <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"> <GradientStop Color="#FF000000"/> <GradientStop Color="#FFFFFFFF" Offset="1"/> </LinearGradientBrush> </Grid.Background> <Grid.RowDefinitions> <RowDefinition Height="0.117*"/> <RowDefinition Height="0.79*"/> <RowDefinition Height="0.093*"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="0.058*"/> <ColumnDefinition Width="0.252*"/> <ColumnDefinition Width="0.64*"/> <ColumnDefinition Width="0.05*"/> </Grid.ColumnDefinitions> <Button Height="28.9" HorizontalAlignment="Stretch" Margin="8,8,11,0" VerticalAlignment="Top" Width="81.8" Grid.Column="1" Grid.Row="1" Content="Select Files" d:LayoutOverrides="Height" x:Name="ButtonSelectFiles" Click="ButtonSelectFiles_Click"/> <TextBlock Margin="4,2,2,2" Grid.Column="1" Grid.Row="2" Text="Status" TextWrapping="Wrap" Grid.ColumnSpan="2" x:Name="StatusLabel"/> <Border Grid.Column="2" Grid.Row="1" Margin="0,0,0,0" CornerRadius="12"> <Border.Background> <LinearGradientBrush EndPoint="0.916999995708466,0.0890000015497208" StartPoint="−0.0489999987185001,2.12400007247925"> <GradientStop Color="#FF1D351E"/> <GradientStop Color="#FF1D351E" Offset="1"/> <GradientStop Color="#FFB7D8BA" Offset="0.50900000333786011"/> </LinearGradientBrush> </Border.Background> <ListBox x:Name="FileList" Foreground="#FF000000" Height="217" Width="236" Opacity="1"/> </Border> </Grid> </UserControl>

Listing 2. Recipe 4's MainPage.xaml.cs Class File

using System.Linq; using System.Windows; using System.Windows.Controls; namespace Ch02_ProgrammingModel.Recipe2_4 { public partial class MainPage : UserControl { public MainPage() { InitializeComponent(); } private void ButtonSelectFiles_Click(object sender, RoutedEventArgs e) { //Create dialog OpenFileDialog fileDlg = new OpenFileDialog(); //Set file filter as desired fileDlg.Filter = "Tiff Files (*.tif)|*.tif|All Files (*.*)|*.*"; fileDlg.FilterIndex = 1; //Allow multiple files to be selected (false by default) fileDlg.Multiselect = true; //Show Open File Dialog if (true == fileDlg.ShowDialog()) { StatusLabel.Text = fileDlg.Files.Count() + " file(s) selected"; foreach (var file in fileDlg.Files) { FileList.Items.Add(file.Name); } } } } }