Minor UI documentation updates
parent
7d3d234151
commit
bdaa5eac31
|
@ -9,7 +9,7 @@ HELP: <border>
|
|||
{ $description "Creates a new border around the child with the specified horizontal and vertical gap." } ;
|
||||
|
||||
ARTICLE: "ui.gadgets.borders" "Border gadgets"
|
||||
"Border gadgets add empty space around a child gadget."
|
||||
"The " { $vocab-link "ui.gadgets.borders" } " vocabulary implements border gadgets, which add empty space around a child gadget."
|
||||
{ $subsection border }
|
||||
{ $subsection <border> } ;
|
||||
|
||||
|
|
|
@ -55,7 +55,7 @@ HELP: <toolbar>
|
|||
{ $description "Creates a row of " { $link <command-button> } " gadgets invoking commands on " { $snippet "target" } ". The commands are taken from the " { $snippet "\"toolbar\"" } " command group of each class in " { $snippet "classes" } "." } ;
|
||||
|
||||
ARTICLE: "ui.gadgets.buttons" "Button gadgets"
|
||||
"Buttons respond to mouse clicks by invoking a quotation."
|
||||
"The " { $vocab-link "ui.gadgets.buttons" } " vocabulary implements buttons. Buttons respond to mouse clicks by invoking a quotation."
|
||||
{ $subsection button }
|
||||
"There are many ways to create a new button:"
|
||||
{ $subsection <button> }
|
||||
|
|
|
@ -81,13 +81,14 @@ ARTICLE: "gadgets-editors-selection" "The caret and mark"
|
|||
"Use " { $link user-input* } " to change selected text." ;
|
||||
|
||||
ARTICLE: "gadgets-editors" "Editor gadgets"
|
||||
"An editor edits a multi-line passage of text."
|
||||
"The " { $vocab-link "ui.gadgets.editors" } " vocabulary implements editor gadgets. An editor edits a passage of text."
|
||||
{ $command-map editor "general" }
|
||||
{ $command-map editor "caret-motion" }
|
||||
{ $command-map editor "selection" }
|
||||
{ $heading "Editor words" }
|
||||
{ $subsection editor }
|
||||
{ $subsection <editor> }
|
||||
{ $subsection <multiline-editor> }
|
||||
{ $subsection editor-string }
|
||||
{ $subsection set-editor-string }
|
||||
{ $subsection "gadgets-editors-selection" }
|
||||
|
|
|
@ -24,7 +24,7 @@ HELP: <labelled-pane>
|
|||
{ <labelled-pane> <pane-control> } related-words
|
||||
|
||||
ARTICLE: "ui.gadgets.labelled" "Labelled gadgets"
|
||||
"It is possible to create a labelled border around a child gadget:"
|
||||
"The " { $vocab-link "ui.gadgets.labelled" } " vocabulary implements labelled borders around child gadgets."
|
||||
{ $subsection labelled-gadget }
|
||||
{ $subsection <labelled-gadget> }
|
||||
"Or a labelled border with a close box:"
|
||||
|
|
|
@ -24,7 +24,7 @@ HELP: <label-control>
|
|||
{ <label> <label-control> } related-words
|
||||
|
||||
ARTICLE: "ui.gadgets.labels" "Label gadgets"
|
||||
"A label displays a piece of text, either a single line string or an array of line strings."
|
||||
"The " { $vocab-link "ui.gadgets.labels" } " vocabulary implements labels. A label displays a piece of text, either a single line string or an array of line strings."
|
||||
{ $subsection label }
|
||||
{ $subsection <label> }
|
||||
{ $subsection <label-control> }
|
||||
|
|
|
@ -24,7 +24,7 @@ HELP: list-value
|
|||
{ $description "Outputs the currently selected list value." } ;
|
||||
|
||||
ARTICLE: "ui.gadgets.lists" "List gadgets"
|
||||
"A list displays a list of presentations."
|
||||
"The " { $vocab-link "ui.gadgets.lists" } " vocabulary implements lists, which displays a list of presentations (see " { $link "ui.gadgets.presentations" } ")."
|
||||
{ $subsection list }
|
||||
{ $subsection <list> }
|
||||
{ $subsection list-value } ;
|
||||
|
|
|
@ -56,7 +56,7 @@ HELP: <pane-stream>
|
|||
{ with-pane make-pane } related-words
|
||||
|
||||
ARTICLE: "ui.gadgets.panes" "Pane gadgets"
|
||||
"A pane displays formatted text."
|
||||
"The " { $vocab-link "ui.gadgets.panes" } " vocabulary implements panes, which display formatted text."
|
||||
{ $subsection pane }
|
||||
{ $subsection <pane> }
|
||||
{ $subsection <scrolling-pane> }
|
||||
|
|
|
@ -42,9 +42,10 @@ HELP: show-mouse-help
|
|||
{ $description "Displays a " { $link summary } " of the " { $snippet "object" } "in the status bar of the " { $link world } " containing this presentation. This word is executed when the mouse enters the presentation." } ;
|
||||
|
||||
ARTICLE: "ui.gadgets.presentations" "Presentation gadgets"
|
||||
"Outliner gadgets are usually not constructed directly, and instead are written to " { $link "ui.gadgets.panes" } " with formatted stream output words (" { $link "presentations" } ")."
|
||||
"The " { $vocab-link "ui.gadgets.presentations" } " vocabulary implements presentations, which are graphical representations of an object, associated with the object itself (see " { $link "ui-operations" } ")."
|
||||
$nl
|
||||
"Clicking a presentation with the left mouse button invokes the object's primary operation, and clicking with the right mouse button displays a menu of all applicable operations. Presentations are usually not constructed directly, and instead are written to " { $link "ui.gadgets.panes" } " with formatted stream output words (see " { $link "presentations" } ")."
|
||||
{ $subsection presentation }
|
||||
{ $subsection <presentation> }
|
||||
"Presentations remember the object they are presenting; operations can be performed on the presented object. See " { $link "ui-operations" } "." ;
|
||||
{ $subsection <presentation> } ;
|
||||
|
||||
ABOUT: "ui.gadgets.presentations"
|
||||
|
|
|
@ -44,7 +44,7 @@ HELP: scroll>top
|
|||
{ $description "Ensures that any scroller containing " { $snippet "gadget" } " is scrolled all the way up. If no parent of " { $snippet "scroller" } " is a gadget, does nothing." } ;
|
||||
|
||||
ARTICLE: "ui.gadgets.scrollers" "Scroller gadgets"
|
||||
"A scroller displays a gadget which is larger than the visible area."
|
||||
"The " { $vocab-link "ui.gadgets.scrollers" } " vocabulary implements scroller gadgets. A scroller displays a gadget which is larger than the visible area."
|
||||
{ $subsection scroller }
|
||||
{ $subsection <scroller> }
|
||||
"Getting and setting the scroll position:"
|
||||
|
|
|
@ -48,7 +48,7 @@ HELP: <y-slider>
|
|||
{ <x-slider> <y-slider> } related-words
|
||||
|
||||
ARTICLE: "ui.gadgets.sliders" "Slider gadgets"
|
||||
"A slider allows the user to graphically manipulate a value by moving a thumb back and forth."
|
||||
"The " { $vocab-link "ui.gadgets.sliders" } " vocabulary implements slider gadgets. A slider allows the user to graphically manipulate a value by moving a thumb back and forth."
|
||||
{ $subsection slider }
|
||||
{ $subsection <x-slider> }
|
||||
{ $subsection <y-slider> }
|
||||
|
|
|
@ -1,48 +0,0 @@
|
|||
USING: accessors arrays effects help kernel locals models
|
||||
present prettyprint ui ui.gadgets.panes ui.gadgets.scrollers
|
||||
ui.gadgets.tables ui.gadgets.tracks vocabs models.filter
|
||||
ui.gadgets.search-tables sequences fry ;
|
||||
IN: scratchpad
|
||||
|
||||
SINGLETON: word-renderer
|
||||
M: word-renderer row-columns
|
||||
drop
|
||||
[ name>> ] [ stack-effect present ]
|
||||
bi 2array ;
|
||||
|
||||
SINGLETON: vocab-renderer
|
||||
M: vocab-renderer row-columns
|
||||
drop vocab-name
|
||||
1array ;
|
||||
|
||||
: search-vocabs ( vocabs search -- vocabs' )
|
||||
'[ _ swap subseq? ] filter [ >vocab-link ] map ;
|
||||
|
||||
: <vocabs-table> ( in-model -- gadget )
|
||||
vocabs <model> [ search-vocabs ] <search-table>
|
||||
vocab-renderer >>renderer
|
||||
swap >>selected-value
|
||||
"Vocabularies" <labelled-gadget> ;
|
||||
|
||||
: search-words ( words search -- words' )
|
||||
'[ _ swap name>> subseq? ] filter ;
|
||||
|
||||
: <vocab-table> ( out-model in-model -- gadget )
|
||||
[ words natural-sort ] <filter>
|
||||
[ search-words ] <search-table>
|
||||
word-renderer >>renderer
|
||||
swap >>selected-value
|
||||
"Words" <labelled-gadget> ;
|
||||
|
||||
: table-demo ( -- )
|
||||
[let | m [ f <model> ] m' [ f <model> ] |
|
||||
{ 1 0 } <track>
|
||||
{ 0 1 } <track>
|
||||
m <vocabs-table> 1/2 track-add
|
||||
m' m <vocab-table> 1/2 track-add
|
||||
1/3 track-add
|
||||
{ m' m } <compose>
|
||||
[ first2 or [ help ] when* ] <pane-control> <scroller>
|
||||
"Definition" <labelled-gadget> 2/3 track-add
|
||||
"Hi" open-status-window
|
||||
] ;
|
|
@ -0,0 +1,10 @@
|
|||
USING: help.markup help.syntax ;
|
||||
IN: ui.gadgets.tables
|
||||
|
||||
ARTICLE: "ui.gadgets.tables" "Table gadgets"
|
||||
"The " { $vocab-link "ui.gadgets.tables" } " vocabulary implements table gadgets. Table gadgets display a grid of values, with each row's columns generated by a renderer object."
|
||||
{ $subsection table }
|
||||
"Creating new tables:"
|
||||
{ $subsection <table> } ;
|
||||
|
||||
ABOUT: "ui.gadgets.tables"
|
|
@ -0,0 +1,11 @@
|
|||
USING: help.markup help.syntax ui.commands ;
|
||||
IN: ui.tools.browser
|
||||
|
||||
ARTICLE: "ui-browser" "UI browser"
|
||||
"The browser is used to display Factor code, documentation, and vocabularies."
|
||||
{ $command-map browser-gadget "toolbar" }
|
||||
{ $command-map browser-gadget "scrolling" }
|
||||
{ $command-map browser-gadget "multi-touch" }
|
||||
"Browsers are instances of " { $link browser-gadget } "." ;
|
||||
|
||||
ABOUT: "ui-browser"
|
|
@ -97,7 +97,7 @@ browser-gadget "multi-touch" f {
|
|||
} define-command-map
|
||||
|
||||
browser-gadget "scrolling"
|
||||
"The browser's scroll pane can be scrolled from the keyboard."
|
||||
"The browser's scroller can be scrolled from the keyboard."
|
||||
{
|
||||
{ T{ key-down f f "UP" } com-scroll-up }
|
||||
{ T{ key-down f f "DOWN" } com-scroll-down }
|
||||
|
|
|
@ -0,0 +1,22 @@
|
|||
USING: help.markup help.syntax ui.commands ui.gadgets.slots
|
||||
ui.gadgets.editors ;
|
||||
IN: ui.tools.inspector
|
||||
|
||||
ARTICLE: "ui-inspector" "UI inspector"
|
||||
"The graphical inspector provides functionality similar to the terminal inspector (see " { $link "inspector" } "), adding in-place editing of slot values."
|
||||
$nl
|
||||
"To display an object in the UI inspector, right-click a presentation and choose " { $strong "Inspector" } " from the menu that appears."
|
||||
$nl
|
||||
"The inspector embeds a table gadget, which supports keyboard navigation; see " { $link "ui.gadgets.tables" } ". It also provides a few other commands:"
|
||||
{ $command-map inspector-gadget "toolbar" }
|
||||
{ $command-map inspector-gadget "multi-touch" }
|
||||
"Slot values can be edited in the inspector. Clicking the ellipsis to the left of the slot's textual representation displays a slot editor gadget. A text representation of the object can be edited in the slot editor. The parser is used to turn the text representation back into an object. Keep in mind that some structure is lost in the conversion; see " { $link "prettyprint-limitations" } "."
|
||||
$nl
|
||||
"The slot editor's text editing commands are standard; see " { $link "gadgets-editors" } "."
|
||||
$nl
|
||||
"The slot editor has a toolbar containing various commands."
|
||||
{ $command-map slot-editor "toolbar" }
|
||||
"The following commands are also available."
|
||||
{ $command-map source-editor "word" } ;
|
||||
|
||||
ABOUT: "ui-inspector"
|
|
@ -2,7 +2,7 @@
|
|||
! See http://factorcode.org/license.txt for BSD license.
|
||||
USING: accessors inspector namespaces kernel models
|
||||
models.filter prettyprint sequences mirrors assocs classes
|
||||
io io.styles
|
||||
io io.styles arrays
|
||||
ui.tools.browser ui.commands ui.gadgets ui.gadgets.panes
|
||||
ui.gadgets.scrollers ui.gadgets.slots ui.gadgets.tracks
|
||||
ui.gestures ui.gadgets.buttons ui.gadgets.tables
|
||||
|
@ -11,10 +11,15 @@ IN: ui.tools.inspector
|
|||
|
||||
TUPLE: inspector-gadget < track table ;
|
||||
|
||||
TUPLE: slot-description key key-string value value-string ;
|
||||
|
||||
: <slot-description> ( key value -- slot-description )
|
||||
[ dup unparse-short ] bi@ slot-description boa ;
|
||||
|
||||
SINGLETON: inspector-renderer
|
||||
|
||||
M: inspector-renderer row-columns
|
||||
drop [ unparse-short ] map ;
|
||||
drop [ key-string>> ] [ value-string>> ] bi 2array ;
|
||||
|
||||
: <summary-gadget> ( model -- gadget )
|
||||
[
|
||||
|
@ -40,11 +45,14 @@ M: inspector-renderer row-columns
|
|||
] tabular-output
|
||||
] <pane-control> ;
|
||||
|
||||
DEFER: inspector-window
|
||||
DEFER: inspector
|
||||
|
||||
: make-slot-descriptions ( obj -- seq )
|
||||
make-mirror [ <slot-description> ] { } assoc>map ;
|
||||
|
||||
: <inspector-table> ( model -- table )
|
||||
[ make-mirror >alist ] <filter> <table>
|
||||
[ second inspector-window ] >>action
|
||||
[ make-slot-descriptions ] <filter> <table>
|
||||
[ value>> inspector ] >>action
|
||||
inspector-renderer >>renderer
|
||||
monospace-font >>font ;
|
||||
|
||||
|
@ -80,5 +88,5 @@ inspector-gadget "toolbar" f {
|
|||
{ T{ key-down f f "F1" } inspector-help }
|
||||
} define-command-map
|
||||
|
||||
: inspector-window ( obj -- )
|
||||
: inspector ( obj -- )
|
||||
<inspector-gadget> "Inspector" open-status-window ;
|
|
@ -0,0 +1,22 @@
|
|||
USING: help.markup help.syntax ui.commands ui.tools.interactor
|
||||
ui.gadgets.editors ui.gadgets.panes ;
|
||||
IN: ui.tools.listener
|
||||
|
||||
ARTICLE: "ui-listener" "UI listener"
|
||||
"The graphical listener is based around the terminal listener (" { $link "listener" } ") and adds the following features:"
|
||||
{ $list
|
||||
"Input history"
|
||||
{ "Completion (see " { $link "ui-completion" } ")" }
|
||||
{ "Clickable presentations (see " { $link "ui-presentations" } ")" }
|
||||
}
|
||||
{ $command-map listener-gadget "toolbar" }
|
||||
{ $command-map listener-gadget "scrolling" }
|
||||
{ $command-map interactor "interactor" }
|
||||
{ $command-map source-editor "word" }
|
||||
{ $command-map interactor "quotation" }
|
||||
{ $heading "Editing commands" }
|
||||
"The text editing commands are standard; see " { $link "gadgets-editors" } "."
|
||||
{ $heading "Implementation" }
|
||||
"Listeners are instances of " { $link listener-gadget } ". The listener consists of an output area (instance of " { $link pane } ") and an input area (instance of " { $link interactor } ")." ;
|
||||
|
||||
ABOUT: "ui-listener"
|
|
@ -16,9 +16,8 @@ IN: ui.tools.operations
|
|||
V{ } clone operations set-global
|
||||
|
||||
! Objects
|
||||
[ drop t ] \ inspector-window H{
|
||||
[ drop t ] \ inspector H{
|
||||
{ +primary+ t }
|
||||
{ +listener+ t }
|
||||
} define-operation
|
||||
|
||||
: com-prettyprint ( obj -- ) . ;
|
||||
|
|
|
@ -18,47 +18,6 @@ $nl
|
|||
$nl
|
||||
"Presentation gadgets can be constructed directly using the " { $link <presentation> } " word, and they can also be written to " { $link pane } " gadgets using the " { $link write-object } " word." ;
|
||||
|
||||
ARTICLE: "ui-listener" "UI listener"
|
||||
"The graphical listener is based around the terminal listener (" { $link "listener" } ") and adds the following features:"
|
||||
{ $list
|
||||
"Input history"
|
||||
{ "Completion (see " { $link "ui-completion" } ")" }
|
||||
{ "Clickable presentations (see " { $link "ui-presentations" } ")" }
|
||||
}
|
||||
{ $command-map listener-gadget "toolbar" }
|
||||
{ $command-map listener-gadget "scrolling" }
|
||||
{ $command-map interactor "interactor" }
|
||||
{ $command-map source-editor "word" }
|
||||
{ $command-map interactor "quotation" }
|
||||
{ $heading "Editing commands" }
|
||||
"The text editing commands are standard; see " { $link "gadgets-editors" } "."
|
||||
{ $heading "Implementation" }
|
||||
"Listeners are instances of " { $link listener-gadget } ". The listener consists of an output area (instance of " { $link pane } ") and an input area (instance of " { $link interactor } ")." ;
|
||||
|
||||
ARTICLE: "ui-inspector" "UI inspector"
|
||||
"The graphical inspector builds on the terminal inspector (see " { $link "inspector" } ") and provides in-place editing of slot values."
|
||||
$nl
|
||||
"To display an object in the UI inspector, use the " { $link inspect } " word from the UI listener, or right-click a presentation and choose " { $strong "Inspect" } " from the menu that appears."
|
||||
$nl
|
||||
"When the UI inspector is running, all of the terminal inspector words are available, such as " { $link &at } " and " { $link &put } ". Changing slot values using terminal inspector words automatically updates the UI inspector display."
|
||||
$nl
|
||||
"Slots can also be edited graphically. Clicking the ellipsis to the left of the slot's textual representation displays a slot editor gadget. A text representation of the object can be edited in the slot editor. The parser is used to turn the text representation back into an object. Keep in mind that some structure is lost in the conversion; see " { $link "prettyprint-limitations" } "."
|
||||
$nl
|
||||
"The slot editor's text editing commands are standard; see " { $link "gadgets-editors" } "."
|
||||
$nl
|
||||
"The slot editor has a toolbar containing various commands."
|
||||
{ $command-map slot-editor "toolbar" }
|
||||
{ $command-map inspector-gadget "multi-touch" }
|
||||
"The following commands are also available."
|
||||
{ $command-map source-editor "word" } ;
|
||||
|
||||
ARTICLE: "ui-browser" "UI browser"
|
||||
"The browser is used to display Factor code, documentation, and vocabularies."
|
||||
{ $command-map browser-gadget "toolbar" }
|
||||
{ $command-map browser-gadget "scrolling" }
|
||||
{ $command-map browser-gadget "multi-touch" }
|
||||
"Browsers are instances of " { $link browser-gadget } "." ;
|
||||
|
||||
ARTICLE: "ui-profiler" "UI profiler"
|
||||
"The graphical profiler is based on the terminal profiler (see " { $link "profiling" } ") and adds more convenient browsing of profiler results."
|
||||
$nl
|
||||
|
|
|
@ -98,7 +98,8 @@ ARTICLE: "gadgets" "Pre-made UI gadgets"
|
|||
{ $subsection "ui.gadgets.menus" }
|
||||
{ $subsection "ui.gadgets.panes" }
|
||||
{ $subsection "ui.gadgets.presentations" }
|
||||
{ $subsection "ui.gadgets.lists" } ;
|
||||
{ $subsection "ui.gadgets.lists" }
|
||||
{ $subsection "ui.gadgets.tables" } ;
|
||||
|
||||
ARTICLE: "ui-geometry" "Gadget geometry"
|
||||
"The " { $link gadget } " class inherits from the " { $link rect } " class, and thus all gadgets have a bounding box:"
|
||||
|
|
Loading…
Reference in New Issue