IOS SCRIPTABLE WIDGETS

Eclectic, somewhat functional, and occasionally user-friendly widgets designed for Scriptable on iOS.

PREVIEWS

CONTENTS

1. Preview
2. Introduction
3. Why Scriptable
4. Widget Overview
5. Coming Soon
6. Script Structure
7. Installation Guide
8. Customization Tips
9. Appendix: Troubleshooting
10. Appendix: Previous Updates
11. Credits & License

HELLO THERE...

Welcome to my growing set of Scriptable widgets for iOS. This repository exists because a few weeks ago i was looking for a specific widget for my iPhone and couldn’t find one, and not willing to pay for a widget designer app, I figured there must be a way to build your own.

These widgets are built on IPHONE 16 PRO MAX and i know there are some misalignments on other devices (i.e. My IPad 10th Gen).

Temporarily, i run with two sets of scripts with their layouts, as this evolves i will look to add auto sizing in where needed. All scripts contained here within are iPhone 16 pro max ones, so adjust the padding as needed.

These widgets were designed with fun & are for entertainment purposes only. Well not all of them, some of them were designed for me and have purpose (and in the case of the energy monitor ; my Mum, so she knows when to put the washing on).

WHY SCRIPTABLE

• Scriptable provides a JS (JavaScript) automation app that allows any user to throw together a script and create an executable function on iOS and or a truly customisable widget that can be created to their needs and wants, within the iOS framework.
• With thanks to Simon Støvring for the scriptable app and creating the framework to make true IPhone customisation possible.

if it doesn't exist, make it yourself.

WIDGET OVERVIEW

This repository includes 13 unique widgets, each crafted for specific use cases:

• Nearly all the widget scripts are customisable and in most cases, have built in dynamic theme changing between IOS dark and light modes.
• Like one? download it and change the colors to your own themes and make it your own! a

• ^^ Dark Mode = Light and Dark themes dynamic shifting and customisable
• ^ Dynamic size auto-adjusts as you change widget size

COMING SOON

SCRIPTS LAYOUT

Each widget follows a modular structure for clarity and ease of customization

DISCLAIMER: Whilst i'd love to tell you that every script doesnt have any redundant code and strictly follows the layout below and works in the most efficient way......

.... they do , they don't and they're not!

One day (maybe) but until then... get over it.

(And YES, there's that many colors on my palatte, i'm picky and indecisive)

Each widget has a user config and i have tried to move / keep all variables ( font, size, colors etc) up there for user ease.

/* ####################################################
READ ME READ ME READ ME READ ME READ ME READ ME READ ME
#######################################################

// #############################################
// ############## WIDGET NAME ##################
// #############################################

WIDGET NAME   :
COLOUR        :
ICON          :
WIDGET SIZE   : 
THEMES.       : DYNAMIC LIGHT & DARK MODES 
VERSION       : V
DEVELOPER     : 
CREDIT        : 

// #############################################
// ######### FUNCTION & INSTRUCTION ############
// #############################################

DESCRIPTION & FUNCTION

// #############################################
// ############## COLOR SCHEMES ################
// #############################################

### B/G ACNTS ###    #1A1F2A #3C494F #2C3444 #3E4A5C  
### TEAL ACNTS ###   #00637C #008794 #40E0DO 

// #############################################
// ################## CONTENTS #################
// #############################################
    READ ME 
    USER CONFIGURATION 
    CORE LOGIC
    WIDGET LAYOUT
    WIDGET EXECUTION
    END OF SCRIPT
*/

// #############################################
// ############# USER CONFIGURATION ############
// #############################################
const settings = {
  theme: 'tealGlass',
  showLabels: true,
  cornerRadius: 12,
};

// #############################################
// ############## END OF USER CONFIG ###########
// #############################################

// #############################################
// ################ CORE LOGIC #################
// #############################################
async function fetchData() {
  // API calls or local data
}
// #############################################
// ############## WIDGET LAYOUT ################
// #############################################
function createWidget(data) {
  const widget = new ListWidget();
  // Layout logic here
  return widget;
}
// #############################################
// ############## WIDGET EXECUTION #############
// #############################################
let data = await fetchData();
let widget = createWidget(data);
Script.setWidget(widget);
Script.complete();
}
// #############################################
// ############## END OF SCRIPT ################
// #############################################

INSTALLATION GUIDE

(If you cant handle this then why are you on GITHUB)

1. Install Scriptable from the App Store.
2. Clone or download this repository.
3. Copy the desired .js file into Scriptable.
4. Add the widget to your home screen and select the script.

CUSTOMISATION & THEMES

• Themes: Most widgets support dark & light mode through dynamic functions and the colors / fonts / sizes are contained within a user configuration section usually at the top of the script
• Labels: Toggle label visibility via showLabels in the config.
• Spacing: Adjust padding and alignment for different screen sizes.

APPENDIX: TROUBLESHOOTING

• Widget not updating? Ensure Background App Refresh is enabled for Scriptable.
• Layout misaligned? Try adjusting cornerRadius or padding values.
• Data not loading? Check API keys or permissions (e.g., Energy Monitor, Network Status).

CREDITS

• Automater Everyone on there for their posts, i learnt a lot (even for being 7 years behind)
• Simon Støvring Thank you for Scriptable

Crafted by Michael

Thank you for reading this far and if you like any of the widgets and want to support more, please do so here: