News Feed Comments

Releasable Revolution

Creating release quality applications with Revolution

  • Home
  • Tutorials & Manuals
  • Articles
  • Revolution Tools
    • Libraries
      • SQL Yoga
      • GLX Application Framework
      • libDatabase
    • Externals
      • EQT
    • Plugins
      • Script Format Helper
      • BBEdit Language Module
  • About
Tutorials & Manuals » Lessons » How To Create Field Placeholder Text Using Behaviors

Subscribe to our feed

Last Updated

Nov 23, 2009

Download Lesson PDF

Other Resources

  • How-tos

  • GLX Application Framework 1.1
  • Converting An Existing Application To Use The Framework
  • SQL Yoga

  • SQL Yoga
  • SQL Yoga Examples
  • SQL Yoga To-Do Application
  • SQL Yoga IDE Plugin
  • Plugins, Externals and Libraries

  • Plugins

Comments

2 comments for this lesson

How To Create Field Placeholder Text Using Behaviors

This lesson will demonstrate how to create a field that displays placeholder text when the field is a) empty and b) does not have focus.

If you are not familiar with how to create and assign behaviors then please see this lesson.

Attached Files

  • Field_Placeholder_Text.rev

What I Will Create

Media_1249319849979

The behavior I will show you will displays placeholder text in a field when the field is empty and does not have focus. The field will be light gray.

Media_1249320580622

When the field has focus the placeholder text will disappear and the text color will be inherited (usually black).

Setting the Placeholder Text

Media_1249321556862

You assign the placeholder text by setting the uPlaceholderText custom property (1) of the field (2). The behavior (3) will display this text when appropriate.

You must get and set the text of the field using the uText or uUTF8Text custom properties that are defined in the behavior. These custom properties only return a value if the user has entered some text. They won't return the text if the placeholder is being displayed.

put the uText of field "Field"

The Behavior Script

--> Script Locals

constant kPlaceholderTextColor = "125,125,125"

local sDefaultTextIsDisplayed ## Keeps track of whether or not default text is being displayed


--> Accessors

getprop uText
   if sDefaultTextIsDisplayed then
      return empty
   else
      return the text of me
   end if
end uText


setprop uText pText
   lock screen
   _ClearDefaultText
   set the text of me to pText
   _DisplayDefaultText
   unlock screen
end uText


getprop uUTF8Text
   if sDefaultTextIsDisplayed then
      return empty
   else
      return unidecode(the unicodetext of me, "utf8")
   end if
end uUTF8Text


setprop uUTF8Text pText
   lock screen
   _ClearDefaultText
   set the unicodetext of me to uniencode(pText, "UTF8")
   _DisplayDefaultText
   unlock screen
end uUTF8Text


--> Engine messages


on openField
   ## If default text is displayed then clear it out
   _ClearDefaultText
   pass openField
end openField


on closeField
   _DisplayDefaultText
   pass closeField
end closeField


on exitField
   _DisplayDefaultText
   pass exitField
end exitField


private command _ClearDefaultText
   if sDefaultTextIsDisplayed then
      lock screen
      set the text of me to empty
      set the textcolor of me to empty ## inherit default color
      unlock screen
   end if
   
   ## Reset
   put false into sDefaultTextIsDisplayed
end _ClearDefaultText


private command _DisplayDefaultText
   ## Reset
   put false into sDefaultTextIsDisplayed
   
   ## Is text empty?
   if the text of me is empty then
      ## Am I focused? If so then don't do anything.
      if the focusedobject is not the long id of me then
         lock screen
         set the text of me to the uPlaceholderText of me
         set the textcolor of me to 125,125,125
         put true into sDefaultTextIsDisplayed
         unlock screen
      end if
   end if
end _DisplayDefaultText

This is the script of the behavior. In the example stack it is stored in the Placeholder Text Behavior button.

Comments (2)

Charles Szasz Thursday Sep 17 at 04:00 PM

I used your placeholder text behavior in a field "first" that displays the text First Name in gray. It works fine. However, I ran into a problem when I wrote a script in a button that is suppose to take the contents of this completed field (field "first") and place it nto another field on the next card. This is my script for a button to copy the first name and put it into the field on the next card:

on mouseUp

if field "First" is not empty
then
put field "First" into field "student" of card "letter"
else
answer information "Please add first name of student."
exit to top
end if
go to card "letter"
end mouseUp

This works fine if the user enters a first name in the field "first". However, if they do NOT enter a first name and press the above button the grayed text First Name is copied into the field on the next card! How can I correct this problem?

Also, I have a question. In custom properties of the field "first", should both uPlaceholderText and uText both First Name in the properties?

Thanks for your time!

Trevor DeVore Thursday Sep 17 at 04:09 PM

The lesson wasn't originally clear about this but you need to use the uText custom property to get and set the text of the field (I've updated the lesson). put the uText of field "First" will only return a value if the placeholder text isn't being displayed.

Add your comment

E-Mail me when someone replies to this comment
  • ScreenSteps Desktop

    ScreenSteps Desktop helps you help other people.

    Teachers can teach, Bloggers can demonstrate, Tech Support can communicate, Developers can document, Trainers can instruct.

    All in a matter of minutes.

    Learn More

  • ScreenSteps Support Suite

    We're Revolutionizing the Way Organizations Help Their Customers

    Join Us

    Create, distribute and aggregate “Just In Time” tutorials that help your customers and ease your support load.

    Learn More

  • revSelect Add-Ons

    Supercharge your Revolution development with RevSelect products.

© 2009 Releasable Revolution