tSIP 0.2.02: GUI customization

tSIP 0.2.02 contains another bunch of changes related to GUI customization after version 0.2.00, mostly in response to github issue #22.

Let's start with overall application layout and area naming convention.
tSIP 0.2.02 layout

Application has two built-in states: "collapsed" and "expanded", toggled with ">>"/"<<" buttons or by user-defined shortcut (action = "show/hide sidecar"). With default configuration "expanded" state makes main window width higher which makes three "console" columns visible giving effect of switching "console" on and off. These state names are just arbitrary - both states have identical configuration elements and they can be configured in a way that "collapsed" window is bigger than "expanded".

Main window layout settings

tSIP main window settings
Main window settings allow to define window size, call panel and dialpad panel for both states. Call panel and/or dialpad panel can be also hidden completely - this allows to build user interface just from programmable buttons.

Almost all of buttons from dialpad are programmable. Few "fixed" dialpad elements (volume buttons + sliders, transfer edit) can be hidden or moved using dedicated settings page.

Example: "console" on the left side

tSIP with console on the left

This required adding new settings defining window position offset when expanding (version 0.2.06.03) to "anchor" to the screen keeping right side in place.
tSIP console on the left

In this example "expanded" window is 220 px wider than collapsed, giving space to roughly two button columns. As normally window position is defined by left top corder, to avoid window content jumping (and create impression that window position is defined by right corder) offset of -220 px to the left was configured.

JSONedit was used to move (change "left" parameter) two button columns (buttons 15...29 and buttons 30...44) by 276 px to the left (thus two first columns are now near left window border). It could be also done manually in tSIP (using "Add/edit panel" context menu or by dragging buttons if window width would be temporary increased and window expanded to make visible area on the left and on the right from dialpad).

Configuration files: console_on_the_left.zip.

Bitmaps for button that is switching states should also be probably replaced (Settings: Branding, bitmaps) as default ">>"/"<<" might be confusing with this layout.


Back to howto list


 "Cookie monsters": 6816123    Parse time: 0.001 s