Tap on the words "New shortcut" to rename it. Now, tap the "add to home screen" option.ħ. On the next screen, hit the i button (details), at the bottom.Ħ. In this example, I'm going to add a custom icon for Bitwarden.ĥ.
See the word "app" next to Open? Tap on "app", and the screen will you select the app that you want to create the shortcut for. Use the search bar to find "Open app", or browse for it under the Scripting section. Tap the + button at the top, and then tap the "Add action" on the next screen.ģ. You may follow this tutorial on your iPad too. To display the pretty instructions, the Shortcuts app generates an image on the fly.There is a way to change app icons in iOS 16, but it involves a lot of steps.
#Ios shortcuts app icon how to#
You can see the example project or the decoded Shortcut to see how to achieve this, but the Shortcuts app uses the localhost server to provide images while the example project encodes an asset and provides the raw data. You can find this info in the Apple docs, but you can use apple-touch-icon and apple-touch-startup-image tags to link to images in order to add this sort of content, as well as using some html tricks to make your pages look neater. Now, while this works, it certainly doesn't look anything like the Shortcuts example! I didn't go too far in the looks department since I'm not a designer, but because this is essentially a PWA page you can infuse it with PWA properties in order to add things like home icons and splash screens. Pimp my PWA: Icons, Splash Screens and Conclusion The result of this is the gif at the beginning of the article, and you can add this to different screens of your app in order to add shortcuts to pre-defined deeplinks that your or other's apps supports.įull project available here. We can use a similar approach here to achieve this effect: SwiftRocks! var element = document.getElementById('redirect') var event = document.createEvent('MouseEvents') event.initEvent('click', true, true, faultView, 1, 0, 0, 0, 0, false, false, false, false, 0, null) setTimeout(function() Ĭompared to the previous example, this will boot a localhost server that listens to /shortcut and redirects to the original data URL. Routing to a deeplink can be achieved with a simple JavaScript snippet - if you've been around during the iOS days before Apple added Universal Links, you probably had to deal with making an arbitrary page redirect to its deeplink equivalent if the user happened to have the app installed. As expected, you can render entires pages using this format, including their scripts. There's no page hosting this content, it's simply Safari directly rendering the base 64 encoding of SwiftRocks!. You should see a SwiftRocks! page: data:text/html base64,PGJvZHk+PHA+U3dpZnRSb2NrcyE8元A+PC9ib2R5Pg= The reason this is possible comes from the fact that Safari doesn't need an URL to display a page - it can render raw encoded data of many kinds, including HTML and images. With this, you can make your app create home shortcuts to virtually anything that's bootable via deeplinks. Replicating this requires a bit of tinkering since that's not an official iOS feature, but the end result is exactly the same and easier than it sounds. That's very sneaky, and you can see by yourself exactly how it achieves that by 3D Touching the generated home icon and decoding the base64 string in the URL.
If the page was opened inside Safari, the instructions are shown - but when the page is opened in PWA mode (a.k.a when you open it from the home screen), it instantly redirects to the relevant shortcuts:// deeplink.
To make it short, before the Safari screen is shown, the Shortcuts app locally generates a HTML page that pretends to be a PWA. One might think that this is the result of an internal API since Apple has never shared anything in that aspect, but this is actually just a clever use of Safari's PWA features.
0 kommentar(er)
