You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@flex.apache.org by chris_d_k <ck...@christiankiefer.de> on 2014/12/21 01:35:44 UTC
Performance Problems with SkinnableContainer when adding multiline
Label
Having a skinnableContainer as some panel I get huge problems with
performance when putting some multiline label in it...
What can I do to fix that?
(Is there actually any component available where I can add children in a
special (sub-)container in mxml (contentGroup like) without skinning?)
Here the test code...
<?xml version="1.0" encoding="utf-8"?>
<s:ViewNavigatorApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:navigationContent>
<s:Button label="test1" click="{navigator.pushView(TestView)}" />
<s:Button label="test2" click="{navigator.pushView(TestView2)}" />
</s:navigationContent>
</s:ViewNavigatorApplication>
*TestView:*
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:Panel percentWidth="94" >
<s:Label percentWidth="100" text="This is a Test." />
</s:Panel>
</s:View>
*TestView2:*
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark">
<s:Panel skinClass="TestSkin" percentWidth="94">
<s:Label percentWidth="100"
text="This is a Test. This is a Test. This is a Test. This
is a Test. This is a Test. This is a Test. This is a Test. This is a Test.
This is a Test. This is a Test. This is a Test. This is a Test. This is a
Test. This is a Test. This is a Test. This is a Test. " />
</s:Panel>
</s:View>
*The Panel*
package
{
import spark.components.SkinnableContainer;
public class MyPanel extends SkinnableContainer
{
public function MyPanel()
{
super();
setStyle("skinClass", TestSkin);
}
override protected function commitProperties():void
{
super.commitProperties();
}
}
}
*The Skin*
<?xml version="1.0" encoding="utf-8"?>
<s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
alpha.disabled="0.5">
<fx:Metadata>
[HostComponent("MyPanel")]
</fx:Metadata>
<fx:Script>
</fx:Script>
<s:states>
<s:State name="normal"/>
<s:State name="disabled"/>
</s:states>
<s:Rect percentWidth="100" percentHeight="100" >
<s:fill>
<s:SolidColor color="#FFFFFF" />
</s:fill>
</s:Rect>
<s:Rect top="{sidePadding}" left="{sidePadding}" right="{sidePadding}"
bottom="{sidePadding}" >
<s:fill>
<s:SolidColor color="#F6F6F6" />
</s:fill>
</s:Rect>
<s:Rect height="{getStyle('titleBackgroundHeight')}" x="{sidePadding}"
y="{sidePadding}" width="{width - sidePadding * 2}">
<s:fill>
<s:SolidColor color="0xFF0000" />
</s:fill>
</s:Rect>
<s:Rect id="lineRect" >
<s:fill>
<s:SolidColor color="0xFFFFFF" />
</s:fill>
</s:Rect>
<s:BitmapImage id="titleIcon" scaleMode="letterbox" smooth="true" />
<s:Label id="titleLabel" styleName="panelHeader" />
<s:Group id="contentGroup" contentBackgroundColor="0xFF0000"
contentBackgroundAlpha="1">
</s:Group>
</s:Skin>
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/Performance-Problems-with-SkinnableContainer-when-adding-multiline-Label-tp9276.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.
Re: Performance Problems with SkinnableContainer when adding
multiline Label
Posted by Alex Harui <ah...@adobe.com>.
Try not using %. Can you compute the widths instead?
On 12/20/14, 4:35 PM, "chris_d_k" <ck...@christiankiefer.de> wrote:
>Having a skinnableContainer as some panel I get huge problems with
>performance when putting some multiline label in it...
>
>What can I do to fix that?
>
>(Is there actually any component available where I can add children in a
>special (sub-)container in mxml (contentGroup like) without skinning?)
>
>Here the test code...
>
><?xml version="1.0" encoding="utf-8"?>
><s:ViewNavigatorApplication xmlns:fx="http://ns.adobe.com/mxml/2009"
>xmlns:s="library://ns.adobe.com/flex/spark">
>
> <s:navigationContent>
> <s:Button label="test1" click="{navigator.pushView(TestView)}" />
> <s:Button label="test2" click="{navigator.pushView(TestView2)}" />
>
> </s:navigationContent>
>
></s:ViewNavigatorApplication>
>
>*TestView:*
><s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
>xmlns:s="library://ns.adobe.com/flex/spark">
> <s:Panel percentWidth="94" >
> <s:Label percentWidth="100" text="This is a Test." />
> </s:Panel>
></s:View>
>
>*TestView2:*
><s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
>xmlns:s="library://ns.adobe.com/flex/spark">
>
> <s:Panel skinClass="TestSkin" percentWidth="94">
> <s:Label percentWidth="100"
> text="This is a Test. This is a Test. This is a Test. This
>is a Test. This is a Test. This is a Test. This is a Test. This is a Test.
>This is a Test. This is a Test. This is a Test. This is a Test. This is a
>Test. This is a Test. This is a Test. This is a Test. " />
> </s:Panel>
></s:View>
>
>
>*The Panel*
>package
>{
>
> import spark.components.SkinnableContainer;
>
> public class MyPanel extends SkinnableContainer
> {
>
> public function MyPanel()
> {
> super();
> setStyle("skinClass", TestSkin);
> }
>
> override protected function commitProperties():void
> {
> super.commitProperties();
> }
>
> }
>
>}
>
>
>
>*The Skin*
><?xml version="1.0" encoding="utf-8"?>
>
><s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009"
> xmlns:s="library://ns.adobe.com/flex/spark"
> alpha.disabled="0.5">
>
> <fx:Metadata>
> [HostComponent("MyPanel")]
> </fx:Metadata>
>
> <fx:Script>
>
>
>
> </fx:Script>
>
>
> <s:states>
> <s:State name="normal"/>
> <s:State name="disabled"/>
> </s:states>
>
> <s:Rect percentWidth="100" percentHeight="100" >
> <s:fill>
> <s:SolidColor color="#FFFFFF" />
> </s:fill>
> </s:Rect>
>
> <s:Rect top="{sidePadding}" left="{sidePadding}" right="{sidePadding}"
>bottom="{sidePadding}" >
> <s:fill>
> <s:SolidColor color="#F6F6F6" />
> </s:fill>
> </s:Rect>
>
> <s:Rect height="{getStyle('titleBackgroundHeight')}" x="{sidePadding}"
>y="{sidePadding}" width="{width - sidePadding * 2}">
> <s:fill>
> <s:SolidColor color="0xFF0000" />
> </s:fill>
> </s:Rect>
>
> <s:Rect id="lineRect" >
> <s:fill>
> <s:SolidColor color="0xFFFFFF" />
> </s:fill>
> </s:Rect>
>
> <s:BitmapImage id="titleIcon" scaleMode="letterbox" smooth="true" />
>
> <s:Label id="titleLabel" styleName="panelHeader" />
>
>
> <s:Group id="contentGroup" contentBackgroundColor="0xFF0000"
>contentBackgroundAlpha="1">
> </s:Group>
>
></s:Skin>
>
>
>
>
>
>--
>View this message in context:
>http://apache-flex-users.2333346.n4.nabble.com/Performance-Problems-with-S
>kinnableContainer-when-adding-multiline-Label-tp9276.html
>Sent from the Apache Flex Users mailing list archive at Nabble.com.