Input Widgets


Input widgets are used for capturing user interactions, either by cicking, typing or dragging.

They usually provide three functions:

As well as options to change the way they look/act.

For each of the above to work, we need to know which widget you are referring to - so every widget gets a unique title.

If you want your input widget to have a label, there are some auto-label functions

If you wnat to get the contents of all widgets in the GUI as a single dictionary, use: * .getAllInputs(includeEmptyInputs=False)
This will return the contents of all input fields as a dictionary.
Set includeEmptyInputs to True, if you want to include any empty input fields.

Entry


Entries are used to capture typed input from the user. They take a single parameter - a title.

There are five special-case Entries:

Entries

from appJar import gui

app=gui()

app.addEntry("e1")
app.addEntry("e2")
app.addEntry("e3")
app.addLabelEntry("Name")
app.addValidationEntry("v1")
app.addFileEntry("f1")

app.setEntryDefault("e2", "Age here")
app.setEntryValid("v1")

app.go()

Add Entries

Each of these will add the specified type of Entry, using the title provided.

Set Entries

Get Entries

TextArea


Similar to an Entry, but allows you to type text over multiple lines.

TextArea

from appJar import gui

app=gui()
app.addTextArea("t1")
app.go()

Add TextAreas

ScrolledTextArea

Set TextAreas

Get TextAreas

Search TextAreas

TextArea Fonts

Fonts are tricky on TextAreas, it's currently not possible to have different font sizes & families on different parts of a TextArea.
However, it is possible to make parts of the TextArea bold, italic or underlined.

Tag TextAreas

A simple syntax highlighter:

from appJar import gui

redWords = ("string", "integer", "boolean", "real")
greenWords = ("print", "input")

def highlightSyntax(param):
    for w in redWords:
        app.tagTextAreaPattern("ta", "red", w)
    for w in greenWords:
        app.tagTextAreaPattern("ta", "green", w)

with gui("Text Editor", "300x400") as app:
    app.text("ta", focus=True, change=highlightSyntax)
    app.tagTextArea("ta", "red", background="red", foreground="white")
    app.tagTextArea("ta", "green", background="green", foreground="white")

Button


A clickable button, that will call a function.
These are the key to starting an interactive application.
The GUI is looping, waiting for something to happen.
A button click is the classic way to start interacting with a GUI.

Whenever any function is called by the GUI, the title of the widget that called it is passed as a parameter.
That way, multiple widgets can use the same function, but different actions can be performed, depending on the name passed as a parameter.

Buttons

    from appJar import gui

    # the title of the button will be received as a parameter
    def press(btn):
        print(btn)

    app=gui()
    # 3 buttons, each calling the same function
    app.addButton("One", press)
    app.addButton("Two", press)
    app.addButton("Three", press)
    app.go()

Add Buttons

Set Buttons


Clickable text to call a function or launch a URL

Link

from appJar import gui
def press(link):
    app.infoBox("Info", "You clicked the link!")

app=gui()
app.setFont(20)
app.addLink("Click me", press)
app.addWebLink("appJar.info", "http://appJar.info")
app.go()

RadioButton


A group of round boxes, only one of which can be selected.
These are great for getting a single value, for a multiple choice question.

Radios

from appJar import gui

app=gui()
app.addRadioButton("song", "Killer Queen")
app.addRadioButton("song", "Paradise City")
app.addRadioButton("song", "Parklife")
app.go()

Add RadioButtons

Set RadioButtons

Get RadioButtons

    from appJar import gui

    def press(rb):
        print(app.getRadioButton("song"))

    app=gui()
    app.addRadioButton("song", "Killer Queen")
    app.addRadioButton("song", "Paradise City")

    # call this function, when the RadioButton changes
    app.setRadioButtonChangeFunction("song", press)

    app.addButton("PLAY", press)
    app.go()

CheckBox


A simple tick-box, with a label, that can be either ON or OFF.

CheckBoxes

from appJar import gui

app=gui()
app.setFont(20)

app.addCheckBox("Apples")
app.addCheckBox("Pears")
app.addCheckBox("Oranges")
app.addCheckBox("Kiwis")

app.setCheckBox("Oranges")

app.go()

