Adobe air mobile - softKeyboardType is not working when using skinClass to allow scrolling?

Question

I am trying to set the softKeyboardType to email but when ever i use skinClass="spark.skins.mobile.TextAreaSkin" it doesn't change it but when i take off skinClass="spark.skins.mobile.TextAreaSkin" it does work. The problem is i need the skinClass="spark.skins.mobile.TextAreaSkin" class to allow my application so scroll with out it the text does not stay with in the bounds of the text input boxes. Has anyone seen this problem or another fix the the scrolling problem?
Code examples
<s:TextInput softKeyboardType="email" id="id1" width="100%" skinClass="spark.skins.mobile.TextInputSkin" />
<s:TextArea softKeyboardType="email" id="id2" height="400" width="100%" skinClass="spark.skins.mobile.TextAreaSkin" />
Thank for the help,
Justin

Answer 1

The main problem we are all seeing is that its not hooking into the scroller, as this is documented not to work in a scrollable environment
However try something like this, still not perfect (as i see a flicker) but it should get you going.
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
    xmlns:s="library://ns.adobe.com/flex/spark"
    applicationDPI="320"
    xmlns:local="*"
          applicationComplete="init()">
  <fx:Script>
                    <![CDATA[
                              import mx.events.PropertyChangeEvent;
                              import spark.skins.mobile.StageTextInputSkin;
                              import spark.skins.mobile.TextInputSkin;
                              protected function init():void {
                                        addHandlers(myScroller, myTI);
                              protected function setStageTextInputSkin(ti:TextInput):void {
  //FIXME could do with a check to ensure that the skin isn't being set many times when it doesn't need to
                                        var myTIText:String = ti.text;
                                        ti.setStyle("skinClass",Class(StageTextInputSkin));
                                        ti.returnKeyLabel = ReturnKeyLabel.DONE;
                                        ti.autoCapitalize = "sentence";
                                        ti.softKeyboardType = SoftKeyboardType.NUMBER;
                                        ti.text = myTIText;
                              protected function setTextInputSkin(ti:TextInput):void {
  //FIXME could do with a check to ensure that the skin isn't being set many times when it doesn't need to
                                        ti.setStyle("skinClass",Class(TextInputSkin));
                              protected function addHandlers(scroller:Scroller, ti:TextInput):void {
  // ====================== ADD LISTENERS FOR WHEN WE NEED THE STAGETEXTINPUT ===========================================
                                        ti.addEventListener(FocusEvent.FOCUS_IN, function(event:FocusEvent=null):void { setStageTextInputSkin(ti) });
  // ====================== ADD LISTENERS FOR WHEN WE NEED THE TEXTINPUT ===========================================
                                        addEventListener(SoftKeyboardEvent.SOFT_KEYBOARD_DEACTIVATE, function(event:SoftKeyboardEvent=null):void { setTextInputSkin(ti) });
                                        ti.addEventListener(FocusEvent.FOCUS_OUT, function(event:FocusEvent=null):void { setTextInputSkin(ti) });
  //http://stackoverflow.com/questions/4390725/flex-4-scroller/4425091#4425091
                                        scroller.viewport.addEventListener(PropertyChangeEvent.PROPERTY_CHANG E, function(e:PropertyChangeEvent):void {
                                                  if (e.source == e.target && e.property == "verticalScrollPosition")
                                                            setTextInputSkin(ti);
                                                  if (e.source == e.target && e.property == "horizontalScrollPosition")
                                                            setTextInputSkin(ti);
                    ]]>
  </fx:Script>
    <s:Scroller width="100%"
        height="100%"
        verticalScrollPolicy="on"
                    id="myScroller">
        <s:Group width="100%"
            height="100%">
  <s:layout>
  <s:VerticalLayout/>
  </s:layout>
            <s:TextInput id="myTI" text="hello"
                softKeyboardType="number"
                                        skinClass="spark.skins.mobile.TextInputSkin"/>
        </s:Group>
    </s:Scroller>
</s:Application>