Workflow: Crop Workflow Screen Shot

This blog post covers the fourth sub-workflow of the blogging workflow process described in the Blogging About Workflows blog post.

A big piece of my workflow blogs (and something readers have commented on many times) are the workflow screen shots I produce. As detailed in the Blogging About Workflows blog post I take several overlapping screen shots and use an iOS app to stitch them together into the mega-length screen shots that you’ll see scattered through the workflow related blog posts on this site. However the images that it creates include parts that I don’t which to use. These are the top bar that shows my time, battery level, etc. (which many people including Federico Viticci and Dr Drang find a need to remove - ref. MacStories) and the workflow bottom bar (Actions and Workflow buttons). I’ve automated the cropping of the screen shot with a workflow to do exactly this. It also saves the file into Dropbox for me and offers to delete it from my device camera roll.

The workflow begins by capturing any input parameter. Unlike the previous workflows being called as part of my workflow blogging chain of workflows this workflow will accept and make use of the URL for the workflow download page being on the clipboard, but it is not a requirement. This is mainly because this was actually the first workflow in my process to be written and at that point I’d started with just manually naming the file before I worked out how workflow could grab the workflow name for me.

Once any input parameter has been captured, Text actions are used to specify some cropping parameters. The bottom bar to be cropped is specified as the bottom 80 pixels and the top bar to be cropped is specified as 25 pixels. I don’t know if these are pixel perfect, but they are nice round numbers and give me great results every time.


Update: Since posting this, Stitch It! has been updated (version 2.2.0 released 9 September 2015) and has adjusted some of their iPhone 6+ sizing. Therefore the numbers I now use are 150 and 65 rather than 80 and 25. If you download the workflow below you may need to amend the cropping parameters to work for your device and if you are on an iPhone 6+, the figures provided here would be your best starting point.


The workflow then checks the clipboard to see if it contains a workflow download page URL. If it does it uses the download page title to get the name of the workflow (just as described in the first sub-workflow’s blog post). If the URL isn’t found on the clipboard it prompts for the input of the name of the workflow. The result is stored in the ImageName variable.

Next the workflow prompts the image file to be cropped to be selected. At first I had this set to always pick the last image, but after several occasions where I found I was not immediately running the workflow after creating the image I decided to switch this to a manual selection. At some point I may just add a menu option here to just say last image in the device camera roll or choose an image.

Once the image is selected the workflow stores the original height of the image. It then calculates how tall the image will be when the bottom bar is removed (the first crop). From that height it then calculates the final height of the image when it has no top bar. Lastly the workflow captures the width of the image so it can be explicitly set when cropping the image.

Now the workflow has calculated the intermediate and final height and has the width, it crops the image first to remove the bottom bar (a top left based crop) and then to remove the top bar (a bottom left based crop). The resulting image is stored in a variable called Final Image. If there was no parameter passed in as an input to the workflow the workflow asks if the image should be shown with a Quick Look action or Move to Dropbox.

The Quick Look action also provides sharing options so that can be useful if say you want to e-mail it to someone or open it in an image editing app. If this option is selected the SaveToDropbox variable is set as False. Selecting the Move to Dropbox option will set that parameter to True. If there was an input passed to the workflow, the SaveToDropbox variable will also be set as True.

The workflow now checks to see if the SaveToDrobox variable is set to True and if it is it then automatically saves the image to a workflow folder in Dropbox using the workflow name as the file name (appended with a file extension of jpeg). It then uses the name of the original uncropped image to locate it in the device camera roll and offers the option to delete the file from the device. This just helps me tidy-up my iPhone/iPad from having lots of composite screen shot images floating around on it.

The last step uses the workflow input to pass control back to another app/workflow. In the case of the blogging process it goes back to the DocFlow workflow. If no input parameter was received then the Open X-Callback URL action will do nothing.

The details of the workflow can be seen below and you can also download this Crop Workflow Screen Shot workflow.

Author: Stephen Millard
Tags: | workflow |

Buy me a coffeeBuy me a coffee



Related posts that you may also like to read