ajatkj / scriptable

Scriptable scripts for iOS
314 stars 62 forks source link

got the download all good but now #3

Open rdeneault7 opened 3 years ago

rdeneault7 commented 3 years ago

The layout on my widget is weird here is a picture so see what's going on ![Uploading 105425142...]

rdeneault7 commented 3 years ago

image

ajatkj commented 3 years ago

Hi,

The layout co-ordinates need to be changed for different phones because the size and resolution is different. I have done it on iPhone X so the co-ordinates might not be accurate for your phone. But there is a simple way to fix this-

Locate the variable layout in the code and the y co-ordinate for each of these elements.

var layout = {
  // field: [key,prefix,suffix,x,y,width,height,font,color,align]
  lowTemp: {key: "low", prefix: null, suffix: "temperature", x: "left_margin", y: 375, w: 100, h: 75, font: "small", color: "light", align: "left", hide: 1},
  highTemp: {key: "high", prefix: null, suffix: "temperature", x: "left_margin", y: 200, w: 100, h: 75, font: "small", color: "light", align: "left", hide: 1},
  temp: {key: "temp", prefix: null, suffix: "temperature", x: -100, y: 200, w: 100, h: 50, font: "medium", color: "light",  align: "center"},
  description: {key: "desc", prefix: null, suffix: null, x: "center", y: 650, w: "half", h: 30, font: "extraSmall", color: "light", align: "center"},
  location: {key: "loc", prefix: null, suffix: null, x: "center", y: 690, w: "half", h: 30, font: "extraSmall", color: "light", align: "center"},
  icon: {key: "icon", prefix: null, suffix: null, x: -100, y: 120, w: 100, h: 100, font: null, color: "light", align: "center"},
  wind: {key: "wind", prefix: "🌬️", suffix: "speed", x: -100, y: 260, w: 120, h: 50, font: "extraSmall", color: "light",  align: "center"},
  sunrise: {key: "sunrise", prefix: "🔆 ", suffix: "", x: -100, y: 310, w: 120, h: 50, font: "extraSmall", color: "light",  align: "center", hide: 2},
  sunset: {key: "sunset", prefix: "🔅 ", suffix: "", x: -100, y: 310, w: 120, h: 50, font: "extraSmall", color: "light",  align: "center", hide: 2}
};

You can change other values as well based on where you need to place each of these elements.