About a month ago, when I was prototyping a new user interface for my Twitter app, I decided that, at the time, an inspector was the right place to show information. So, I began to prototype an Inspector, but instead of using InspectorKit, I created one in WebView. It's actually quite easy to use a WebView object to quickly prototype-up a native-looking interface that actually works with your Cocoa app. Let me `splain... no, there is too much. Let me sum up...
Buttercup is marry Humperdinck in a little less than half an hour. So all we have to do is get in, break up the wedding, steal the princess, make our escape... after I kill Count Rugen.
After reading this blog, you may want to check out this very detailed blog on exactly how to integrate Cocoa into your WebView so you have a better understanding of exactly how this process works. It's not difficult, but it's also not trivial. Then you'll be able to make your WebView look and work native as hell.
Look and feel
Okay so, although I ended up replicating this Inspector in Cocoa, I do have some remnants of this neat hack that you can check out in the form of HTML/CSS/JS code lying around, which is what prompted me to write this blag post. Obviously I've changed the CSS a little so it looks nice in a browser, but originally it looked very plain (no borders, consistent background color not a fixed size), and you could stick this HTML page directly into a WebView in a Cocoa window. This would give it the effect of looking like native Cocoa.
As mentioned in the aforementioned tutorial, most of the native looks come from WebKit-specific CSS which is essential to check out if you're ditching Firefox and IE or, as in this case, using WebView inside your Cocoa app.
Work and... work?
UserInfoController is a Cocoa object, and
selectedUserInfo() is actually calling the method
-selectedUserInfo on it.
WebScriptObject class. Usually, users will only need to use a webView object's
-windowScriptObject method to get a hold of an object of this class. So in order to make
[[webView windowScriptObject] setObject:self forKey:@"UserInfoController"];
With great power comes an awesome UI
If this stuff fascinates you or you might have a good use for it, you probably want to check that tut out which I aforementionized earlier.
My name is Steven Degutis, and I've been writing software professionally for almost a decade. During that time, I've written many apps and websites, quite a few techical articles, and kept up-to-date with the rapidly evolving software industry.
If you have software needs for web, mobile, or desktop, and are looking for a seasoned software professional, please reach out to me at email@example.com to set up a phone call.
- Self-employed – present
- Clean Coders – 5 years
- 8th Light – 2 years
- Big Nerd Ranch – 1 year
- Self-employed - 1 year
- Web: full-stack
- iOS (UIKit)
- macOS (Cocoa)
- REST APIs
- AWS / EC2 / ELB
- HTML5 / CSS
Over the past decade, I've written a total of 169 technical articles on various programming languages, frameworks, best practices, and my own projects, as I kept up-to-date and active in the software industry.
Subscribe via RSS / Atom.
- 2017 — "Clean code" isn't actually clean
- 2017 — Passion in your field is overrated
- 2017 — What I learned in 5 days of writing an experimental website
- 2014 — Age of the Polyglot
- 2013 — How to Program
- 2013 — Ignore the Naysayers
- 2013 — Writing Clearly
- 2012 — Reinvent the wheel
- 2010 — Good usability
- 2009 — Twitter is the wrong tool
- 2009 — We're all pretty bad at driving
- 2008 — Why I Code
|March||Notes on Haskell Extensions|
|February||Second thoughts on front-end tools|
|February||First thoughts on front-end tools|
|February||Some thoughts on GUIs|
|February||First thoughts on OCaml|
|February||First thoughts on Haskell|
Here are some of the projects I'm most proud of. They were created using a variety of technologies, running on several different platforms and OSes. They're all finished products, and many of them are open source.
I made Docks in 2009 for users who wanted to swap out icons in their Dock with a single click. Its unique functionality and design aesthetic attracted the attention of Apple, Engadget, MacWorld, and led to an acquisition of my start-up by Big Nerd Ranch.
This toy was made in a weekend to entertain my 1 year old daughter. It lets you create bubbles with your fingers, which then simulate physics by bumping into each other and falling.
When I couldn't find an app in the App Store that let me make very simple lists extremely quickly, I made one myself. I use it almost every day to organize and track my activities.
I created this app to increase my productivity by letting me move windows around in macOS using keyboard shortcuts. It grew into a community-driven highly extensible app, using Lua for its plugin system.
Implementing this elite social network gave me experience integrating both Apple Pay and credit card payments (via Stripe.com) seamlessly into web apps, for a frictionless and pain-free payment experience.
This isn't just any chatroom. In this web app, you can see what everyone is typing while they type it. I made this in order to scratch my itch for making real-time apps and games, and learned how to use WebSockets in the process.
This was written in 2009, before the time of Slack, when IRC was the main way for programmers to get short-term assistance from each other. Its purpose was to be a beautiful app with an emphasis on simplicity and usability over technical power.
This is an app I actually use every single day. It lets you move windows with global keyboard shortcuts. Since it uses Vim-like key bindings, it should feel pretty natural to any programmer. There's no configuration needed; it Just Works™.
As an evolution of Phoenix, Hydra was my first attempt at embedding a full Lua virtual machine into an Objective-C app, to make a lightweight and efficient window manager that focused on speed, low memory usage, low CPU usage, and overall being gentle on laptop batteries.
These may be tiny, but they're interesting technical feats.
|Lua4Swift||Swift framework for embedding Lua with a native Swift API.|
|choose||Command line fuzzy-matching tool for macOS that uses a GUI|
|music||Command line music daemon for macOS that only speaks JSON|
|hecto||Command line text editor with an embedded Lua plugin system|
|ZephSharp||Window manager for Windows using Clojure for scripting|
|management||Minimalist EC2 configuration & deployment tool in Ruby.|
|go.assert||Assertion helper package for writing tests in Go.|
|go.shattr||Go library for printing shell-attributed strings to stdout.|
|OCDSpec2||Objective-C based testing framework with Xcode integration.|