Skip to content
Nubgrammer
Menu
  • Home
  • Contact Me
Menu

Write an RSS Feed Aggregator, Part 2.1 Setting Up the GUI

Posted on November 3, 2017November 8, 2017 by Tyler Sells

TL;DR:

Just a bunch of GUI setup stuff.  Watch the video here.  If you’re not familiar with adding controls to forms and working with Visual Studio, I would recommend this video and this blog post.

Alright, let’s get the easy stuff out of the way

Ok, ok.  I’m sorry guys, this series is not going to be a 3-parter.  I had intended to do a video on writing the parser, then a video on creating the app, and then a video on creating the installer for the app but the more I thought about it, the more I realized that there’s just too much content to fit into a single video.  Heck, this video is already 30 minutes long and all I did was setup the GUI.  What do you guys think?  Am I spending too much time on stuff that doesn’t matter?  My goal is to explain everything I can that I had to ask questions about when I started learning this.  Anyway, tell me what you think in the comments here or on Youtube.

This is the one where we setup the GUI components.  There’s not a lot of code in here though; I’m working on the code videos though, I promise.  Now then, I have to level with you all. When I wrote this app, I never intended to show it to anyone.  What that means is that my code was super sloppy and had a few bugs related to not handling incorrect user input.  So I’m rewriting it as I go along.

Here’s the video:

 

What matters here?

Because this is mostly me blabbing while I’m setting up a bunch of controls, there’s not a lot for me to talk about here.  However, there are a few things worth mentioning:

Everything I’ve done in the video can be done using regular form controls.  I chose the MetroModernUI package because I like the way it looks and it makes it feel like an actual app instead of a tutorial piece.  In order to use that, you’ve got to first install the package, then add all of those Metro controls to your toolbox, and lastly, change your regular Form to a MetroForm.

  • Install MetroModernUI
    • In Visual Studio, click Tools (from the top toolbar), go down to NuGet Package Manager -> Manage NuGet Packages for Solution…
    • Under Browse, type in MetroModernUI, click on it, select the Aggregator App project, and install it

  • Add Metro Controls to the Toolbox
    • In order for the tools to be more useful, we have to add them to the VS Toolbox.
    • With your form selected, open the Toolbox, right-click on a blank spot, click Add Tab, and call it MetroUI (or whatever you want, I don’t care, just make sure it makes sense)
    • Right-click on your newly created tab and select Choose Items…
    • Click Browse… and find the MetroFramework.dll.  On my machine, this was located deep down in the packages folder at the root of my solution.
    • Finally, after you’ve got it selected, just hit ok on everything to finish the import

  • Change the Regular Form to MetroForm
    • Lastly, to turn our form into a MetroForm, we do have to change one piece of code
    • Right-click your AggForm.cs file in the Solution Explorer, and click View Code (or press F7 with the file selected, if you’re into that sort of thing.  I won’t judge)
    • See the class declaration line?  See where it says
      AggForm : Form
      AggForm : Form?  Yep, that’s the problem.
    • Instead of extending the Form class, we want this form to extend the MetroForm class.  When you do this, you’ll get a red squiggly that wants you to import the
      MetroFramework.Forms
      MetroFramework.Forms reference as well.  Don’t forget to do this!
    • Change it to this:
Plain text
Copy to clipboard
Open code in new window
EnlighterJS 3 Syntax Highlighter
using MetroFramework.Forms;
namespace Aggregator_App
{
public partial class AggForm : MetroForm
{
public AggForm()
{
InitializeComponent();
}
}
}
using MetroFramework.Forms; namespace Aggregator_App { public partial class AggForm : MetroForm { public AggForm() { InitializeComponent(); } } }
using MetroFramework.Forms;
namespace Aggregator_App
{
     public partial class AggForm : MetroForm
     {
          public AggForm()
          {
               InitializeComponent();
          }
     }
}

Anything else?

The only other thing I think that’s worth mentioning is that the MetroForms have their own properties section in the properties window:

This is where you can change the properties that make the MetroForm look much better than the standard Windows Form.  Play around with them until you find something you like.  In this video, I change the Theme to Dark and changed the Style to Red.  The ShadowType and BorderStyle properties also do some interesting looking stuff too.  Get in there and play around!

That’s a wrap for this one

Alright, I think that’s all I’ve got to say about this one.  If I missed something you’ve got a question about, just let me know and I’ll take care of it!

Author: Tyler Sells

Github

Share this:

  • Click to share on X (Opens in new window) X
  • Click to share on Facebook (Opens in new window) Facebook
  • More
  • Click to share on LinkedIn (Opens in new window) LinkedIn
  • Click to email a link to a friend (Opens in new window) Email
  • Click to share on Reddit (Opens in new window) Reddit

Like this:

Like Loading...

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Follow me on Twitter

My Tweets

Github Repos

vtsells (Tyler Sells)

Tyler Sells

vtsells
http://www.nubgrammer.com
Joined on Jun 21, 2017
9 Public Repositories
100DaysOfCode
embers
MultiSelect
MVC-Project-Start
nubgrammer.com
PermIT
Spray
vtsells.github.io
Wizard
0 Public Gists

Categories

  • #100DaysOfCode (4)
  • ASP.NET (7)
  • ASP.NET Core (1)
  • ASP.NET MVC (3)
  • CSS (4)
  • General (13)
  • JS (3)
  • LESS (2)
  • Snippets (4)
  • Tools (4)
  • Tutorials (9)

Recent Posts

  • Creating a Knockout.js project on Codepen
  • 100DaysOfCode Day 3 – A State of Mind
  • 100DaysOfCode Day 2 – The Building Blocks
  • 100DaysOfCode Day 1 (Sort of cheated already)
  • Committing to #100DaysOfCode
© 2025 Nubgrammer | Powered by Superbs Personal Blog theme
Menu
  • Home
  • Contact Me
We use cookies on our website to give you the most relevant experience by remembering your preferences and repeat visits. By clicking “Accept”, you consent to the use of ALL the cookies.
Do not sell my personal information.
Cookie SettingsAccept
Manage consent

Privacy Overview

This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the ...
Necessary
Always Enabled
Necessary cookies are absolutely essential for the website to function properly. These cookies ensure basic functionalities and security features of the website, anonymously.
CookieDurationDescription
cookielawinfo-checkbox-analytics11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Analytics".
cookielawinfo-checkbox-functional11 monthsThe cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Functional".
cookielawinfo-checkbox-necessary11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookies is used to store the user consent for the cookies in the category "Necessary".
cookielawinfo-checkbox-others11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Other.
cookielawinfo-checkbox-performance11 monthsThis cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Performance".
viewed_cookie_policy11 monthsThe cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data.
Functional
Functional cookies help to perform certain functionalities like sharing the content of the website on social media platforms, collect feedbacks, and other third-party features.
Performance
Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.
Analytics
Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics the number of visitors, bounce rate, traffic source, etc.
Advertisement
Advertisement cookies are used to provide visitors with relevant ads and marketing campaigns. These cookies track visitors across websites and collect information to provide customized ads.
Others
Other uncategorized cookies are those that are being analyzed and have not been classified into a category as yet.
SAVE & ACCEPT
%d

    Privacy Policy