Injecting Footer Webview/Panel into Sketch UI to display custom status bar

slashrute

I am currently trying to figure out how I can inject a footer panel or small footer display into sketch UI, similar to Craft (InVision), to display the state of some logic I have configured using JS API.

I have experimented a little with sketch-module-webview, referencing the following:
https://sketchplugins.com/d/2142-injecting-a-webview-in-the-sketch-ui-not-floating
but I was unable to get this to work. I'm not sure if this broke with later versions of sketch after the time of publish.

I am beginning to think I need to integrate into the native UI, although if there is an easier solution, that would be ideal. The footer "button" does not need to be clickable/actionable, it just needs to display the status of some state I have through the JS api.

Example image of what I am trying to achieve (see footer area):
https://i.ibb.co/L8Hm64x/Screen-Shot-2021-03-08-at-1-14-49-PM.png

kevgski

Have you checked out Aby's post here?

https://sketchplugins.com/d/2221-sidebar-error-in-sketch-v70/10

slashrute

kevgski I'll try this out, thanks!

kevgski

I think the specific method for inserting your view nowadays is this one: https://github.com/abynim/Sketch-Headers/blob/master/Headers/MSMainSplitViewController.h#L70

kevgski

All that being said, since these are private methods they can and will break over time! So much of the documentation around injecting UI goes stale (and is why often Craft and whatnaught break sketch after each update…)

slashrute

@kevgski as a test, i was able to plug-n-play the code from the link you provided and i see the sidebar example populating in Sketch 70.6. Correct me if I'm wrong, but because the subview architecture can vary from version to version in Sketch, I'm assuming something like this can't be securely back-versioned or made compatible with a range of sketch versions (ex. 66 - 70+). I noticed it wasn't working in some older sketch versions.

So if I were to implement the example shown from that link, I guess I'd have to just assume it will work with version 70+ (excluding previous versions) until it breaks with some other future sketch update.

kevgski

Exactly, the recommended approach is to stick with the Public JavaScript API as its officially maintained and supported by Sketch. You are welcome to use the Private Sketch methods but as you found out, new versions can and will break these methods. Here is the statement from Sketch on interacting with the private apis.

Sketch does not provide an API reference nor support for the internal API. If you’re using the internal APIs make sure to test your plugin with the pre-release versions of Sketch.

We recommend using the JavaScript API where possible. Something is missing? Please submit feedback and feature requests.

Generally I recommend using a floating webview with https://github.com/skpm/sketch-module-web-view