Log window from scratch: introduction and motivation

3 minute read

Programmers love logging stuff. From errors to very verbose debug data or errors that should be warnings. We love them.

Logging data is very useful when you’re looking for something. Maybe there’s a bug that’s hard to reproduce and you add some logs to trace it down after it occurs. Maybe you just want to know the values of some variables at some point in the code without attaching a debugger. Or even whether your code gets called at all!

So, you start adding logs. Maybe not a lot of them, but just enough. And then you run your program and realize you aren’t able to find your log because there are too many logs from other systems in the program (your past self added just enough ones as well, maybe?). If only it would be easy to view and filter them live…

Motivation

Logging is a common practice, and so is having a way to view the data you’ve logged. Maybe you direct them to stdout and read the console live, as it goes. Maybe you save them to disk or send them over the net to read them offline. Maybe you use you IDE’s or editor’s built-in log viewer (i.e. Android Studio’s Logcat, Unity’s log panel).

I wanted to build my own take on a live log window that I could plug in most of my side projects. The goal was to create something that becomes a written once, used more than once project, a log window that works with C++ and C# projects on Windows, mainly.

After some research it looked like Windows Presentation Foundation (WPF) was what I needed. So that’s the framework we’ll use.

What’s included?

These are the requirements:

  • Live viewing log data.
  • Tabular display.
  • Timestamps.
  • Colored log levels: i.e. debug is black, warning is yellow, error is red.
  • Log systems/tags: i.e. render, net, gameplay.
  • Easy to integrate with other C++/C# projects.
  • Somewhat configurable from the host program: i.e. which log levels/systems are relevant to this program?
  • Auto-scroll: on and off.
  • Filters: by log level, by system.
  • Good enough performance.

What’s not included?

There are some features that aren’t in the scope of this project:

  • Persisting/copying log data.
  • Offline view of log files.
  • Filtering by log content.

End result

So, after I worked on these requirements while writing some posts, this was the result:

Final sample window with extra configuration

Confessions

I started this side project like three times. Each time with a different scope and approach.

I investigated what I could do and how. Then, what I really wanted to have. Then made an initial version and started writing a very long post on how to do it, step by step, and realized the approach was pretty boring.

After that I decided I’d start again but stay on point, have more screenshots while showing most of the code. With a bit of luck this approach is more engaging and you don’t get bored!

Still, it took me way more than I expected and writing these posts delayed it even more. I plan on using this log window soon in other projects and validate its utility.

Road map

If you’ve been following this blog for a bit, you’ve already noticed some of the posts are part of a series. This is one of those too! So, what’s in this series?

  • After this introduction we’ll create a very basic log window with the bare minimum: logging simple data and viewing it live.
  • Then we’ll convert it to a Class Library so we can plug it into other projects.
  • Later, we’ll start adding some extra functionality to the window itself: configuring it from the host program, filtering log entries and the like.
  • Finally, we’ll work on integrating it with a C++ project.

Are you ready? Then let’s start!