by
kirupa | 31 January 2010
For the first couple
of Silverlight releases, what happened in your
browser stayed in your browser. If you wanted to do
something that went beyond your browser, you needed
to rely on some server-side magic.
Things changed a bit with Silverlight 3. One of
the features added in that version is the ability
for you to write your data locally to disk. For an
example of this, take a look at the following
application, fill in the first/last name fields, and
hit the Save button:
[ Awesome "SmallWorld" art by
Daniel Cook (Lostgarden.com) ]
When you hit the Save
button, you will see a Save As dialog appear:
[ the standard Save As dialog will appear ]
Use this dialog like
you would any other Save As dialog. Pick a location
and save the file. Once the file has been saved,
open it up in a text or XML editor. You whould see
something that looks similar to the following:
[ the data that gets saved ]
When you hit the Save
button, the information you specified in the First
name and Last name text fields was written into an
XML file that you saved to disk.
In this tutorial, you
will learn how to do all of that.
There are several steps involved with making all of this work. The
first part is the UI where you enter the data and
invoke the Save command. The second part is
displaying the dialog that allows you to save a file
to your disk. The third and final part is creating
the XML data and having it be saved. Let's start
with the easiest part, the UI.
I
am not going to go into great detail about how the
UI is created, but I will briefly introduce the star
players - the text fields and button. Create a new Silverlight application in
Blend and draw out two textboxes and a button:
[ it
doesn't get more plain than this ]
You
can go a little overboard and add some additional
visual details like I've done below:
[ something a bit more elaborate ]
Regardless of what your UI looks like, you need to
name your two textboxes. Give
one of your textboxes the name firstNameText,
and give your other textbox the name
lastNameText.
When your button is clicked, we want to display
the Save As dialog and save whatever data was
enteired into your firstNameText and
lastNameText fields. To do all of that, you
need to set
the Click event on your Button to point to an event
handler. Click on your button, click on the Events
button in the Properties Inspector, find the Click
event, and enter the event handler name
SaveFile:
[ associate your button's Click event with the
SaveFile event handler ]
Once you have entered SaveFile for your button's
event handler for the Click event, you will be
taken to the code view where the event handler will
be created for you:
- private
void
SaveFile(object
sender,
RoutedEventArgs
e)
- {
-
- }
This is pretty much all you have to do on the UI
front for all of this. What we are going to do next
is begin adding the code to make the UI functional.
Onwards to the
next page!
|