Livecode Wiki
Don't have an account?
Register
Register
Livecode Wiki
Livecode Wiki
2,318
pages
in: Controls, GUI, Ui

Changes: Field

Back to page
Edit
(Created page with " Field object is used for many purpose in LiveCode, is so rich of option that it's used also for text, scrolling fields and much more.")
 
(Clarity and spelling -bogs)
Tags: Visual edit apiedit
(26 intermediate revisions by 3 users not shown)
Line 1: Line 1:
   
−
Field object is used for many purpose in LiveCode, is so rich of option that it's used also for text, scrolling fields and much more.
 +
The Field object is used for many purposes in LiveCode, it has so many options that it is used for text, scrolling fields, and much more. Pay attention to the basic table object option, since it creates "phantom fields", one per cell like '''field "revCell-2,3"''' (row,column); this way you can intercept messages easily when working with cells.
  +
  +
  +
==Basic Properties==
  +
  +
*[[Name]]
  +
*[[tool tip]]
  +
*Style (see slide-show on the right):<gallery type="slideshow">
  +
Wrap.jpg
  +
VertScrolBar.jpg
  +
ShowBorders.jpg
  +
ShowBorders3D.jpg
  +
FieldOpaque.jpg
  +
List.jpg
  +
HScrolBar.jpg
  +
FiledVisible.jpg
  +
FiledDisabled.jpg
  +
Dontwrap.jpg
  +
</gallery>
  +
**'''Disabled:''' it becomes gray and not editable
  +
**'''Visible: '''if it's false, object is invisible
  +
**'''share text''': if you set it as a group, you decide if it's the same on all cards or not.
  +
**'''Don't wrap'''
  +
**'''Lock text''': if a text is focusable, you can also specify if user can change it or not.
  +
**'''Opaque''': it means that background is not transparent
  +
**'''Focusable''': it's mandatory if user has to edit field
  +
**'''Focus border''': Displays a border around the active control.
  +
**'''Tab on Return''': pressing return is the same as pressing tab on this object, so it will move to the next cell.
  +
**'''Three dimensional''': graphic effect
  +
**'''Show border''': a box border visible
  +
*Scrollbars
  +
*Hilites
  +
**[[auto hilite]]
  +
**List behavior
  +
*Line height
  +
*[[Layer mode]]
  +
*[[Behavior]]
  +
  +
==Contents==
  +
Here there is a large area where you can add text, see it with the wrap line on,  transform it into a table, or load from a file. This property is called '''TEXT'''. Example:
  +
set the text of field "myfield" to "Hello world"
  +
  +
When the content is set like a table, content is a simple tabbed text. Every cell is separated from the other with a TAB, every line is separated from the other with a newline. For example, the following can be a 3x3 table:
  +
11 12 13
  +
21 22 23
  +
31 32 33
  +
  +
Creating a TABBED table is easy, look the following example:
  +
put "11" & tab & "12" & return & "21" & tab & "22" into myvar
  +
  +
In a '''scrolling list''', every line is a line list.
  +
  +
==Table==
  +
Here you can transform the object in a table, setting if editable or not, formatting or not, tab stop size, and many other option.
  +
*'''basic table object:''' this option activates table capabilities
  +
**'''cell editing''': user can edit text cell by cell
  +
**'''maximum editable column''': last column user can edit
  +
**'''cell formatting''':
  +
*'''text baseline''': show dotted horizontal lines
  +
*'''horizontal grid''': activate table horizontal lines
  +
*'''vertical grid''': activate table vertical lines
  +
*'''tab stops''': number of pixels of column width
  +
  +
In a single '''field''', you can put both normal text and tables. [[Tables and text|Here you can find a guide]]
  +
  +
==Icons & Border==
  +
*[[Icon]]
  +
*'''Hilite Icon''': icon when the button is pressed
  +
*'''Disabled Icon''': icon when the button is disabled
  +
*'''Visited Icon''': icon when the button was pressed at least one time. You can reset a visited button setting the '''visited''' property to false
  +
*[[Armed Icon]]
  +
*'''Hover Icon''': when mouse is on the object
  +
*'''Three D''': effect of the button
  +
*'''Border''': border of the button
  +
*'''Hilite border''': special border when pressed
  +
*'''Border width'''
  +
*'''Shadow''': shadow effect of the button
  +
*'''Shadow offset''': distance of the shadow from the button
  +
  +
