1 Reply Latest reply on Jul 10, 2012 4:17 PM by Apocalyptic0n3

    iOS TextInput displayAsPassword doesn't displayAsPassword

    Apocalyptic0n3 Level 1

      I'm building an app to launch across Android, iOS, and desktop simultaneously. The app includes a login that is attached to a vBulletin system and I've run into a significant issue (that the client is adamant must be fixed). On iOS, if you are typing in a TextInput that has its displayAsPassword set to true, it will show plain text while typing. Once you click out of the TextInput, it displays properly.

       

      Here is the code I am using within Flex

       

      <s:TextInput id="inputField" width="100%" styleName="loginFields" text="Password" focusAlpha="0" focusEnabled="false" autoCorrect="false" />
      

       

      I then attach focus events to the input field that run these functions.

       

       

      private var defaultText:String = 'Password';
      
      private var passwordDisplay:Boolean = true;
      
      
      
      private function focusIn (e:FocusEvent = null):void {
           if (this.inputField.text == this.defaultText){
                  this.inputField.text = '';
            }
           if (this.passwordDisplay){
                     this.inputField.displayAsPassword = true;
           }
      }
      
      private function focusOut (e:FocusEvent = null):void {
           if (this.inputField.text == ''){
                     this.inputField.text = this.defaultText;
                     if (this.passwordDisplay){
                            this.inputField.displayAsPassword = false;
                   }
            }
      }
      

       

      There's a lot more code in the file, but this is the only relevant. Basically, on focus in, it checks if the text == the default text. If it does, it empties the field. It then sets displayAsPassword to true. On focus out, it checks if the field is empty. If it is, it resets the field to default and displayAsPassword to false. I know the default text is built in, but I needed more functionality than it offered.

       

      Now, this issue (password displaying as plaintext while focus is on field) is present in iOS only and it doesn't occur in the emulator. It works perfectly and as expected on Android and desktop. I've tried recreating the functionality manually (possible but not ideal because caretIndex is not a TextInput property), I've tried hiding the TextInput and overlaying a field of '•' that match the length of the input (not possible because TextInput is StageText). I'm not sure what else I can try here. Any ideas?

       

      Thanks in advance for any help here.

       

      Specs:

      • Built and compiled using FlashBuilder 4.6
      • Using Air 3.1
      • Compiled on OS X Lion
      • Tested on both 1st and 3rd gen iPads
      • Using Flex SDK 4.6.0