How to put color in GTKDIALOG

For discussions about programming, programming questions/advice, and projects that don't really have anything to do with Puppy.
Message
Author
User avatar
don570
Posts: 5528
Joined: Wed 10 Mar 2010, 19:58
Location: Ontario

How to put color in GTKDIALOG

#1 Post by don570 »

I have put together two scripts , one for gtkdialog3 and
the other for the newer gtkdialog4 to show how easy it is
to put some color in message windows.

Code: Select all

#!/bin/sh


export VERSION=3.1


export MAIN_DIALOG='<window title="Examples" icon-name="gtk-info" resizable="false">

<hbox>
   

<frame>
   <vbox>
   <text width-request="100"><label>First Frame</label></text>
      <text use-markup="true"><label>"<b><u><span size='"'large'"'>Pup</span><span size='"'large'"' color='"'blue'"'>Shutdown</span> 1.6</u></b>"</label></text>
  <text use-markup="true"><label>"<b><span size='"'large'"'  color='"'blue'"'>Pup</span><span size='"'large'"' color='"'red'"'>Shutdown</span> '$VERSION'</b>"</label></text>
  <text use-markup="true"><label>"<b><span size='"'large'"' color='"'red'"'>Shutdown</span>   '$VERSION'</b>    text"</label></text>
  <text use-markup="true"><label>"<u><span size='"'large'"' color='"'red'"'>Shutdown</span></u>"</label></text>

   
   </vbox>
</frame>
    <frame>
   <vbox>
   <text width-request="50"><label>Second Frame</label></text>
      <text use-markup="true"><label>"<b><span size='"'large'"'>Pup</span><span size='"'large'"' color='"'blue'"'>Shutdown</span> 1.6</b>"</label></text>
  <text use-markup="true"><label>"<b><span size='"'large'"'  color='"'blue'"'>Pup</span><span size='"'large'"' color='"'red'"'>Shutdown</span> '$VERSION'</b>"</label></text>
  <text use-markup="true"><label>"<b><span size='"'large'"' color='"'red'"'>Shutdown</span>   '$VERSION'</b>    text"</label></text>

 <hbox>
  <text space-expand="false"  use-markup="true"><label>"<u><span size='"'large'"' color='"'red'"'>Shutdown</span></u>"</label></text>   
  <text space-expand="true" space-fill="true">
            <label>""</label> 
  </text> 
 </hbox>

<hbox>
       <button help></button> 
         
</hbox>
  
   </vbox>
</frame>
    
<vbox>
  
     <hbox>
   <vbox>
   <text height-request="110"><label> </label></text>
    <hbox><button ok></button>
    </hbox>
    
     
   </vbox>

   </hbox>
 
   </vbox>   
</hbox>

</window>
'

gtkdialog --program=MAIN_DIALOG

Some notes:
Both bold and underlining is possible simultaneously

Code: Select all

[b][u]....text.....[/u][/b]
Note the method I used to place 'Shutdown' to left of hbox

Image

A color can be a hex number instead.
You can use mtpaint to get the hex number.
The dropper can be used anywhere on
your computer screen to find the appropriate color.

Image

____________________________________________________
Last edited by don570 on Sat 18 Oct 2014, 20:04, edited 5 times in total.

User avatar
technosaurus
Posts: 4853
Joined: Mon 19 May 2008, 01:24
Location: Blue Springs, MO
Contact:

#2 Post by technosaurus »

