XWidget

XWidget

Not enough ratings
Finding parameters to change with code
By dantman17
An easy way to find object class names and parameters to change via code, like colors and such.
   
Award
Favorite
Favorited
Unfavorite
Finding your parameters
I found this solution when I wanted to change the colors of the widget to match a different wallpaper. I couldn't find the parameters for the fore and back colors for the progressbar on the forum.
Let me start by telling you I am not very good with coding javascript. I just muddle through, taking examples from other widgets where I can find them. (although this is all my own coding, if you can call it that!)

Finding you parameters

  • Right click on the widget you want to find parameters for.
  • Select Window - Open Folder
  • Open the file: main.xul in your preferred text / coding editor
  • find the object you want the parameters for (see below)


<layer name="BG" width="252" height="164" background.solidColor.color="0,0,0,127" background.solidColor.enabled="true" corner.corners="topleft,topright" corner.xRadius="20" corner.yRadius="20" highlight.enabled="true" highlight.horizon="30" highlight.tone="80" border.enabled="true" border.size="2" border.color="0,44,80,255"/>

say you want to change the background color.

to use in your code, find the object, BG in the example above, which is a layer used as the widgets background.

Next, find the specific parameter you want to change.
background.solidColor.color="0,0,0,127"

next you need to add the object name and the parameter together.
your code would look something like:

BG.background.solidColor.color="0,0,0,127";

Where BG is the objects name,
background.solidColor.color is the parameter name(s) I want to change.
the 0,0,0,127 is the rgba (red, green, blue, alpha) color code
add a period between the object name and the parameters.

object name.parameter1.parameter2.parameter3

to use a variable for the color, you need something like:

var BackColor = rgba(0,0,0,127);

All your coding needs to go in a function in the code window. (or directly edit the script.js file if you know what you're doing)

Below is copied directly from my time/date widget's code window:

var TextColor1 = rgba(0,130,230,255); var BorderColor = rgba(0,60,100,255); var MyColor2 = rgba(0,50,100,255); var BackColor = rgba(0,0,0,127); var BarBackColor = rgba(0,60,100,220); function widgetOnLoad() { TimeText.font.Fill.Color = TextColor1; Seconds.font.Fill.Color = TextColor1; Dots.font.Fill.Color = TextColor1; BG.Background.SolidColor.Color = BackColor; BG.Border.color = BorderColor; BG2.Background.SolidColor.Color = BackColor; BG2.Border.color = BorderColor; WeekDay.font.fill.color = TextColor1; Month.font.fill.color = TextColor1; Day.font.fill.Color = TextColor1; Year.font.Fill.Color = MyColor2; progressBar.fore.draw.solidColor.color = TextColor1; progressBar.back.draw.solidColor.color = BarBackColor; }

Now I just have to change the color codes for the variables when I want them different!

This is a flip type widget with the time on the front and date on the back.