I have a component:
<mx:List width="100%" height="100%" />
and that works out for nearly all uses of this component, except one. I want to have height remain default in one usage.
According to Adobe's manual, the default is 0, but
<mystuff:myList height="0" />
doesn't work and
<mystuff:myList height="0%" />
is an improvement, but still not the same as having a <mx:List /> w/no height specified at all.
I'm using the Flex 3.5 SDK.
I'm not quite sure what you want to achieve by using the "default" sizing, but you could try setting the height to NaN.
<mystuff:myList height="NaN" />
Related
The image is working just fine. Here is the code
<Image
layout="fixed"
src="/images/example.jpeg"
alt="Example image"
width="140"
height="140"
/>
But, when I run the website on web.dev, I don't get a topscore in Performance.
The main reason is Image elements do not have explicit width and height
I've studied this, and can tell from here https://web.dev/optimize-cls/?utm_source=lighthouse&utm_medium=lr#images-without-dimensions
That width and height attributes is needed, which don't appear, using next/image
How do I solve this?
I am facing the same issue - changing layout to responsive did not solve the problem.
It rather looks like the component is missing the rendering of the supporting tags - it should actually be implemented as described in the initial lighthouse link.
Use curly braces to mention the size instead of string literals.
Use layout="responsive"
<Image
layout="responsive"
src="/images/example.jpeg"
alt="Example image"
width={140}
height={140}
/>
I'm trying to hide Year2017 when the mxml page loads up. I'm using visible and includeInLayout attributes but it doesn't seems to be working.
Could somebody help me on this?
Some code written on -
Year2017.mxml,
Year2016.mxml,
Year2015.mxml
MainScreen.mxml
<mx:HBox
<component:PopupOpenerViewStack
id="payeVS"
borderStyle="none"
width="100%"
height="100%"
componentToFocusOn="{controlBar.overviewBut}"
selectedIndex="{ this.mainModel.navigator.selectedIndex }" >
<view1:Year2017
width="100%"
height="100%"
visible="{isVisible}"
includeInLayout="{isVisible}" />
<view1:Year2016
width="100%"
height="100%"/>
<view1:Year2015
width="100%"
height="100%"/>
</component:PopupOpenerViewStack>
</mx:HBox>
The way viewstacks work is they display a child based on index. In this case it will be opened in an Popup. I'd need the internals of the PopupOpener to give an more accurate answer.
Instead of setting the isVisble, can't you change the this.mainModel.navigator.selectedIndex?
It also depends on desired behaviour. What needs to happen if you have the popup open and you change it to visible?
I guess what you want is that Year2007 is not included in the stack, would not that be invisible. Have you tried to use states for it?
Thanks for all your inputs.The issue is resolved.
As Robin mentioned the visible or includeInLayout properties wont work with PopupOpenerViewStack. So I had to read the index values of each item in the viewStack and did payeVS.removeChildAt(0) whenever I wanted to hide an element.
Thanks,
Varatha
I am still struggling with transforming my app build in Java/Eclipse to Flex/Actionscript with Flashbuilder.
Now I can not find how I should implement an image to cover the hole screen.
In my current app I used relative layout and
<ImageView
android:id="#+id/img"
android:scaleType="centerCrop"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_above="#id/bottom"
android:layout_below="#id/rubrik"
/>
but I do not find how I shall define this in Flex views.
Check out this SO question.
You need to modify the scaleMode property of the Image spark tag (as documented here).
<s:Image scaleMode="BitmapScaleMode.STRETCH" x="0" y="0" height="100%" width="100%" source="#Embed('assets/example.jpg')"/>
You can play with either BitmapScaleMode.STRETCH, BitmapScaleMode.ZOOM, or BitmapScaleMode.LETTERBOX.
I have a checkbox that does not render as a checkbox and would be displayed as something similar to a button. However, it behaves like a checkbox where I can select it and the handler works with the firing event.
Here is my checkbox. I also tried it outside the or , but it has the same behavior. There is no CSS related to checkbox or the part that I am working on. I am using Flex 4.5 though.
1- Has anybody encounter such a problem?
2- Is there any way to enforce the layout inside a container and item renderer?
<mx:HBox>
<mx:CheckBox id="Test"
label="Label"
fontWeight="bold"
change="Test_changeHandler(event)"/>
</mx:HBox>
If you're using Flex 4.5, why are you using Flex 3 components? Change this to spark components and everything should be much better:
<s:HGroup>
<s:CheckBox id="Test"
label="Label"
fontWeight="bold"
change="Test_changeHandler(event)"/>
</s:HGroup>
mx:CheckBox extends mx:Button, so if you put added css that skinned mx:Button, mx:CheckBox would also get it. It's a shortcoming of flex 3 skinning. You can workaround by explicitly setting the mx:CheckBox skin.
Edit: try this
<mx:HBox>
<mx:CheckBox id="Test"
label="Label"
fontWeight="bold"
skin="{mx.skins.spark.CheckBoxSkin}"
change="Test_changeHandler(event)"
/>
</mx:HBox>
This happend to me also. Fix was to use a mx:Container as parent instead of FlexGlobals.application on the popup component.
for the second question:
I had exactly the same problem and i forced it to take the "original" skin with:
var skinClass:Class = mx.skins.spark.CheckBoxSkin;
theCheckBoxInstance.setStyle("skin", skinClass);
Because in my case the CheckBox was an ItemRenderer for a DataGrid, I've put it in the overridden createChildren methode right after the super call..
I have no explication why this happens. I encountered it in an old monster project where I was charged to make some changes...
Is there a way to prevent a component from rendering in Flex (to save memory or processing power)?
I tried doing something like:
<components:AddNewItemGroup id="addItemGroup"
visible="false"
enabled="false"
horizontalCenter="0" bottom="0" />
I noticed that the component gets rendered but it's just not visible or functional.
If you want to prevent a component from being rendered, you need to remove it from the display list using the removeChild method in Actionscript.
How about setting "includeInLayout='false'" too ? The doc says it will not draw the component ... but maybe it will still "render" it ...
http://livedocs.adobe.com/flex/3/html/help.html?content=size_position_4.html
For the desired effect, use:
<components:AddNewItemGroup
id="addItemGroup"
visible="false"
includeInLayout="false"
enabled="false"
horizontalCenter="0" bottom="0" />