SaveFileDialog in Silverlight 3


Introduction:

 

SaveFileDialog was a component that was missing in earlier versions of Silverlight. Thankfully now Silverlight 3 includes this component so that it becomes much easier to save files using this component.

 

SaveFileDialog:

 

To start with, let us create a new Silverlight 3 application using Visual Web Developer 2008.

 

The default code in MainPage.xaml will be seen as follows:

 

<UserControl x:Class="SFDemo.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:DesignWidth="640" d:DesignHeight="480">

  <Grid x:Name="LayoutRoot">

  </Grid>

</UserControl>

 

Replace the <Grid></Grid> tags with <Canvas></Canvas>.

 

Drag and drop TextBox and Button controls from the Toolbox.

 

Configure their properties as shown below:

 

<UserControl x:Class="SFDemo.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:DesignWidth="640" d:DesignHeight="480">

  <Canvas x:Name="LayoutRoot">

<TextBox Name="txtContents" AcceptsReturn="True" Canvas.Left="40" Canvas.Top="10" Width="100" Height="80"></TextBox>

      <Button Name="btnOk" Click="Button_Click" Canvas.Left="40" Canvas.Top="100" Content="OK" ></Button>

  </Canvas>

</UserControl>

 

This will render the UI with a text box and a button with caption Ok. The event handler Button_Click will be auto-generated as a result of the above code.

 

Within this event handler, we will now add code to use the SaveFileDialog component. First, however, you need to add using statements for two namespaces: System.Text and System.IO.

 

using System.IO;

using System.Text;

 

Next, in the event handler for the button, add the following code:

 

private void Button_Click(object sender, RoutedEventArgs e)

{

            SaveFileDialog sd = new SaveFileDialog();

            sd.DefaultExt = ".txt";

            sd.Filter = "Text Files|*.txt|Log Files|*.log|All Files|*.*";

           

 

            bool? dialogResult = sd.ShowDialog();

 

            if (dialogResult == true)

            {

                byte[] contents;

                System.Text.Encoding ascii = Encoding.Unicode;

                contents = ascii.GetBytes(txtContents.Text);

 

                using (Stream fs = (Stream)sd.OpenFile())

                {

                    fs.Write(contents, 0, contents.Length);

                    fs.Close();

                    MessageBox.Show("File successfully saved!");

                }

 

            }

}

 

What has been done here is that an instance of SaveFileDialog is created. Properties of this instance, sd, are then configured. DefaultExt is the property for default extension of the file to be saved. Filter allows you to filter the file extensions and types. Then the dialog is opened through the ShowDialog() method. The return value is stored in a boolean variable, dialogResult. This dialogResult is then checked to see if it is true. If true,  the contents of the text box are retrieved, converted to byte array and then written into the file which was chosen in the SaveFileDialog dialog window. A message box notifies the user of the successful save operation.

 

When you run the application, enter some text in the text box and then click OK. This will open the Save file dialog. Provide a file name in the Save file dialog. After the message box is displayed, close the browser window and test whether the file saved contains the text from the text box.

 

Conclusion: This article demonstrated how to use the SaveFileDialog component.

Next Recommended Readings