Flex Label not showing up - apache-flex

I opened up flash builder, made a new Flex project, and then inserted that label into the mxml file.
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
<s:Label id="label" text="myLabel"/>
</s:Application>
Now I run this (Using either Internet Explorer or Google Chrome) and I see a simple white screen with nothing on it (http://i101.photobucket.com/albums/m59/plinios/Untitled-4_zps1ef1127d.png).
Is it just me being silly? I've looked everywhere and I could not find a solution. This seems to be a very very simple problem. Why is the label not showing up?
EDIT:
I restarted my PC and re-installed Flash builder. I then tried the simple code above and it still displayed a white screen for Chrome and IE. Interestingly enough, I put a panel for the label to rest on and it displayed in IE, but not in Chrome.
<s:Panel x="41" y="36" width="250" height="200">
<s:Label id="label" x="10" y="-20" text="myLabel"/>
</s:Panel>
EDIT:
When right-clicking the screen, I get a flash menu, not an HTML menu.
Would using the Windows 8 operating system affect this in anyway? I don't see any other reason as to why it wouldn't be showing up normally.

I have solved this issue. The first thing to realize is that only IE will display this correctly. When you start coding, you need to wrap everything in a Spark Group. That's it!

Related

Flex mobile: View with DateSpinner takes awfully long to get displayed

<s:DateSpinner id="dateSpinner" displayMode="dateAndTime" />
A view containg above code, and displayed with navigator.pushView() takes quite a few seconds to be displayed, even if DateSpinner is the only thing on the view.
Is there a way to speed this up? It really is a horrible user experience.
I'm of course talking about the performance on device, iPhone4. It runs OK in the emulator.
Update: full view code.
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" title="DateView">
<s:DateSpinner id="dateSpinner" displayMode="dateAndTime" />
<s:navigationContent>
<s:Button label="back" click="{navigator.popView()}"/>
</s:navigationContent>
</s:View>
Having a similar issue on Android. Seems to be an issue with the component itself.

Text in TextArea on AIR mobile app disappears after displaying for a moment

I'm having a very odd issue where I am trying to use a text area to display some text on a mobile AIR app. It works fine whenever I am using the phone emulator on my desktop to debug, however whenever I put the app on my phone, the text displays, then disappears. I've also noticed that if I lock the screen and unlock, the text will display just fine when I come back.
Here's the code:
<?xml version="1.0" encoding="utf-8"?>
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" title="Program Overview">
<fx:Declarations>
<!-- Place non-visual elements (e.g., services, value objects) here -->
</fx:Declarations>
<fx:Script>
<![CDATA[
[Bindable]
private var text:String = "Hey how are ya";
]]>
</fx:Script>
<s:TextArea text="{text}" editable="false" />
</s:View>
One other interesting thing to note is that it only happens on certain Views, and only on Views in the first ViewNavigator tab. This leads me to believe that there isn't really anything wrong with my use of the TextArea, but something else happening at a higher level in the application. Any ideas on what I should look for?
I think than the problem can be solved if you add the skinClass:
this is for TextArea:
<s:TextArea id="text1" skinClass="spark.skins.mobile.TextAreaSkin" text="{myVar}"/>
this is fot TextInput:
<s:TextInput id="text2" skinClass="spark.skins.mobile.TextInputSkin" text="{myVar}"/>
I hope this help you!
I ended up replacing all of my TextArea's with StyleableTextFields as #Al_Birdy suggested and that took care of the issue. Because you can only use them in AS it made layout and styling a little bit more difficult but it was definitely worth the fix.

Flex 4: htmlText property and hand cursor

I need hand cursor to appear on roll over spark Label. I've tried useHandCursor + buttonMode properties, but no result. And is there anything like htmlText property for spark Label (I need underline)? Any alternative solutions are welcome. Thanks.
Does this code suites your needs?
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:Label buttonMode="true" horizontalCenter="0" text="Test" textDecoration="underline" verticalCenter="0" />
</s:Application>
If you want to have ability to mix styles together you can use the following:
<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:RichText buttonMode="true" horizontalCenter="0" verticalCenter="0">
<s:content>Hello, <s:span textDecoration="underline">World</s:span>!</s:content>
</s:RichText>
</s:Application>
According to documentation:
The Spark architecture provides three
text "primitives" -- Label, RichText,
and RichEditableText -- as part of its
pay-only-for-what-you-need philosophy.
Label is the fastest and most
lightweight, but is limited in its
capabilities: no complex formatting,
no scrolling, no selection, no
editing, and no hyperlinks. RichText
and RichEditableText are built on the
Text Layout Framework (TLF) library,
rather than on FTE. RichText adds the
ability to render rich HTML-like text
with complex formatting, but is still
completely non-interactive.
RichEditableText is the slowest and
heaviest, but can do it all: it
supports scrolling with virtualized
TextLines, selection, editing,
hyperlinks, and images loaded from
URLs. You should use the fastest one
that meets your needs.

Flex4: Combo Box with CheckBox Inside

Apologies for all the simple questions but they are born of my sudden and unplanned migration from flex 3 to flex 4.
Ok I have a combo box which I would like to show a list of selectable check boxes.
<s:ComboBox x="181" y="-7" width="233" id="dropISLIST" itemRenderer="IsListFilterCheckBox" dataProvider="{GetIsList.lastResult.ReportFilterList.ReportFilter}" color="#000000"/>
To this end I have built the following item renderer.
<?xml version="1.0" encoding="utf-8"?>
<s:ItemRenderer xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx"
autoDrawBackground="true" width="142" height="22">
<s:CheckBox x="0" y="2" label="{data}" color="#000000"/>
</s:ItemRenderer>
Now that all works fine, how ever, I can not "Check" a box, what I would like to be able to do is have the user be able to select a number of check boxes. And then also figure out what they have checked.
Any help in this regard would be greatly apreciated thank you so much in advance.
Regards
Craig
Try this component. It should do everything you are needing
http://www.carballares.es/en/arcadio/?page_id=352

flex: loading mxml component

I'm trying to load an mxml component into my main flex project.
I saw that there are many related question regarding this issue but i'm too of a newbie to understand them.
the page contains a vbox on left and right sides and another flash file in the middle.
i want the vbox's that are placed on the left and right sides to be in separated mxml component. how can i do so?
thanks
Create the mxml component for your side boxes. In the following, I based it on VBox since that might be what you're looking for. I gave it an obnoxious backgroundColor that should be easy to spot when we run the app.
SideBox.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:VBox xmlns:mx="http://www.adobe.com/2006/mxml" width="100" height="300"
backgroundColor="0x990000">
</mx:VBox>
So in your main mxml application you can include your custom component by telling the application what namespace to look for it (that's what the xmlns:local="*" is for - the word local is just a name so that I can easily remember what it means, you can call it anything, the * essentially means to look in the current/same directory).
Main.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:local="*" layout="absolute">
<local:SideBox x="40" y="20" />
<local:SideBox x="500" y="20" />
</mx:Application>

Resources