==Colors & patterns==
  +
Here you can set the color of various elements of the button. You can choose a [[pattern]] instead of a color.
  +
  +
==Custom properties==
  +
[[Custom properties]] are the best replacement for variables in LiveCode. You can use variables in LiveCode, but usually they are temporary, where as custom properties are real containers for all your data. They are easy to retrieve and to check.
  +
  +
==Geometry==
  +
See [[Geometry manager]]
  +
  +
==Graphic effects==
  +
Here yo can activate and mix many effects: [[File:GraphicEffects.jpg|thumb]]
  +
*drop shadow
  +
*inner shadow
  +
*outer glow
  +
*inner glow
  +
*color overlay
  +
If you activate the '''drop shadow''', you can manipulate all aspects of it (color, opacity, position, etc.) with the sub-menu.
  +
  +
==Blending==
  +
The [[blending]] effect is a way to make the object transparent, you can choose between many ways to render the resulting object (arithmetic, subpin, etc.). You can choose the percentage of blending your object with the background.
  +
  +
==Property profiles==
  +
All the properties of an object are inherited from a master profile, however you can add and change profiles. This way all objects will have the same properties, will look the same or act the same.
  +
  +
==Size & Position==
  +
Here you can
  +
  +
*specify the size of the object
  +
  +
*fit it to text content
  +
  +
*set location using the center of the object or its borders
  +
*lock size and position
  +
*choose which element is above the others, by specifying object layer
  +
  +
==Text formatting==
  +
Here you can change:
  +
*font type
  +
*font size (you can enter the size directly, you are not restricted to the few shown)
  +
*font style:
  +
**plain
  +
**bold
  +
**italic
  +
**underlined
  +
**boxed
  +
**boxed 3D
  +
**link
  +
**stroked
  +
*alignment
  +
*margins
  +
You can also change all letters to uppercase, lowercase, or else using the last button.
  +
  +
==All properties==
  +
These all properties of a field ''(help us to complete this list)'':
  +
  +
*[[altId]]
  +
*[[autoHilite]]
  +
*[[autoTab]]
  +
*[[backColor]]
  +
*[[backPattern]]
  +
*[[behavior]]
  +
*[[blendLevel]]
  +
*[[borderColor]]
  +
*[[borderPattern]]
  +
*[[borderWidth]]
  +
*[[bottomColor]]
  +
*[[bottomPattern]]
  +
*[[cantSelect]]
  +
*[[colorOverlay]]
  +
*[[cursorMovement]]
  +
*[[disabled]]
  +
*[[dontSearch]]
  +
*[[dontWrap]]
  +
*[[dropShadow]]
  +
*[[firstIndent]]
  +
*[[fixedLineHeight]]
  +
*[[focusColor]]
  +
*[[focusPattern]]
  +
*[[foreColor]]
  +
*[[forePattern]]
  +
*[[hGrid]]
  +
*[[hiliteColor]]
  +
*[[hilitedLines]]
  +
*[[hilitePattern]]
  +
*[[hScroll]]
  +
*[[hScrollbar]]
  +
*[[htmlText]]
  +
*[[id]]
  +
*[[ink]]
  +
*[[innerGlow]]
  +
*[[innerShadow]]
  +
*[[layer]]
  +
*[[layerMode]]
  +
*[[listBehavior]]
  +
*[[lockLoc]]
  +
*[[lockText]]
  +
*[[margins]]
  +
*[[multipleHilites]]
  +
*[[name]]
  +
*[[noncontiguousHilites]]
  +
*[[opaque]]
  +
*[[outerGlow]]
  +
*[[rect]]
  +
*[[scrollbarWidth]]
  +
*[[shadow]]
  +
*[[shadowColor]]
  +
*[[shadowOffset]]
  +
*[[shadowPattern]]
  +
*[[sharedText]]
  +
*[[showBorder]]
  +
*[[showFocusBorder]]
  +
*[[showLines]]
  +
*[[style]]
  +
*[[tabStops]]
  +
*[[textAlign]]
  +
*[[textDirection]]
  +
*[[textFont]]
  +
*[[textHeight]]
  +
*[[textSize]]
  +
*[[textStyle]]
  +
*[[threeD]]
  +
*[[threeDHilite]]
  +
*[[toggleHilites]]
  +
*[[toolTip]]
  +
*[[topColor]]
  +
*[[topPattern]]
  +
*[[traversalOn]]
  +