Somewhere in the gtkdialog tips thread is an example I posted that shows all named colors from rgb.txt. (red, blue, black ...) Those are supported too, also included a tool to auto-generate a 1x1 xpm that easily can be scaled.
Check out my [url=https://github.com/technosaurus]github repositories[/url]. I may eventually get around to updating my [url=http://bashismal.blogspot.com]blogspot[/url].

User avatar
don570
Posts: 5528
Joined: Wed 10 Mar 2010, 19:58
Location: Ontario

#3 Post by don570 »

When you have the time could you track down the pages.??


_____________________________________________________
Last edited by don570 on Tue 24 Jan 2012, 20:36, edited 1 time in total.

User avatar
vovchik
Posts: 1507
Joined: Tue 24 Oct 2006, 00:02
Location: Ukraine

#4 Post by vovchik »

Dear guys,

I did a markup editor once and it is here: http://murga-linux.com/puppy/viewtopic. ... h&id=30359. I also have a simpler markup editor somewhere else on the forum.

With kind regards,
vovchik

User avatar
darkcity
Posts: 2534
Joined: Sun 23 May 2010, 19:16
Location: near here
Contact:

#5 Post by darkcity »

don570 wrote:When you have the time could you track down the pages.??
color thing is here-
http://www.murga-linux.com/puppy/viewto ... 741#559741

rgb file on pup5 is at
/usr/share/X11/rgb.txt

any examples of scripts using this?

User avatar
don570
Posts: 5528
Joined: Wed 10 Mar 2010, 19:58
Location: Ontario

#6 Post by don570 »

puppy backup ---> I put in colored word in front window
bacon recorder --> I put in a info message in color

Radky's apps are the best when it comes to color
see pupshutdown
http://www.murga-linux.com/puppy/viewtopic.php?t=56077
______________________________________________

.

User avatar
darkcity
Posts: 2534
Joined: Sun 23 May 2010, 19:16
Location: near here
Contact:

#7 Post by darkcity »

Thanks, this method seems a bit 'clunky' - and I keep messing up the syntax. :oops:

I want to make different colored buttons, perhaps a different method using sprites would be easier?

User avatar
don570
Posts: 5528
Joined: Wed 10 Mar 2010, 19:58
Location: Ontario

#8 Post by don570 »

Zigbert is experimenting with SVG
in pfind using a technique he learned from Technosaurus
but it's a little too difficult for me to understand :cry: .
http://murga-linux.com/puppy/viewtopic.php?t=76431

In bacon recorder I have an animated gif icon that can be clicked on
to launch an app. I made it with mtpaint.

So if you're looking for a fancy button that's the way to go.
___________________________________________

User avatar
darkcity
Posts: 2534
Joined: Sun 23 May 2010, 19:16
Location: near here
Contact:

#9 Post by darkcity »

sweet, svg files can be used as input ; -) eg

Code: Select all

      <button relief="2"   tooltip-text="pup">
        <input file>'/usr/share/images/sm.svg'</input>
        <action>echo monkey</action>
      </button> 
thanks :twisted: :twisted:

User avatar
don570
Posts: 5528
Joined: Wed 10 Mar 2010, 19:58
Location: Ontario

#10 Post by don570 »

I think Technosaurus method can control the
individual elements of the image such as straight lines,
arcs, circles etc. Zigbert can then define
things like color opacity size. I wish I knew more :cry:

_________________________________________________

User avatar
technosaurus
Posts: 4853
Joined: Mon 19 May 2008, 01:24
Location: Blue Springs, MO
Contact:

#11 Post by technosaurus »

