How to make a note-taking application for Windows 8 using C#

How to make a note-taking application for Windows 8 using C#

In this article, some real coding will be done by following various steps. In this, the user needs to double click on the button which is created in the interface. This double clicking is done to create the Click function for that button. As the button is clicked, the user needs to go back to the menu, but if the user is already in the menu then there is no need for this.

Listing 1: Shows the code to create the function for the button

private void SaveClose_Click(object sender, RoutedEventArgs e)

{

    // If we are in text editing mode.

    if(Notepad.Visibility == Visibility.Visible)

    {

        // Go back to main menu.

        Notepad.Visibility = Visibility.Collapsed;

        NotesGrid.Visibility = Visibility.Visible;

    }

}

Going back to the main menu, will only close the Notepad but the note is not saved. When the new note is created, then the user wants this to be included in the NotesGrid. For this, we will be creating a new Textblock inside the memory and finally it is added to the NotedGrid so that it is appeared in it. This can also be done via the interface editor as explained in the article on creating the interface.

Listing 2: Shows the code to create the new Textblock

Private void SaveClose_Click(object sender, RoutedEventArgs e) {     // If we are in text editing mode.     if(Notepad.Visibility == Visibility.Visible)     {         // Creates a new textblock that for this note.         TextBlock block = newTextBlock();         block.Width = 250;         block.Height = 125;         block.Text = Notepad.Text;            // Add that note to the grid.         NotesGrid.Items.Add(block);            // Go back to main menu.         Notepad.Visibility = Visibility.Collapsed;         NotesGrid.Visibility = Visibility.Visible;     } }

Now, when the new notes are created, a textblock which is created in the previous step will be shown under the button. If a lot of buttons are created, then they will be organized by themselves in a new column. Here, the important to be remembered is that the text is automatically cut off.

If the user wants to enable text wrapping, then the procedure is very simple. The only thing that is required to be done is to simply write block “TextWrapping = true;”

After the notes are saved, the target is not completed yet. The user might need to edit the notes created again and again. So, in this case there will be need of separate Click function for every Textblock. The function will be same for every block and by writing it once, it can be assigned to each and every Textblock.

Listing 3: Shows the code for function to be assigned to every Textblock

private void SaveClose_Click(object sender, RoutedEventArgs e) {     // If we are in text editing mode.     if(Notepad.Visibility == Visibility.Visible)     {         // Creates a new textblock that for this note.         TextBlock block = newTextBlock();         block.Width = 250;         block.Height = 125;         block.Text = Notepad.Text;            // Assign the click function.         block.Tapped += block_Tapped;            // Add that note to the grid.         NotesGrid.Items.Add(block);            // Go back to main menu.         Notepad.Visibility = Visibility.Collapsed;         NotesGrid.Visibility = Visibility.Visible;     } }    private void block_Tapped(object sender, TappedRoutedEventArgs e) {     // Get a reference to the block that has been tapped.     TextBlock block = sender as TextBlock;        // Open the text editor with the content of that block.     Notepad.Text = block.Text;     NotesGrid.Visibility = Visibility.Collapsed;     Notepad.Visibility = Visibility.Visible;        // Since we are currently editing this block, remove it from the menu.     // It will be added again once we save the note.     NotesGrid.Items.Remove(block); }

Instead of deleting the notes, there can be a need to delete the notes. In order to do this, a new button will be added in the App Bar for it. But the App Bar can contain only one control at a time. For this, we have to add two or more button. But the problem is how it is done?

In order to it, we will place all the buttons inside a container and to do this, StickPanel will be used which is the most convenient option in this situation because it will be very easy to write it directly in the XAML editor.

Listing 4: Shows the code for buttons to be put in the container

<Page.BottomAppBar>

    <AppBar>

        <StackPanel Orientation="Horizontal">

            <Button Name="SaveClose"Style="{StaticResourceAppBarButtonStyle}"Content="✔"AutomationProperties.Name="Save and Close"Click="SaveClose_Click"/>

            <Button Name="Delete"Style="{StaticResourceAppBarButtonStyle}"Content=""AutomationProperties.Name="Delete Selected"/>

        </StackPanel>

    </AppBar>

</Page.BottomAppBar>

Figure 2: Shows the snapshot after writing the above code

Now, the Delete Selected needs to click twice to write the code in it. In this case, the user needs to go through every non-button selected element in order to remove it from the GridView.

Listing 5: Shows the code to be written for deleting the selected elements

private void Delete_Click(object sender, RoutedEventArgs e)

{

    foreach (UIElement element inNotesGrid.SelectedItems)

    {

        // Don't delete the "New Note" button.

        if(element.GetType() != typeof(Button))

            NotesGrid.Items.Remove(element);

    }

}

Once the notes are created, they are needed to be shared using the Share Contract option. This option allows the user to share content from one application to the other which can support it.

To do it, a library is needed and at the top of the MainPage.xaml.cs file, a code is added.

Listing 5: Shows the code to be added at the top of MainPage.xaml.cs file

1	using Windows.ApplicationModel.DataTransfer;

After this, the Windows 8 needs to be informed that the application created here is supported by it. For this, a new function needs to create which will attach the application to the Windows 8.

Listing 6: Shows the code for the new function which will inform the Windows 8

publicMainPage()

{

    this.InitializeComponent();

  

    // Tell Windows 8 that our app can share.

    DataTransferManager.GetForCurrentView().DataRequested += MainPage_DataRequested;

}

Listing 7: Shows the code which will do the actual sharing

voidMainPage_DataRequested(DataTransferManager sender, DataRequestedEventArgs args)

{

    // We only have text to share when a note is selected.

    if(Notepad.Visibility == Visibility.Visible)

    {

        DataPackagerequestData = args.Request.Data;

        requestData.Properties.Title = "My little note";

        requestData.SetText(Notepad.Text);

    }

}

In this way, the text can be shared to other applications in an easy way.

Conclusion

We have learnt the process of using the interface to create various notes and to put them together. Instead of this, the concepts of deleting the notes and sharing them are also discussed in detail.