Add CheckBoxes

Set CheckBoxes

Get CheckBoxes

OptionBox


Creates a simple drop-down box.
It is only possible to select one option from this drop-down.
Pass in a list of values to show in the drop-down box.
They will be added in the same order, with the first item shown.
If the first item is empty, a simple title - options - will be created.
Any other empty items will be removed.
If an item starts with a dash (-), it will be treated as a separator, and can't be selected.

OptionBox OptionBox

from appJar import gui

app=gui()
app.setFont(20)
app.addLabelOptionBox("Options", ["- Fruits -", "Apple", "Orange",
                        "Pear", "kiwi", "- Pets -", "Dogs", "Cats",
                        "Fish", "Hamsters"])
app.go()

Add OptionBoxes

from appJar import gui

def get(btn):
    print(app.getOptionBox("Favourite Pets"))

app=gui()
app.setFont(20)
app.addTickOptionBox("Favourite Pets", ["Dogs", "Cats", "Hamsters", "Fish"])
app.addButton("GET", get)
app.go()

Set OptionBoxes

Get OptionBoxes

SpinBox


A scrollable list of options. Up and down buttons are provided to scroll from one item to the next.
Unlike the OptionBox, you do not get a drop-down of choices, instead it spins to the next/previous option.

SpinBox

from appJar import gui

app=gui()
app.setFont(20)
app.addLabelSpinBox("options", ["Apple", "Orange", "Pear", "kiwi"])
app.go()

Add SpinBoxes

    from appJar import gui

    app=gui()
    app.setFont(20)
    app.addSpinBoxRange("Numbers", 1, 12)
    app.go()

Set SpinBoxes

Get SpinBoxes

ListBox


A box containing a list of items, single or multi-select

ListBox

from appJar import gui

app=gui()
app.setFont(20)
app.addListBox("list", ["apple", "orange", "pear", "kiwi"])
app.go()

Add ListBoxes

Set ListBoxes

from appJar import gui
def press(btn):
    items = app.getListItems("list")
    if len(items)> 0:
        app.removeListItem("list", items[0])

app=gui()
app.setFont(20)
app.addListBox("list", ["apple", "orange", "pear", "kiwi"])
app.addButton("press",  press)
app.go()

LB Colours

Get ListBoxes

Scale


A slider, that has a minimum & maximum value.

Scale

from appJar import gui

app=gui()
app.setFont(20)
app.addLabelScale("scale")
app.go()

Add Scales

Set Scales

Get Scales

Properties


A compound widget that shows multiple CheckButtons linked to a dictionary.
Note, dictionaries have no order, so when added as a dictionary, the items will be automatically sorted.

Properties Properties

from appJar import gui

toppings={"Cheese":False, "Tomato":False, "Bacon":False,
            "Corn":False, "Mushroom":False}

app=gui()
app.setBg("lightBlue")
app.setFont(20)
app.addProperties("Toppings", toppings)
app.setProperty("Toppings", "Pepper")
app.go()

Add Properties

Set Properties

Get Properties

Examples

It's possible to put Properties into ToggleFrames, and also set a Function to listen for any changes.

Properties Properties Properties

from appJar import gui

def changed(props):
    print("Changed", props)

toppings={"Cheese":False, "Tomato":False, "Bacon":False,
            "Corn":False, "Mushroom":False}

app=gui()
app.setBg("lightBlue")
app.setFont(20)

app.startToggleFrame("Toppings")
app.addProperties("Toppings", toppings)
app.setPropertiesChangeFunction("Toppings", changed)
app.stopToggleFrame()

app.go()

DatePicker


A widget to capture a date - will handle presenting accurate drop-downs, and return a date.
DatePicker

from appJar import gui

def showDate(btn):
    print(app.getDatePicker("dp"))

app=gui()
app.addDatePicker("dp")
app.addButton("GET", showDate)
app.setDatePickerRange("dp", 1900, 2100)
app.setDatePicker("dp")
app.go()

Add DatePickers

Set DatePickers

Get DatePickers

Auto-Labelled Widgets


It's possible to automatically include a label alongside some of widgets below.
Both the label and widget will be placed in the same grid space.
Simply add the word Label to the command when adding the widget: