[ALLY] Layout Bind or Context in stylized Layouts
[1/11] from: mike::myers::cybarite::com at: 9-Nov-2000 8:02
Layout Bind or Context in stylized Layouts
I have created a sytlized button that I want to use to leverage
the view style.
style more-info-button button 20x20 "..." [view/new/offset layout
[ h1 "Customer Information"
txt "Some explanatory text here"
button "Back" [unview]
]
150x150]
[view/new/offset layout
[ size 250x250
h1 "Purpose Information"
txt "Explain here how the field is used. This is not for customer usage."
button "Back" [unview]
]
150x150]
Works beautifully with only a line of code.
currency-more-info: more-info-button.
But what I want to do is create these and pass the values that will appear in the h1
and txt values. And others as I need to add them. This will give standard
look and feel on the more-info buttons and reduce the support code.
For example:
add-more-info: func [aHeading someDetail] [
to-block rejoin ["h1 " aHeading
" txt " someDetail
" button "Back" [unview] "
]
]
This would be invoked by:
currency-more-info: more-info-button
add-more-info "Currency" "Choose USD or local currency"
add-more-info "Currency Purpose" "Determines whether local or USD is used. Refer to user
specification document 12-September-2000 Section 14.1.3"
Or look the detail text up in a dictionary.
But when I create the function and return it as a block into layout,
I am getting a message that h1 is not understood in this context.
I think I need to bind it so that layout understands. But I don't know how to make this
bind.
Any explainers who can spare the time?
[2/11] from: jeff:rebol at: 10-Nov-2000 18:51
Howdy, Mike:
> I have created a sytlized button that I want to use to
> leverage the view style.
<<quoted lines omitted: 3>>
> txt "Some explanatory text here" button "Back" [unview]
> ] 150x150]
. . .
> Works beautifully with only a line of code.
>
> currency-more-info: more-info-button.
>
> But what I want to do is create these and pass the values
> that will appear in the h1 and txt values. And others as I
> need to add them. This will give standard look and feel on
> the more-info buttons and reduce the support code.
Here's a pretty easy way to get this:
more-info-styles: stylize [
more-info-button: button 20x20 [
view/new layout [
h1 face/texts/2
txt face/texts/3
button "back" [unview]
]
]
]
view layout [
styles more-info-styles
txt "Stuff to learn about"
more-info-button "..." "H1-text" "txt text"
]
In the later REBOL/views, additional strings found after a
style are collected by LAYOUT and deposited into the resulting
face's 'texts block.
The disadvantage of the above approach is you will have to
include "..." each time you use a more-info-button because
layout will consider the first text item to be the text of the
style.
Okay, so we need to outsmart layout somehow. Well, each style
has a field called 'init which is called when making that
style. We can hack something into 'init to always stick in
the text we want for the more-info-button like this:
more-info-styles: stylize [
more-info-button: button with [
append init [insert texts "..."]
] 20x20 [
view/new layout [
h1 face/texts/2
txt face/texts/3
button "back" [unview]
]
]
]
view layout [
styles more-info-styles
txt "Stuff to get information about"
more-info-button "H1-text" "txt-text"
]
We hack a little here with some dynamic code stuck in the
right spot because we want to get around the normal way
layout does things with your style. There's other ways to
do it, too, but above is an okay way.
> For example:
>
> add-more-info: func [aHeading someDetail] [
> to-block rejoin ["h1 " aHeading
> " txt " someDetail " button "Back" [unview] "
> ] ]
Also, just FYI:
When you use TO-BLOCK on a string, like above, you wind up
with words that don't have a context. You could get what
you want above using LOAD, or you could use REDUCE or
COMPOSE:
reduce ['h1 aHeading 'txt someDetail 'button "back" [unview]]
or
compose [h1 (aHeading) txt (someDetail) button "back" [unview]]
Hope that was helpful!
-jeff
[3/11] from: mike:myers:cybarite at: 10-Nov-2000 19:39
I have created a sytlized button that I want to use to leverage
the view style.
style more-info-button button 20x20 "..." [view/new/offset layout
[ h1 "Customer Information"
txt "Some explanatory text here"
button "Back" [unview]
]
150x150]
[view/new/offset layout
[ size 250x250
h1 "Purpose Information"
txt "Explain here how the field is used. This is not for customer
usage."
button "Back" [unview]
]
150x150]
Works beautifully with only a line of code.
currency-more-info: more-info-button.
But what I want to do is create these and pass the values that will
appear in the h1 and txt values. And others as I need to add them. This
will give standard
look and feel on the more-info buttons and reduce the support code.
For example:
add-more-info: func [aHeading someDetail] [
to-block rejoin ["h1 " aHeading
" txt " someDetail
" button "Back" [unview] "
]
]
This would be invoked by:
currency-more-info: more-info-button
add-more-info "Currency" "Choose USD or local currency"
add-more-info "Currency Purpose" "Determines whether local or USD is
used. Refer to user specification document 12-September-2000 Section
14.1.3"
Or look the detail text up in a dictionary.
But when I create the function and return it as a block into layout,
I am getting a message that h1 is not understood in this context.
I think I need to bind it so that layout understands. But I don't know
how to make this bind.
Any explainers who can spare the time?
[4/11] from: mike:myers:cybarite at: 11-Nov-2000 7:33
Wow!!!!
Thanks for taking this time Jeff.
And I'm sorry I posted the same question twice.
My email server held the first copy until after I had sent the second.
[5/11] from: jeff:rebol at: 13-Nov-2000 5:44
Howdy, Volker:
> there is also an automation for keywords like in [list
> .. data], but i have not figured it out. someone?
>
> Volker
Sure. Here's a fairly simple example of including custom
words in your style:
a-style: stylize [
color-box: box with [
colors: none
action: [
if tail? colors: next colors [
colors: head colors
]
color: first colors
show face
]
words: [colors [new/colors: copy next args]]
]
]
view layout [
styles a-style
color-box colors 255.0.0 0.255.0 0.0.255
127.20.50 30.60.90
button "Close" [unview/all]
]
In your style, you define a field called 'words, and the words
field has the format: [word [action-on-args]].
While LAYOUT is parsing the block you hand it, if it
encounters your style it will then look for your custom words
bracketed between the current style and the next style that it
can see later on. The arguments for your style's custom word
can then be determined and they are passed to the code that
you define in the "action-on-args" block. The arguments that
your custom word action-on-args block receives begin starting
on the custom word you defined. Here's an example to see how
this works more directly:
style-2: stylize [
arg-text: text with [
words: [args [new/text: reform ["My args:" args]]]
]
]
view layout [
styles style-2
txt "Hello"
arg-text black [print "ARG-TEXT"]
args [1 #2 [foo--bar] http://url]
button "Close" [unview/all]
]
Notice above that one of the real advantages to using
custom words is we can now have more than one block of
stuff associated with the style. Having more that one
block of data for a style allows us to both easily define
an action associated with a style along with the ability to
pass in other necessary stuff for the style to use.
Within the "action-on-args" block for the WORDS field, the
newly created instance of our style, arg-text, is referred
to as NEW. Whatever we do to NEW will happen to the
resulting VID object. However, with some experimentation
you'll find that if you include a string with your arg-text
instance in a layout, the string will override your setting
of the text via the 'args word. (ie:
view layout [
arg-text "This is what you'll see" args [1 2 3]
]
) Certain steps in the LAYOUT pipeline take precedence over
others because of when they happen.
For kicks we'll look at one more fun example:
style-3: stylize [
two-act-box: box with [
toggle: a1: a2: none
action: [
do func [face] either toggle: not toggle [a1][a2] self
]
words: [
action1 [new/a1: second args next args]
action2 [new/a2: second args next args]
]
]
]
view layout [
styles style-3
two-act-box "Click me" red
action1 [inform layout [text "Action 1!"]]
action2 [face/color: random 0.0.255 show face]
]
In the code above, we've created a box that has two
different actions that toggle back and forth each time you
click on the box. The trick, here, is to turn our two
separate actions into functions expecting a face, and pass
in SELF.
One other important thing to observe: At the end of the
blocks in WORDS where we define the "action-on-args" for
action1 and action2, we have "NEXT ARGS". The
"action-on-args" block of WORDS returns a value to LAYOUT,
namely it returns the position of the arguments block for
LAYOUT to know how much you've gobbled. The effect of
including "NEXT ARGS" above is to cause LAYOUT, after
parsing your style's custom word, to position itself after
the arguments that you have consumed for your custom words,
(ready to parse the next custom word). Basically, the above
example will not work unless you include those seemingly
mysterious "NEXT ARGS". :-)
Cheers--
-jeff
[6/11] from: agem:crosswinds at: 13-Nov-2000 13:26
note you can have in 'with[] variables, like [mb: button with[x: y: 123]]
which are then part of the face.
something like
layout[xybu: mb with[x: 23 y: 24]] should then be possible.
also [xybu/x ..]. then patch init..
jeffs way is nicer for text, but if it gets complicated..
there is also an automation for keywords like in [list .. data],
but i have not figured it out. someone?
Volker
[jeff--rebol--com] wrote on 10-Nov-2000/18:51:24-8:00
[7/11] from: jeff:rebol at: 13-Nov-2000 17:42
Howdy, Larry:
Welp, neato, we're all learning here. What you're looking at
below is an object that's put into the default vid-face
which holds functions to handle collecting "MULTI-facets"
and setting default values. In the older VID we'd do stuff
like:
view layout [
text "SOME TEXT" red
]
Styles only expected (could handle) a single facets (text,
color, etc...) Now you can stuff like:
view layout [
x: text "some text" "and" "even" "more" "text"
red green blue yellow pewter
[
print ["Texts:" mold x/texts newline
"Colors:" mold x/colors newline
"Alt-action:" mold get in x 'alt-action]
]
[blk2]
]
The MULTI/text function handles setting the default text for
the style while tucking away the rest of the strings in
FACE/texts, and multi/color sets the default and alternative
colors (foreground, background, etc..) while ferreting away
the others into FACE/colors. MULTI/block sets the
FACE/action, and then it defines FACE/alt-action if you have
another block. MULTI/file collects files, attempting to
load the first one as the default image for the face.
MULTI is an organizational object that helps with book
keeping for this more flexible VID Carl's developed over the
last few months. :-)
Fun stuff! --
-jeff
> I have been curious about MULTI object as well, it only
> appeared in recent exper builds, and so far no docs. For
<<quoted lines omitted: 16>>
> if pick blk 1 [face/file: first blk face/image:
> load-image first
[...snipped for bandwidth...]
[8/11] from: jeff:rebol at: 13-Nov-2000 15:36
Thanks, folks, for your kind words of encouragement. I
really enjoy trying to spread to REBOL knowledge when I can
(and I'm very much still learning all the time myself!)
> Petr asked:
>
> While you are at it - what is the purpose of 'facets and
> 'multi fields and their content?
Not sure what you mean. A facet is just a field of a face
object, like if we have:
face: make face [size: 2x2]
SIZE is a facet of the face. Other face facets are EDGE,
PARA, FONT, FEEL, RATE, etc.. I'm not clear what you mean
by "'multi fields and their content".
> Also - what's the difference between using 'with and custom
> word? (e.g. difference in setting edge's size using 'with
> and 'edge) (see my email to general ml today)
Well, WITH is a "custom word", or what is referred to in VID
as a "FACET word" (even though WITH really isn't typically a
facet of a face WITH lets you manually set various other
facets in the face when using a VID style). Below are all
the current facet words that can be found after a vid style
in a layout:
edge font para feel effect effects keycode rate colors
texts help user-data with bold italic underline left
center right top middle bottom plain of font-size
font-name font-color wrap no-wrap as-is shadow frame bevel
ibevel
I can't explain all of them at this point, but most of them
are pretty self explanatory. Let's get all crazy and use
most every facet word for a single style:
view layout [
image http://www.rebol.com/view/docs/vid-6.jpg
edge [size: 10x10 effect: [blur nub] color: 255.255.255]
font [name: "courier"] para [origin: 5x15]
feel [engage: func [face action event][
face/effect: compose [crop fit colorize (
either action = 'down [
[255.0.0 cross 255.255.255]][[0.255.0 blur]]
)
]
show face
]
] effect [colorize 0.255.0] keycode #"q" [unview/all] bold
italic left center bottom font-size 32 font-color yellow
shadow ibevel wrap "Aaaaaaahhhh!!"
]
Neato. :-) At this point we're almost programming directly at
the "face level", but in a terser, less verbose, smaller kind
of way, if you see what I mean? Using WITH, on the other
hand, is like doing IN-LINE FACE PROGRAMMING right in your
layouts for extra tight tweaking (sorta like doing in-line
assembler! (-:). VID is really a slick short hand for
programming faces.
Cheers!
-jeff
[9/11] from: larry:ecotope at: 13-Nov-2000 17:55
Hi Jeff
I have been curious about MULTI object as well, it only appeared in recent
exper builds, and so far no docs. For discussion purposes, here is a section
snipped from the BOX style in vid-styles.
multi:
make object! [
text: func [face blk][
if pick blk 1 [
face/text: first blk
face/texts: copy blk
]
]
size: func [face blk][
if pick blk 1 [
if pair? first blk [face/size: first blk]
if integer? first blk [
if none? face/size [face/size: -1x-1]
face/size/x: first blk
]
]
]
file: func [face blk][
if pick blk 1 [face/file: first blk face/image: load-image first
blk]
]
color: func [face blk][
if pick blk 1 [
either flag-face? face text [
set-font face color first blk
if pick blk 2 [face/color: second blk]
] [
face/color: first blk
]
if pick blk 2 [face/colors: copy blk]
]
]
block: func [face blk][
if pick blk 1 [
face/action: func [face value] pick blk 1
if pick blk 2 [face/alt-action: func [face value] pick blk
2]
]
]
]
Hoping for further enlightenment.
-Larry
[10/11] from: petr:krenzelok:trz:cz at: 13-Nov-2000 19:24
Ah man, fantastic - tha't what real /View geek would expect of really good
docs :-)
While you are at it - what is the purpose of 'facets and 'multi fields and
their content?
Also - what's the difference between using 'with and custom word? (e.g.
difference in setting edge's size using 'with and 'edge) (see my email to
general ml today)
Thanks,
-pekr-
[11/11] from: petr:krenzelok:trz:cz at: 14-Nov-2000 18:55
----- Original Message -----
From: Petr Krenzelok <[petr--krenzelok--trz--cz]>
To: <[ally-list--rebol--com]>
Sent: Monday, November 13, 2000 7:24 PM
Subject: [ALLY] Re: Layout Bind or Context in stylized Layouts
> Ah man, fantastic - tha't what real /View geek would expect of really good
> docs:-)
<<quoted lines omitted: 3>>
> difference in setting edge's size using 'with and 'edge) (see my email to
> general ml today)
Oh, inet servers in our company were not working today, so I can write at
home at least ....
So, Jeff, you explained 'multi already. It's cool, man. Your emails should
become part of View docs ....
Now let's continue :-) What's the 'facets field good for? Does it store all
the stuff "inside" of "main" face of the style? For reference see:
print mold select system/view/vid/vid-styles 'slider
PS: what's the difference in setting the face object words via 'with and
facet words exposed to VID dialect? If I use 'with aproach in stylize, all
subsequent styles seem to be affected ... it's bug imho ...
-pekr-
Notes
- Quoted lines have been omitted from some messages.
View the message alone to see the lines that have been omitted