iPhone-Style Password Inputs with Appcelerator Titanium

By  on  
iPhone Password Mask

Most mobile applications ask you for your credential so that they may verify your account and pull information via an API.  My mobile application is no different.  The problem I ran into was that I couldn't find the method by which to emulate the iPhone's password field behavior.  Luckily a quick search gave me the answer:

// Create the text field
var formElement = Titanium.UI.createTextField({
	value: "",
	width: 100,
	height: "auto",
	hintText: "Password",
	passwordMask: true
});

Setting the passwordMask property to true provides the true iPhone-style password masking that I desired.  Now all but the last letter in the password are properly hidden!

Recent Features

  • By
    LightFace:  Facebook Lightbox for MooTools

    One of the web components I've always loved has been Facebook's modal dialog.  This "lightbox" isn't like others:  no dark overlay, no obnoxious animating to size, and it doesn't try to do "too much."  With Facebook's dialog in mind, I've created LightFace:  a Facebook lightbox...

  • By
    5 HTML5 APIs You Didn’t Know Existed

    When you say or read "HTML5", you half expect exotic dancers and unicorns to walk into the room to the tune of "I'm Sexy and I Know It."  Can you blame us though?  We watched the fundamental APIs stagnate for so long that a basic feature...

Incredible Demos

  • By
    CSS Ellipsis Beginning of String

    I was incredibly happy when CSS text-overflow: ellipsis (married with fixed width and overflow: hidden was introduced to the CSS spec and browsers; the feature allowed us to stop trying to marry JavaScript width calculation with string width calculation and truncation.  CSS ellipsis was also very friendly to...

  • By
    Animated AJAX Record Deletion Using jQuery

    I'm a huge fan of WordPress' method of individual article deletion. You click the delete link, the menu item animates red, and the item disappears. Here's how to achieve that functionality with jQuery JavaScript. The PHP - Content & Header The following snippet goes at the...

Discussion

  1. Good, that was what I search and arrive here ;)

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!