| Author |
Message |
don570
Joined: 10 Mar 2010
Posts: 4375
Location: Ontario
|
 Posted: Wed 12 Feb 2014, 19:41 Post subject:
 Togglebutton with SVG images |
|
Here is an example of a togglebutton using 2 SVG images. Each image
corresponds to different data ---> a list widget is filled with data
One button is used and the label text changes.
The two svg images are renamed to make programming the togglebutton
easier
| Code: |
cp /tmp/SVG_Description.svg /tmp/true.svg
cp /tmp/SVG_Cities.svg /tmp/false.svg
|
...since true and false is the variables output.
There is a third svg image created in /tmp/ ---> SVG_Function.svg
This is for a simple button that is hidden when the script is first launched,
then it becomes the 'Function' button.
Note that | Code: | | <action>clear:LIST</action> |
is needed to stop the list from
growing.
| Code: |
#!/bin/bash
# make two svg images - labeled Cities and Description
for LABEL in 1 2 3 ;do
[ $LABEL -eq 1 ] && TEXT="Cities List"
[ $LABEL -eq 2 ] && TEXT="Description"
[ $LABEL -eq 3 ] && TEXT="Function"
X1=$(echo "$TEXT"|wc -c) # number of letters
W=$((${X1}*6*95/31))
DISPLACE=$(($W/7))
echo '<svg version="1.1">
<rect
style="fill:white;fill-opacity:.7;stroke-width:2;stroke:black;stroke-opacity:1;"
width='\"$W\"' height="36" rx="10" ry="10" x="1" y="1"/>
<text style="font-family:DejaVu;font-size:24;fill-opacity:1"
x='\"$DISPLACE\"' y="26" >
'$TEXT'
</text>
</svg>
'>/tmp/SVG_$TEXT.svg
done
cp /tmp/SVG_Description.svg /tmp/true.svg
cp /tmp/"SVG_Cities List.svg" /tmp/false.svg
#ln -sf /tmp/SVG_Description.svg /tmp/togglebutton.svg
mkdir -p /tmp/cities
echo 'High crime rate
Dirty
Skyscrappers' > /tmp/cities/"New York"
cp -f /tmp/cities/"New York" /tmp/cities/default
echo 'Windy
Cold
Sausage factories' > /tmp/cities/Chicago
echo 'Sunny
Dry
Hollywood' > /tmp/cities/"Los Angeles"
echo 'New York
Chicago
Los Angeles' > /tmp/cities/CITY_LIST
echo CITY_LIST > /tmp/cities/city
function function_switch {
if [ "$(cat /tmp/cities/city)" = CITY_LIST ];then
echo "New York" > /tmp/cities/city
else
echo CITY_LIST > /tmp/cities/city
fi
}
export -f function_switch
function function_switch2 {
if [ "$LIST" = "NEW York" ];then
echo "New York" > /tmp/cities/city
cp -f /tmp/cities/"$(cat /tmp/cities/city)" /tmp/cities/default
fi
if [ "$LIST" = "Chicago" ];then
echo "Chicago" > /tmp/cities/city
cp -f /tmp/cities/"$(cat /tmp/cities/city)" /tmp/cities/default
fi
if [ "$LIST" = "Los Angeles" ];then
echo "Los Angeles" > /tmp/cities/city
cp -f /tmp/cities/"$(cat /tmp/cities/city)" /tmp/cities/default
fi
}
export -f function_switch2
export MAIN_DIALOG='
<window title="Toggle text" border-width="20">
<vbox>
<list selected-row="0">
<variable>LIST</variable>
<height>200</height>
<width>250</width>
<input file>/tmp/cities/default</input>
</list>
<hbox>
<button>
<variable>BUTTON</variable>
<input file>/tmp/SVG_Function.svg</input>
<action>xmessage "You clicked a button - $LIST" &</action>
</button>
<togglebutton active="true">
<variable>togglebutton</variable>
<action>ln -sf /tmp/"$togglebutton".svg /tmp/togglebutton.svg</action>
<action>function_switch2</action>
<action>cp -f /tmp/cities/"$(cat /tmp/cities/city)" /tmp/cities/default</action>
<action>function_switch</action>
<action>if true hide:BUTTON</action>
<action>if false show:BUTTON</action>
<action>clear:LIST</action>
<action>refresh:LIST</action>
<action>refresh:togglebutton</action>
<input file>/tmp/togglebutton.svg</input>
</togglebutton>
</hbox>
</vbox>
<variable>MAIN_DIALOG</variable>
</window>'
gtkdialog --program=MAIN_DIALOG
|
Last edited by don570 on Sat 15 Feb 2014, 15:00; edited 1 time in total
|
|
Back to top
|
|
 |