*[[vGrid]]
  +
*[[visible]]
  +
*[[vScroll]]
  +
*[[vScrollbar]]
  +
[[Category:Controls]]
  +
[[Category:GUI]]
  +
[[Category:Ui]]

Revision as of 15:54, 7 June 2017

The Field object is used for many purposes in LiveCode, it has so many options that it is used for text, scrolling fields, and much more. Pay attention to the basic table object option, since it creates "phantom fields", one per cell like field "revCell-2,3" (row,column); this way you can intercept messages easily when working with cells.


Basic Properties

  • Name
  • tool tip
  • Style (see slide-show on the right):
    • Disabled: it becomes gray and not editable
    • Visible: if it's false, object is invisible
    • share text: if you set it as a group, you decide if it's the same on all cards or not.
    • Don't wrap
    • Lock text: if a text is focusable, you can also specify if user can change it or not.
    • Opaque: it means that background is not transparent
    • Focusable: it's mandatory if user has to edit field
    • Focus border: Displays a border around the active control.
    • Tab on Return: pressing return is the same as pressing tab on this object, so it will move to the next cell.
    • Three dimensional: graphic effect
    • Show border: a box border visible
  • Scrollbars
  • Hilites
  • Line height
  • Layer mode
  • Behavior

Contents

Here there is a large area where you can add text, see it with the wrap line on,  transform it into a table, or load from a file. This property is called TEXT. Example: 

set the text of field "myfield" to "Hello world"

When the content is set like a table, content is a simple tabbed text. Every cell is separated from the other with a TAB, every line is separated from the other with a newline. For example, the following can be a 3x3 table: 

11	12	13
21	22	23
31	32	33

Creating a TABBED table is easy, look the following example: 

put "11" & tab & "12" & return  & "21" & tab & "22"  into myvar

In a scrolling list, every line is a line list.

Table

Here you can transform the object in a table, setting if editable or not, formatting or not, tab stop size, and many other option.

  • basic table object: this option activates table capabilities
    • cell editing: user can edit text cell by cell
    • maximum editable column: last column user can edit
    • cell formatting:
  • text baseline: show dotted horizontal lines
  • horizontal grid: activate table horizontal lines
  • vertical grid: activate table vertical lines
  • tab stops: number of pixels of column width

In a single field, you can put both normal text and tables. Here you can find a guide

Icons & Border

  • Icon
  • Hilite Icon: icon when the button is pressed
  • Disabled Icon: icon when the button is disabled
  • Visited Icon: icon when the button was pressed at least one time. You can reset a visited button setting the visited property to false
  • Armed Icon
  • Hover Icon: when mouse is on the object
  • Three D: effect of the button
  • Border: border of the button
  • Hilite border: special border when pressed
  • Border width
  • Shadow: shadow effect of the button
  • Shadow offset: distance of the shadow from the button

Colors & patterns

Here you can set the color of various elements of the button. You can choose a pattern instead of a color.

Custom properties

Custom properties are the best replacement for variables in LiveCode. You can use variables in LiveCode, but usually they are temporary, where as custom properties are real containers for all your data. They are easy to retrieve and to check.

Geometry

See Geometry manager

Graphic effects

Here yo can activate and mix many effects:

GraphicEffects
  • drop shadow
  • inner shadow
  • outer glow
  • inner glow
  • color overlay

If you activate the drop shadow, you can manipulate all aspects of it (color, opacity, position, etc.) with the sub-menu.

Blending

The blending effect is a way to make the object transparent, you can choose between many ways to render the resulting object (arithmetic, subpin, etc.). You can choose the percentage of blending your object with the background.

Property profiles

All the properties of an object are inherited from a master profile, however you can add and change profiles. This way all objects will have the same properties, will look the same or act the same.

Size & Position

Here you can

  • specify the size of the object
  • fit it to text content
  • set location using the center of the object or its borders
  • lock size and position
  • choose which element is above the others, by specifying object layer

Text formatting

Here you can change:

  • font type
  • font size (you can enter the size directly, you are not restricted to the few shown)
  • font style:
    • plain
    • bold
    • italic
    • underlined
    • boxed
    • boxed 3D
    • link
    • stroked
  • alignment
  • margins

You can also change all letters to uppercase, lowercase, or else using the last button.

All properties

These all properties of a field (help us to complete this list):

Community content is available under CC-BY-SA unless otherwise noted.