How can I change text size, font and background of a Widget?

Scriptable
1

ImageName
ImageName1036×620 467 KB

Does anybody know how to change de background of the widget to an image (ImageName.jpeg on root iCloud Drive)?

Does anybody know how to change widget text color, size and font in this simple scrip?


// Variables used by Scriptable.
// These must be at the very top of the file. Do not edit.
// icon-color: red; icon-glyph: calendar-alt;

// Adapted from calendar widget created by Max Zeryck @mzeryck

// Store current datetime
const date = new Date()

// If we're running the script normally, go to the Calendar.
if (!config.runsInWidget) {
 
// Otherwise, create the widget.  
} else {

 let widget = new ListWidget()
 widget.backgroundColor = new Color("2980B9")
 
 widget.addText("Sales Tax")

 // Finalize widget settings
 widget.setPadding(16,16,16,0)
 widget.spacing = -3
 
 Script.setWidget(widget)
 widget.presentSmall()
 Script.complete() 
}


// Your code begins from this line

console.log("Hello world!");
2

Once you have created the widget, add the text while assigning the result to a variable:


let title = widget.addText("Sales Tax")

title.font = Font.semiboldSystemFont(12)
      
title.textColor  = Color.red()

You can play around with the font size (the number in the parentheses) and the color to see what works.

3

Yeah! This solution works! Thanks sir.

Do you know how to use a background image?

Output:

PNG image
PNG image1125×2436 404 KB

This is the code after the font size recommendation:


// Variables used by Scriptable.
// These must be at the very top of the file. Do not edit.
// icon-color: red; icon-glyph: calendar-alt;

// Adapted from calendar widget created by Max Zeryck @mzeryck

// Store current datetime
const date = new Date()

// If we're running the script normally, go to the Calendar.
if (!config.runsInWidget) {
 
// Otherwise, create the widget.  
} else {

 let widget = new ListWidget()
 widget.backgroundColor = new Color("2980B9")

let title = widget.addText("IVU");
title.font = Font.semiboldSystemFont(84);
title.textColor  = Color.white();

let sub = widget.addText("Sales Tax");
sub.font = Font.semiboldSystemFont(42);
sub.textColor  = Color.yellow();

 // Finalize widget settings
 widget.setPadding(16,16,16,0)
 widget.spacing = -3
 
 Script.setWidget(widget)
 widget.presentSmall()
 Script.complete() 
}


// Your code begins from this line

console.log("Hello world!");