L18L
Joined: 19 Jun 2010
Posts: 3349
Location: www.eussenheim.de/
|
| Posted: Thu 13 Feb 2014, 04:42 Post subject:
Re: Togglebutton with SVG images |
|
I am thinking about
| Code: | | for LABEL in $(gettext 'Cities') $(gettext('Description') $(gettext 'Function');do |
now 
that is really useful.
Thank you don570
|
|
Back to top
|
|
|
don570
Joined: 10 Mar 2010
Posts: 4375
Location: Ontario
|
| Posted: Sat 15 Feb 2014, 15:10 Post subject:
|
|
I decided to rewrite the script -----> one line wasn't needed
so I commented it out
| Code: | | #ln -sf /tmp/SVG_Description.svg /tmp/togglebutton.svg |
and I realised that a small change would allow white space in the
button labels
| Code: |
for LABEL in 1 2 3 ;do
[ $LABEL -eq 1 ] && TEXT="Cities List"
[ $LABEL -eq 2 ] && TEXT="Description"
[ $LABEL -eq 3 ] && TEXT="Function"
|
The three SVG images are generated in /tmp
| Code: | | '>/tmp/SVG_$TEXT.svg |
The revised script is available in the first post.
_______________________________
Note to L18L : Apparently whitespace in the variable LABEL isn't
important when looping?? You have more experience in gettext than me.
| Code: | | for LABEL in $(gettext 'Cities') $(gettext('Description') $(gettext 'Function');do |
|
|
Back to top
|
|
|
L18L
Joined: 19 Jun 2010
Posts: 3349
Location: www.eussenheim.de/
|
| Posted: Sun 16 Feb 2014, 07:57 Post subject:
|
|
| don570 wrote: | Apparently whitespace in the variable LABEL isn't
important when looping? | Code: | | for LABEL in $(gettext 'Cities') $(gettext('Description') $(gettext 'Function');do |
|
| Code: | | for LABEL in "$(gettext 'Cities')" "$(gettext('Description')" "$(gettext 'Function')";do |
should work also for whitespaced items.
I have been playing with your script: | Code: | #!/bin/sh
# make two svg images - labeled Cities and Description
export TEXTDOMAIN=togglebuttons
for LABEL in 1 2 3 ;do
[ $LABEL -eq 1 ] && TEXT="$(gettext 'Cities List')"
[ $LABEL -eq 2 ] && TEXT="$(gettext 'Description')"
[ $LABEL -eq 3 ] && TEXT="$(gettext 'Function')"
X1=$(echo "$TEXT"|wc -c) # number of letters
W=$((${X1}*6*95/31))
DISPLACE=$(($W/7))
echo '<svg version="1.1">
<rect
style="fill:white;fill-opacity:.7;stroke-width:2;stroke:black;stroke-opacity:1;"
width='\"$W\"' height="36" rx="10" ry="10" x="1" y="1"/>
<text style="font-family:DejaVu;font-size:24;fill-opacity:1"
x='\"$DISPLACE\"' y="26" >
'$TEXT'
</text>
</svg>
'>/tmp/SVG_$TEXT.svg
done
#cp /tmp/SVG_Description.svg /tmp/true.svg
cp /tmp/SVG_"$(gettext 'Description')".svg /tmp/true.svg
#cp /tmp/"SVG_Cities List.svg" /tmp/false.svg
cp /tmp/SVG_"$(gettext 'Cities List')".svg /tmp/false.svg
#ln -sf /tmp/SVG_Description.svg /tmp/togglebutton.svg
mkdir -p /tmp/cities
echo "$(gettext 'High crime rate
Dirty
Skyscrappers')" > /tmp/cities/"New York"
cp -f /tmp/cities/"New York" /tmp/cities/default
echo "$(gettext 'Windy
Cold
Sausage factories')" > /tmp/cities/Chicago
echo "$(gettext 'Sunny
Dry
Hollywood')" > /tmp/cities/"Los Angeles"
echo 'New York
Chicago
Los Angeles' > /tmp/cities/CITY_LIST
echo CITY_LIST > /tmp/cities/city
function function_switch {
if [ "$(cat /tmp/cities/city)" = CITY_LIST ];then
echo "New York" > /tmp/cities/city
else
echo CITY_LIST > /tmp/cities/city
fi
}
export -f function_switch
function function_switch2 {
if [ "$LIST" = "NEW York" ];then
echo "New York" > /tmp/cities/city
cp -f /tmp/cities/"$(cat /tmp/cities/city)" /tmp/cities/default
fi
if [ "$LIST" = "Chicago" ];then
echo "Chicago" > /tmp/cities/city
cp -f /tmp/cities/"$(cat /tmp/cities/city)" /tmp/cities/default
fi
if [ "$LIST" = "Los Angeles" ];then
echo "Los Angeles" > /tmp/cities/city
cp -f /tmp/cities/"$(cat /tmp/cities/city)" /tmp/cities/default
fi
}
export -f function_switch2
export MAIN_DIALOG='
<window title="Toggle text" border-width="20">
<vbox>
<list selected-row="0">
<variable>LIST</variable>
<height>200</height>
<width>250</width>
<input file>/tmp/cities/default</input>
</list>
<hbox>
<button>
<variable>BUTTON</variable>
<input file>/tmp/SVG_'$(gettext 'Function')'.svg</input>
<action>MSG="'$(gettext 'You clicked a button')'";xmessage "$MSG - $LIST" &</action>
</button>
<togglebutton active="true">
<variable>togglebutton</variable>
<action>ln -sf /tmp/"$togglebutton".svg /tmp/togglebutton.svg</action>
<action>function_switch2</action>
<action>cp -f /tmp/cities/"$(cat /tmp/cities/city)" /tmp/cities/default</action>
<action>function_switch</action>
<action>if true hide:BUTTON</action>
<action>if false show:BUTTON</action>
<action>clear:LIST</action>
<action>refresh:LIST</action>
<action>refresh:togglebutton</action>
<input file>/tmp/togglebutton.svg</input>
</togglebutton>
</hbox>
</vbox>
<variable>MAIN_DIALOG</variable>
</window>'
gtkdialog --program=MAIN_DIALOG |
...
fun
changed "Städteliste" to "Liste der Städte" to have some whitespace. It worked using "$(gettext '... ... ...')"
Hope to see your fr_CA localization soon.
| Description |
Quiz: which city? |
| Filesize |
5.02 KB |
| Viewed |
478 Time(s) |
|
|
|
Back to top
|
|
|
don570
Joined: 10 Mar 2010
Posts: 4375
Location: Ontario
|
| Posted: Tue 18 Feb 2014, 16:23 Post subject:
|
|
I finished the gettext version of script. I made it as general as possible
so that it can be converted to other uses.
| Code: |
#!/bin/sh
# make two svg images - labeled Cities and Description
export TEXTDOMAIN=Script_togglebutton.sh
export OUTPUT_CHARSET=UTF-8
for LABEL in 1 2 3 ;do
[ $LABEL -eq 1 ] && TEXT="$(gettext 'Cities List')"
[ $LABEL -eq 2 ] && TEXT="$(gettext 'Description')"
[ $LABEL -eq 3 ] && TEXT="$(gettext 'Function')"
X1=$(echo "$TEXT"|wc -c) # number of letters
W=$((${X1}*6*95/31))
DISPLACE=$(($W/7))
echo '<svg version="1.1">
<rect
style="fill:white;fill-opacity:.7;stroke-width:2;stroke:black;stroke-opacity:1;"
width='\"$W\"' height="36" rx="10" ry="10" x="1" y="1"/>
<text style="font-family:DejaVu;font-size:24;fill-opacity:1"
x='\"$DISPLACE\"' y="26" >
'$TEXT'
</text>
</svg>
'>/tmp/SVG_$TEXT.svg
done
cp /tmp/SVG_"$(gettext 'Description')".svg /tmp/true.svg
cp /tmp/SVG_"$(gettext 'Cities List')".svg /tmp/false.svg
#ln -sf /tmp/SVG_Description.svg /tmp/togglebutton.svg
mkdir -p /tmp/cities
echo "$(gettext 'High crime rate
Dirty
Skyscrappers')" > /tmp/cities/"$(gettext 'New York')"
cp -f /tmp/cities/"$(gettext 'New York')" /tmp/cities/default
echo "$(gettext 'Windy
Cold
Sausage factories')" > /tmp/cities/"$(gettext 'Chicago')"
echo "$(gettext 'Sunny
Dry
Hollywood')" > /tmp/cities/"$(gettext 'Los Angeles')"
echo "$(gettext 'New York')
$(gettext 'Chicago')
$(gettext 'Los Angeles')" > /tmp/cities/CITY_LIST
echo CITY_LIST > /tmp/cities/city
function function_switch {
if [ "$(cat /tmp/cities/city)" = CITY_LIST ];then
echo "$(gettext 'New York')" > /tmp/cities/city
else
echo CITY_LIST > /tmp/cities/city
fi
}
export -f function_switch
function function_switch2 {
if [ "$LIST" = "$(gettext 'New York')" ];then
echo "$(gettext 'New York')" > /tmp/cities/city
cp -f /tmp/cities/"$(cat /tmp/cities/city)" /tmp/cities/default
fi
if [ "$LIST" = "$(gettext 'Chicago')" ];then
echo "$(gettext 'Chicago')" > /tmp/cities/city
cp -f /tmp/cities/"$(cat /tmp/cities/city)" /tmp/cities/default
fi
if [ "$LIST" = "$(gettext 'Los Angeles')" ];then
echo "$(gettext 'Los Angeles')" > /tmp/cities/city
cp -f /tmp/cities/"$(cat /tmp/cities/city)" /tmp/cities/default
fi
}
export -f function_switch2
export MAIN_DIALOG='
<window title="'$(gettext 'Toggle text')'" border-width="20">
<vbox>
<list selected-row="0">
<variable>LIST</variable>
<height>200</height>
<width>250</width>
<input file>/tmp/cities/default</input>
</list>
<hbox>
<button>
<variable>BUTTON</variable>
<input file>/tmp/SVG_Function.svg</input>
<action>xmessage "You clicked a button - $LIST" &</action>
</button>
<togglebutton active="true">
<variable>togglebutton</variable>
<action>ln -sf /tmp/"$togglebutton".svg /tmp/togglebutton.svg</action>
<action>function_switch2</action>
<action>cp -f /tmp/cities/"$(cat /tmp/cities/city)" /tmp/cities/default</action>
<action>function_switch</action>
<action>if true hide:BUTTON</action>
<action>if false show:BUTTON</action>
<action>clear:LIST</action>
<action>refresh:LIST</action>
<action>refresh:togglebutton</action>
<input file>/tmp/togglebutton.svg</input>
</togglebutton>
</hbox>
</vbox>
<variable>MAIN_DIALOG</variable>
</window>'
gtkdialog --program=MAIN_DIALOG
|
Last edited by don570 on Tue 18 Feb 2014, 16:32; edited 1 time in total
|
|
Back to top
|
|
|
don570
Joined: 10 Mar 2010
Posts: 4375
Location: Ontario
|
| Posted: Tue 18 Feb 2014, 16:29 Post subject:
|
|
On the subject of white space....
Put some files with white space in your home folder
and run this script. The double quotes protect the white space.
Apparently it only goes around the loop once.
Afterwards remove the double quotes and try again. It will loop but it will not
show the filenames with white space properly.
| Code: |
#!/bin/sh
for file in "$(ls)";do
echo "file = $file"
done |
|
|
Back to top
|
|
|
don570
Joined: 10 Mar 2010
Posts: 4375
Location: Ontario
|
| Posted: Thu 20 Feb 2014, 21:22 Post subject:
unit conversion |
|
I've made a practical script for unit conversion.
It modifies the above script...
You can test it here....
http://murga-linux.com/puppy/viewtopic.php?p=760041#760041
_________________________________________________
|
|
Back to top
|
|
|
mavrothal
Joined: 24 Aug 2009
Posts: 2749
|
| Posted: Wed 04 Feb 2015, 09:55 Post subject:
|
|
Sorry for reviving a year old thread, but can you have a toggle button refreshing itself? ie
if true, toggle-button-label 1 toggle-button-icon 1, action a, b, c
if false, toggle-button-label 2, toggle-button-icon 2 action d, e, f
where label text and icons are to the standard gtk (open, ok etc) but custom.
Can the <label> and maybe <input file icon=""> definition to be state sensitive?
Thanks
BTW nice gtkdialog tutorial but couldn't find anything on togglebuttons in it.
_________________
Kids all over the world go around with an XO laptop. They deserve one puppy (or many) too 
|
|
Back to top
|
|
|
MochiMoppel
Joined: 26 Jan 2011
Posts: 1111
Location: Japan
|
| Posted: Wed 04 Feb 2015, 10:13 Post subject:
|
|
| mavrothal wrote: | | Sorry for reviving a year old thread, but can you have a toggle button refreshing itself? |
Don't know if this is what you are looking for.
|
|
Back to top
|
|
|
mavrothal
Joined: 24 Aug 2009
Posts: 2749
|
| Posted: Wed 04 Feb 2015, 10:22 Post subject:
|
|
| MochiMoppel wrote: | | mavrothal wrote: | | Sorry for reviving a year old thread, but can you have a toggle button refreshing itself? |
Don't know if this is what you are looking for. |
That is the functionality I want on the button itself, but using the togglebutton widget rather than overlaying two buttons and play with their visibility.
_________________
Kids all over the world go around with an XO laptop. They deserve one puppy (or many) too
|
|
Back to top
|
|
|
zigbert
Joined: 29 Mar 2006
Posts: 6307
Location: Valåmoen, Norway
|
| Posted: Wed 04 Feb 2015, 10:41 Post subject:
|
|
The key to solve this is to use a svg icon containing both the label and the icon.
Note that it's only the <input> tag that can be refreshed for any widget. Before Thunor opened support of togglebuttons, we use the widget <checkbox draw_indicator="false"> which also shows a normal button on/off. But, as the <input> tag for a <checkbox> refreshes the value of its state (true/false), you can not refresh the label/icon. For <togglebutton> the <input> tag refreshes the icon, so the label will be static - else we include this into the icon.
and, yes. The togglebutton can refresh itself.
Sigmund
_________________
Stardust resources
|
|
Back to top
|
|
|
mavrothal
Joined: 24 Aug 2009
Posts: 2749
|
| Posted: Wed 04 Feb 2015, 10:50 Post subject:
|
|
| zigbert wrote: | | The key to solve this is to use a svg icon containing both the label and the icon. |
So basically you need custom icons to toggle the buttons? 
Forget it.
_________________
Kids all over the world go around with an XO laptop. They deserve one puppy (or many) too
|
|
Back to top
|
|
|
don570
Joined: 10 Mar 2010
Posts: 4375
Location: Ontario
|
| Posted: Thu 05 Feb 2015, 20:40 Post subject:
|
|
There are lots of examples of 'refreshing' by Thunor.
Available HERE
Some can be difficult to understand because he uses complex functions.
_____________________________________________________________
|
|
Back to top
|
|
|
mavrothal
Joined: 24 Aug 2009
Posts: 2749
|
| Posted: Fri 06 Feb 2015, 04:08 Post subject:
|
|
| don570 wrote: | There are lots of examples of 'refreshing' by Thunor.
Available HERE
Some can be difficult to understand because he uses complex functions.
|
That was very helpful and i can actually do the icon toggle
However I'm trying to work around Zigbert's code that is using the xpl_button_icon script to insert the icon in the button. so I added in the dialog script:
| Code: | OPEN_ICON="`/usr/lib/gtkdialog/xml_button-icon package_remove`"
CLOSE_ICON="`/usr/lib/gtkdialog/xml_button-icon close`"
export OPEN_ICON CLOSE_ICON
ICON="$OPEN_ICON"
change_icon () {
[ "$ICON" = "$OPEN_ICON" ] && ICON="$CLOSE_ICON" || ICON="$OPEN_ICON"
export ICON
}
export -f change_icon
# and change the button code to
<togglebutton tooltip-text="'$(gettext 'Open/Close the Uninstall packages window')'" space-expand="false" space-fill="false">
<label>" '$(gettext 'Uninstall')' "</label>
'${ICON}'
<variable>BUTTON_UNINSTALL</variable>
<action>change_icon</action>
<action>refresh:BUTTON_UNINSTALL</action>
<action>if true show:VBOX_REMOVE</action>
<action>if false hide:VBOX_REMOVE</action>
</togglebutton>
|
But it fails.
Basically I have no way to export the current ${ICON} from the dialog (action "export" is not recognized) and if I export it from the function as it is written now, does not appear to be taken by the dialog.
(unless the refresh action does not work with the xml_button-icon  )
Any hints on that?
Thanks
_________________
Kids all over the world go around with an XO laptop. They deserve one puppy (or many) too
|
|
Back to top
|
|
|
zigbert
Joined: 29 Mar 2006
Posts: 6307
Location: Valåmoen, Norway
|
| Posted: Fri 06 Feb 2015, 04:46 Post subject:
|
|
You can not refresh the gtkdialog-code itself - this is already executed by gtkdialog. The way to do it is to
- define input: <input file>/tmp/button-icon.svg</input>
- if true: cp /usr/share/pixmaps/puppy/close.svg /tmp/button-icon.svg
- refresh button
Another solution is to hide/show 2 (toggle)buttons with different icons (and labels)
_________________
Stardust resources
|
|
Back to top
|
|
|
|
FAQ
Search
Memberlist
Usergroups
Register
Profile
Log in to check your private messages
Log in
Forum index » Off-Topic Area » Programming
