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
    Facebook Open Graph META Tags

    It's no secret that Facebook has become a major traffic driver for all types of websites.  Nowadays even large corporations steer consumers toward their Facebook pages instead of the corporate websites directly.  And of course there are Facebook "Like" and "Recommend" widgets on every website.  One...

  • By
    9 Mind-Blowing Canvas Demos

    The <canvas> element has been a revelation for the visual experts among our ranks.  Canvas provides the means for incredible and efficient animations with the added bonus of no Flash; these developers can flash their awesome JavaScript skills instead.  Here are nine unbelievable canvas demos that...

Incredible Demos

  • By
    Pure CSS Slide Up and Slide Down

    If I can avoid using JavaScript for element animations, I'm incredibly happy and driven to do so.  They're more efficient, don't require a JavaScript framework to manage steps, and they're more elegant.  One effect that is difficult to nail down with pure CSS is sliding up...

  • By
    Create a CSS Cube

    CSS cubes really showcase what CSS has become over the years, evolving from simple color and dimension directives to a language capable of creating deep, creative visuals.  Add animation and you've got something really neat.  Unfortunately each CSS cube tutorial I've read is a bit...

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!