Using Fields

This tutorial describes how to use the different types of LiveCode fields to enter and display text.

Introduction

Fields allow you to display text in your application. You can also use fields to allow the user to enter and edit text or make selections.

Fields support multiple fonts, styles and colors and can display a basic subset of HTML and RTF text.

Field Types

Field Types

There are 5 basic field types in LiveCode, all of which you can add to your stack from the Tools Palette.

1. Label field: a single line, non-editable field

2. Text entry field: a single line, editable field

3. Scrolling field: a multi line, scrollable, editable field

4. Basic table field: a basic table field allowing data to be displayed in cells

5. Scrolling list field: a multi line, scrollable, non-editable field allowing the user to make single or multiple selections

All these objects are really the same type, they are just templates with different properties set to give different appearance and behavior. For example you could add a basic text entry field to your stack and by setting the appropriate properties turn it into a scrolling list field.

Label, Text Entry and Scrolling fields

The first 3 field types are very similar, label fields cannot be edited by the user but the others can. The only difference between a text entry field and a scrolling field is that a scrolling field is larger and has its vertical scrollbar turned on.

The Contents of a Field

You can put text into a field by typing into it directly, using the 'Contents' pane of the field Property Inspector or by setting the text property of the field in script.

You can retrieve the contents, or a portion of the contents, of a field using the get or put command. You can use chunk expressions with fields to retrieve a portion of the text, for example:

put word 1 of field "text"

For more details on using chunk expressions see this lesson.

Table Fields

Table Fields

Table fields allow you to display data in cells, and optionally allow the user to edit the cells. Table fields are ideal for displaying basic tabular data. For more complex data display requirements we recommend you use the Data Grid control.

You move between cells in a table field by clicking in a cell or using the tab and return keys. Setting the text property of a table field to tab delimited data inserts the data into the relevant cells.

A field is made into a table field by turning on the Basic Table object option in the Property Inspector.

List Fields

List Fields

List fields allow you to display a set of choices. Users cannot edit list fields.

You can allow the user to select multiple lines by setting the multipleHilites property to true and allow them to select lines that do not appear together by setting the noncontiguousHilites to true. Both these properties are available in the Basic Properties pane of the Property Inspector of the field.

To check which line or lines are selected use the hilitedLines property, this returns the line number of the selected line, in this example the value of the hilitedLines property would be 1,4.

You can also set the hilitedLines property to hilite lines in the list field.

Display Properties of Fields

Display Properties of Fields

You can set the text color, size and font of fields. You can also set the background color and hilite color of a field.

These properties allow you to give fields a highly customized appearance within your application.

4 Comments

yasha

Hi

In my app I'm developing for android I have a scrolling text field which displays text imported from a text file and a scroll bar that the user can use to change the size of the font in the display field.

The code is something similar to this:

set the textSize of field "display" to the tuhmbPosition of fld "scrlBar"

This is inside a handler and it's working fine. The issue is that when I set the font size to larger then 16 the characters within the field get one on top of each other and it's not readable. And it's not due to lack of space in the display field.

On development mode it works properly, the issue starts only when running on my mobile.

I appreciate any insight on the issue

Thanks a lot for this tutorials

Best regards
Yasha

Elanor Buchanan

Hi Yasha

I did a quick test and it seems ok here, could you let us know what OS you are on, what version of LiveCode you are using and what version of Android and device you are testing on so we can look into this.

It might be easier to email support@livecode.com, if you do it would be useful if you can attach your stack so we can have a look at it.

Kind regards

Elanor

Yasha

Hi Elanor

Just to update you or whoever might bump into a similar issue:

I contacted support and the issue was that I was using an outdated LiveCode version which had a bug with android fonts. I updated to livecode 7.0.6 and the problem was gone.

Thanks a million!

Kind regards

Yasha

Elanor Buchanan

Hi Yasha

That's great, glad we could help.

Kind regards

Elanor

Add your comment

E-Mail me when someone replies to this comment