RSS

Creating a Web Page Tweaking Helper Tool(Part 3)

March 10th, 2008 Posted in Software Development, Trails, Utilities

In this article we will add a profile dialog box to the Trails Web Tweaker applicaiton. This dialog box will be opened from the File - New…, Open… and Change… main menu options.

Step 1 - In the Solution Explorer window right click on the WebTweaker project and select Add - Windows Form from the pop-up menu. Set the name to ProfileDlg.cs and click the Add button. This will open a new tab labeled “Profiledlg.cs [Design]” with a new blank form named ProfileDlg.

Step 2 - Now we need to set the form properties. Right click on the form and select Properties. Set the Text property to “Profile”. Set MaximizeBox and MinimizeBox to “false”. Set StartPosition to CenterParent so the dialog box will be centered over the main form when it is opened. Set FormBorderStyle to “FixedDialog”.

Step 3 - With our form properties set up we can now add the controls to the form. Add the follow controls:

  • Label, Text=”Name:”
  • Label, Text=”Local:”
  • Label, Text=”FTP:”
  • TextBox, Name=”textName”
  • TextBox, Name=”textLocalPath”
  • TextBox, Name=”textFtpPath”
  • CheckBox, Name=”checkAutoUploadNew”,Text=”Automatically upload new files”
  • Button, Name=”buttonOk”, Text=”OK”, DialogResult=”OK”
  • Button, Name=”buttonCancel”, Text=”Cancel”, DialogResult=”Cancel”

Trails Web Tweaker Porfile Dialog Screenshot

A nice enhancement to this dialog would be to add a Browse button that would open up directory browser so the user can select the local directory.

Step 4 - Now we need to add some code to our new dialog form. Right click on the form and click View Code. This will open up the ProfileDlg.cs C# code file. We need to add properties for the three text boxes and the check box.

Add the follow code:

        public string ProfileName
        {
            get { return textName.Text; }
            set { textName.Text = value; }
        }

        public string LocalPath
        {
            get { return textLocalPath.Text; }
            set { textLocalPath.Text = value; }
        }

        public string FtpPath
        {
            get { return textFtpPath.Text; }
            set { textFtpPath.Text = value; }
        }

        public bool AutoUploadNew
        {
            get { return checkAutoUploadNew.Checked; }
            set { checkAutoUploadNew.Checked = value; }
        }

The above code adds four public properties to the dialog class. This will allow the values to be set when the dialog is opened and retrieved after the OK button is pressed.

Step 5 - Now lets add some code to open our new Profile dialog when the File - New… menu item is selected. Go back to the MainForm designer view. The quickest way to add a Click handler for the File - New menu item is to open up the File menu and double-click the New menu item. This will automatically switch you to the code view and add the following method to the MainForm class.

     private void newToolStripMenuItem_Click(object sender, EventArgs e)
     {
     }

Add the following code to the new method:

ProfileDlg dlg = new ProfileDlg();
if (dlg.ShowDialog() == DialogResult.OK)
{
     SaveFileDialog save = new SaveFileDialog();
     save.AddExtension = true;
     save.DefaultExt = "twt";
     save.FileName = dlg.ProfileName + "." + save.DefaultExt;
     if (save.ShowDialog() == DialogResult.OK)
{
     SaveProfile(save.FileName, dlg);
}

This new code will open the dialog and when the user clicks OK it will then open a file save dialog box so the profile can be saved.

Step 6 -Now add the following using statement to the top of the source.

using System.Xml;

This will allow us to use the XML classes available in .NET.

Step 7 - Now add the following method:

private void SaveProfile(string filename, ProfileDlg dlg)
{
     XmlTextWriter writer = new XmlTextWriter(filename, null);

     //Write the XML document header
     writer.WriteStartDocument();

     //Write the root element
     writer.WriteStartElement("TrailsWebTweakerProfile");

     //Write sub-elements
     writer.WriteElementString("Name", dlg.ProfileName);
     writer.WriteElementString("LocalPath", dlg.LocalPath);
     writer.WriteElementString("FtpPath", dlg.FtpPath);
     writer.WriteElementString("AutoUploadNew", dlg.AutoUploadNew.ToString());

     //End the root element
     writer.WriteEndElement();

     //End the document
     writer.WriteEndDocument();

     //Write the XML to file and close the writer
     writer.Close();
}

This is the code that will actually write the XML file to disk.

Next time we will add the code for the File - Open…, Change.. and Save As.. menu items.

Trails Web Tweaker Part 3 Source Code

[del.icio.us] [Digg] [Reddit] [Technorati]

RSS feed | Trackback URI

Comments »

No comments yet.

Name (required)
E-mail (required - never shown publicly)
URI
Subscribe to comments via email
Your Comment (smaller size | larger size)
You may use <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> in your comment.