Svg is very similar to html, only for images. I usually just Google svg + whatever and if it is possible, something will come up on stackoverflow, or even a full tutorial. I posted a bunch of svg line drawings in the simple icon tray thread that could be used and tweaked in inkscapelite (i usually manually adjust inkscape's code for size/readability ... SVG is supposed to be human readable)
Check out my [url=https://github.com/technosaurus]github repositories[/url]. I may eventually get around to updating my [url=http://bashismal.blogspot.com]blogspot[/url].

User avatar
darkcity
Posts: 2534
Joined: Sun 23 May 2010, 19:16
Location: near here
Contact:

#12 Post by darkcity »

great stuff, gtkdialogue seems to need over complex syntax, but I will fight on ; -)

User avatar
don570
Posts: 5528
Joined: Wed 10 Mar 2010, 19:58
Location: Ontario

#13 Post by don570 »

It is possible to change colors according to darkness of theme.
For example here I have modified parchive 1.0 by Radky

For a dark theme I changed the color automatically from blue to orange.
ie 3272C0 to FFD900


At the beginning of script I define the color ---> variable COLOUR.
I check for some common dark theme names and change the color to orange
if a dark theme name is found.

Code: Select all

export COLOUR=3272C0
#  check for dark gtk themes and change  COLOUR
if [ "`cat /root/.gtkrc-2.0 | grep  "Stardust_dark_mouse"`" ]; then
 COLOUR=FFD900 
elif [ "`cat /root/.gtkrc-2.0 | grep  "Stardust_dark_touch"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "Azenis"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "TerraNova-Aquarius"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "terminus"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "Murrina-Black"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "DarkRoomCompact"`" ]; then
 COLOUR=FFD900
 elif [ "`cat /root/.gtkrc-2.0 | grep  "PenOSmaster"`" ]; then
 COLOUR=FFD900
 fi
Note that a check has been made of the invisible file /root/.gtkrc-2.0
which records the theme name...

Code: Select all

# -- THEME AUTO-WRITTEN DO NOT EDIT
include "/usr/share/themes/Stardust_dark_mouse/gtk-2.0/gtkrc"

include "/root/.gtkrc.mine"

# -- THEME AUTO-WRITTEN DO NOT EDIT
gtk-theme-name="Stardust_dark_mouse"


Then when the window is formed on the computer screen the substitution
is made...

Code: Select all

<text use-markup=\"true\"><label>\"<b><span size='"'x-large'"'>p</span><span size='"'x-large'"' color='"'#'$COLOUR''"'>Archive</span></b>\"</label></text>


Image

Image

User avatar
zigbert
Posts: 6621
Joined: Wed 29 Mar 2006, 18:13
Location: Valåmoen, Norway
Contact:

#14 Post by zigbert »

It is possible to change colors according to darkness of theme.
For example here I have modified parchive 1.0 by Radky
Thumbs up!

To generalize the coding, I grab the active colors from /usr/lib/gtkdialog/svg_bar.


Sigmund

radky
Posts: 977
Joined: Mon 03 May 2010, 03:13

#15 Post by radky »

removed
Last edited by radky on Wed 15 Oct 2014, 23:58, edited 2 times in total.

User avatar
don570
Posts: 5528
Joined: Wed 10 Mar 2010, 19:58
Location: Ontario

#16 Post by don570 »

Good info from Zigbert and radky!!

I continued to work on this and here's an example to show how parchive
is modified.



Code: Select all

#!/bin/sh
export COLOUR=3272C0
#  check for dark gtk themes and change  COLOUR
if [ "`cat /root/.gtkrc-2.0 | grep  "Stardust_dark_mouse"`" ]; then
 COLOUR=FFD900 
elif [ "`cat /root/.gtkrc-2.0 | grep  "Stardust_dark_touch"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "Azenis"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "TerraNova-Aquarius"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "terminus"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "Murrina-Black"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "DarkRoomCompact"`" ]; then
 COLOUR=FFD900
 elif [ "`cat /root/.gtkrc-2.0 | grep  "PenOSmaster"`" ]; then
 COLOUR=FFD900
 fi
 
 export MAIN_DIALOG="
<window title=\"Example\"  window-position=\"1\">
 <vbox>
 <text use-markup=\"true\"><label>\"<b><span size='"'x-large'"'>p</span><span size='"'x-large'"' color='"'#'$COLOUR''"'>Archive</span></b>\"</label></text>
</vbox>
</window>" 
 
 gtkdialog -p MAIN_DIALOG 


User avatar
technosaurus
Posts: 4853
Joined: Mon 19 May 2008, 01:24
Location: Blue Springs, MO
Contact:

#17 Post by technosaurus »

Don't forget that many text fields can use Pango markup (colors, bold, italic, ...)
Check out my [url=https://github.com/technosaurus]github repositories[/url]. I may eventually get around to updating my [url=http://bashismal.blogspot.com]blogspot[/url].

User avatar
don570
Posts: 5528
Joined: Wed 10 Mar 2010, 19:58
Location: Ontario

#18 Post by don570 »

Radky uses weak quoting for defining the gtkdialog variable.

Most people prefer strong quoting so here is example to show the
COLOUR variable used in a typical situation.
Note that in the window that is formed the black text is automatically
switched to white. The text 'Archive' is under the control of the variable 'COLOUR' .
Note difference in how protection by quoting is done.

Images show the difference in the look of a window when a dark
theme is used. The script was the same!!

Code: Select all

#!/bin/sh
export COLOUR=3272C0
#  check for dark gtk themes and change  COLOUR
if [ "`cat /root/.gtkrc-2.0 | grep  "Stardust_dark_mouse"`" ]; then
 COLOUR=FFD900 
elif [ "`cat /root/.gtkrc-2.0 | grep  "Stardust_dark_touch"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "Azenis"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "TerraNova-Aquarius"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "terminus"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "Murrina-Black"`" ]; then
 COLOUR=FFD900 
 elif [ "`cat /root/.gtkrc-2.0 | grep  "DarkRoomCompact"`" ]; then
 COLOUR=FFD900
 elif [ "`cat /root/.gtkrc-2.0 | grep  "PenOSmaster"`" ]; then
 COLOUR=FFD900
 fi
 
 TEXT="My Text"
 
 export MAIN_DIALOG='
<window title="Example"  window-position="1">

<vbox>
     <text use-markup="true"><label>"<b><span size='"'x-large'"'>p</span><span size='"'x-large'"' color='"'#$COLOUR'"'>Archive</span></b>"</label></text>
   <text width-request="100"><label>Color Frame</label></text>
   <text use-markup="true"><label>"<b><u><span size='"'large'"'>???</span><span size='"'large'"' color='"'#DA7A05'"'>Over write</span> ??</u></b>"</label></text>
   <text use-markup="true"><label>"<b><span size='"'large'"'  color='"'blue'"'>Danger Zone</span><span size='"'large'"' color='"'red'"'>Destroy</span> '$TEXT'</b>"</label></text>
   <text use-markup="true"><label>"<b><span size='"'large'"' color='"'red'"'>Over write</span>   '$TEXT'</b>    text"</label></text>
   <text use-markup="true"><label>"<u><span size='"'large'"' color='"'#A900FF'"'>??????</span></u>"</label></text>   
</vbox>
</window>'
 
 gtkdialog -p MAIN_DIALOG 
Image
Image

User avatar
don570
Posts: 5528
Joined: Wed 10 Mar 2010, 19:58
Location: Ontario

#19 Post by don570 »

For the record here are just some of the many colors that gtkdialog supports...
aliceblue antiquewhite aqua aquamarine
azure beige bisque black
blanchedalmond blue blueviolet brown
burlywood cadetblue chartreuse chocolate
coral cornflowerblue cornsilk crimson
cyan darkblue darkcyan darkgoldenrod
darkgray darkgreen darkgrey darkkhaki
darkmagenta darkolivegreen darkorange darkorchid
darkred darksalmon darkseagreen darkslateblue
darkslategray darkslategrey darkturquoise darkviolet
deeppink deepskyblue dimgray dimgrey
dodgerblue firebrick floralwhite forestgreen
fuchsia gainsboro ghostwhite gold
goldenrod gray green greenyellow
grey honeydew hotpink indianred
indigo ivory khaki lavender
lavenderblush lawngreen lemonchiffon lightblue
lightcoral lightcyan lightgoldenrodyello lightgray
lightgreen lightgrey lightpink lightsalmon
lightseagreen lightskyblue lightslategray lightslategrey
lightsteelblue lightyellow lime limegreen
linen magenta maroon mediumaquamarine
mediumblue mediumorchid mediumpurple mediumseagreen
mediumslateblue mediumspringgreen mediumturquoise mediumvioletred
midnightblue mintcream mistyrose moccasin
navajowhite navy oldlace olive
olivedrab orange orangered orchid
palegoldenrod palegreen paleturquoise palevioletred
papayawhip peachpuff peru pink
plum powderblue purple red
rosybrown royalblue saddlebrown salmon
sandybrown seagreen seashell sienna
silver skyblue slateblue slategray
slategrey snow springgreen steelblue
tan teal thistle tomato
turquoise violet wheat white
whitesmoke yellow yellowgreen

User avatar
trio
Posts: 2076
Joined: Sun 21 Dec 2008, 15:50
Location: अनà¥￾मोदना

#20 Post by trio »

deleted
Last edited by trio on Mon 20 Oct 2014, 08:10, edited 1 time in total.

Post Reply