You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@flex.apache.org by PKumar <pr...@gmail.com> on 2016/09/03 05:50:59 UTC

FlexJS : Panel Issue

Hi,

I was writing one flexJS example using Panel. Below is my sample  code.

<?xml version="1.0" encoding="utf-8"?>
<js:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
				xmlns:js="library://ns.apache.org/flexjs/basic"
xmlns:ns="library://ns.apache.org/flexjs/svg">
	<fx:Script>
		
	</fx:Script>
	<js:valuesImpl>
		<js:SimpleCSSValuesImpl />
	</js:valuesImpl>
	<js:initialView>
		<js:View id="viewId" width="100%" height="100%">
				
			<js:VContainer width="200" height="250" x="0" y="0">
				<ns:TextButton text="Show/Hide" click="onBtnClick()" />
				<js:Panel id="panel1" width="100%" height="100%" title="Test Panel">
						<js:Label text="I am in Panel" />		
				</js:Panel>
			</js:VContainer>
		</js:View>
	</js:initialView>
</js:Application>

Problem is when Panel height is zero then Label remains visible. But in
regular FlexSDK, Label does hide. So  i am not sure that it is a issue or
not. As this should same as regular FlexSDK so i raise it.



-----
Regards,
Prashant
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: FlexJS : Panel Issue

Posted by Alex Harui <ah...@adobe.com>.

On 9/10/16, 1:38 AM, "PKumar" <pr...@gmail.com> wrote:

>Thanks Alex,  but  can i use CSS to define gradient style?
>

Yes.  Use ValuesManager.valuesImpl.getValue.

-Alex


Re: FlexJS : Panel Issue

Posted by PKumar <pr...@gmail.com>.
Thanks Alex,  but  can i use CSS to define gradient style? 



-----
Regards,
Prashant
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495p13529.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: FlexJS : Panel Issue

Posted by PKumar <pr...@gmail.com>.
Thanks for updating, i will take nightly and have a look.



-----
Regards,
Prashant
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495p14076.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: FlexJS : Panel Issue

Posted by Alex Harui <ah...@adobe.com>.
Sounds like a good addition.

On 11/8/16, 11:38 PM, "Yishay Weiss" <yi...@hotmail.com> wrote:

>In case anyone's interested, I added ClippingViewport, which avoids some
>of
>the overhead you get with ScrollingViewport, if all you want to do is
>clip.
>It should be in the next nightly build.
>
>
>
>--
>View this message in context:
>http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495p
>14063.html
>Sent from the Apache Flex Users mailing list archive at Nabble.com.


Re: FlexJS : Panel Issue

Posted by Yishay Weiss <yi...@hotmail.com>.
In case anyone's interested, I added ClippingViewport, which avoids some of
the overhead you get with ScrollingViewport, if all you want to do is clip.
It should be in the next nightly build.



--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495p14063.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: FlexJS : Panel Issue

Posted by Alex Harui <ah...@adobe.com>.

On 9/8/16, 11:45 AM, "PKumar" <pr...@gmail.com> wrote:

>One more thing i want to ask, how can i apply linear gradient on Panel
>Titlebar?

Looks like there is a LinearGradient in the Graphics swc.  A custom
TitleBarView could display such a gradient.

HTH,
-Alex


Re: FlexJS : Panel Issue

Posted by PKumar <pr...@gmail.com>.
Alex,

I managed to fix it using ScrollingViewport.  I added a vertical scroll bar
using ScrollingViewport bead and it is start working.

Now  I started creating a Collpase able Panel where I will a button over
Panel Title bar to collapse/expand Panel.

One more thing i want to ask, how can i apply linear gradient on Panel
Titlebar?



-----
Regards,
Prashant
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495p13526.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: FlexJS : Panel Issue

Posted by Alex Harui <ah...@adobe.com>.
Feel free to post a simple test case, open a JIRA.

-Alex

On 9/5/16, 8:35 AM, "PKumar" <pr...@gmail.com> wrote:

>Alex, It is not working. I am checking the PanelView  implementation and
>trying to fix this issue.
>
>
>
>-----
>Regards,
>Prashant
>--
>View this message in context:
>http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495p
>13505.html
>Sent from the Apache Flex Users mailing list archive at Nabble.com.


Re: FlexJS : Panel Issue

Posted by PKumar <pr...@gmail.com>.
Alex, It is not working. I am checking the PanelView  implementation and
trying to fix this issue.



-----
Regards,
Prashant
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495p13505.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: FlexJS : Panel Issue

Posted by Alex Harui <ah...@adobe.com>.

On 9/3/16, 8:42 AM, "PKumar" <pr...@gmail.com> wrote:

>Alex, but sad  this  is not working in Javascript side.  so could you
>please
>suggest on this?

Bummer.  I thought you had it working on both sides.  Hard to say without
a simple test case, but did you try:

if(contentView.height <= 0)


-Alex


Re: FlexJS : Panel Issue

Posted by PKumar <pr...@gmail.com>.
Alex, but sad  this  is not working in Javascript side.  so could you please
suggest on this?



-----
Regards,
Prashant
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495p13500.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: FlexJS : Panel Issue

Posted by Alex Harui <ah...@adobe.com>.

On 9/3/16, 1:11 AM, "PKumar" <pr...@gmail.com> wrote:

>I have extended the PanelView and successfully created the
>ClippedPanelPview.
>It is behaving as expected.
>Below is code that i have written. Please check & suggest.

Congratulations!  Glad to know you got something working.

I think a more generalized ClippedPanelView would use a scrollrect for SWF
and the overflow style for JS so any height would clip appropriately, but
your solution looks like it is sufficient for your needs, and is a good
case study for pay-as-you-go.

Thanks,
-Alex

>
>package views
>{
>	import org.apache.flex.html.beads.PanelView;
>	
>	public class ClippedPanelView extends PanelView
>	{
>		public function ClippedPanelView()
>		{
>			super();
>		}
>		
>		override protected function layoutViewAfterContentLayout():void
>		{
>			super.layoutViewAfterContentLayout();
>			if(contentView.height < 0)
>				contentView.visible = false;
>			else
>				contentView.visible = true;	
>		}
>	}
>}
>
>
>
>-----
>Regards,
>Prashant
>--
>View this message in context:
>http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495p
>13498.html
>Sent from the Apache Flex Users mailing list archive at Nabble.com.


Re: FlexJS : Panel Issue

Posted by PKumar <pr...@gmail.com>.
I have extended the PanelView and successfully created the ClippedPanelPview.
It is behaving as expected.
Below is code that i have written. Please check & suggest.

package views
{
	import org.apache.flex.html.beads.PanelView;
	
	public class ClippedPanelView extends PanelView
	{
		public function ClippedPanelView()
		{
			super();
		}
		
		override protected function layoutViewAfterContentLayout():void
		{
			super.layoutViewAfterContentLayout();
			if(contentView.height < 0)
				contentView.visible = false;
			else
				contentView.visible = true;	
		}
	}
}



-----
Regards,
Prashant
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495p13498.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: FlexJS : Panel Issue

Posted by PKumar <pr...@gmail.com>.
Thanks Alex, I checked the ScrollingViewPort and PanelView. so can i extend a
PanelView  to create a new ClippedPanelView? 



-----
Regards,
Prashant
--
View this message in context: http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495p13497.html
Sent from the Apache Flex Users mailing list archive at Nabble.com.

Re: FlexJS : Panel Issue

Posted by Alex Harui <ah...@adobe.com>.
Hi Prashant,

The default FlexJS Panel View does not support the extra overhead of
clipping.  It should be possible to create an alternate view that does
support clipping.  Let us know if you want to try to create it yourself.
Otherwise we can try to find another volunteer to do it.  You might be
able to borrow some code from ScrollingViewport.as

HTH,
-Alex

On 9/2/16, 10:50 PM, "PKumar" <pr...@gmail.com> wrote:

>Hi,
>
>I was writing one flexJS example using Panel. Below is my sample  code.
>
><?xml version="1.0" encoding="utf-8"?>
><js:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
>				xmlns:js="library://ns.apache.org/flexjs/basic"
>xmlns:ns="library://ns.apache.org/flexjs/svg">
>	<fx:Script>
>		
>	</fx:Script>
>	<js:valuesImpl>
>		<js:SimpleCSSValuesImpl />
>	</js:valuesImpl>
>	<js:initialView>
>		<js:View id="viewId" width="100%" height="100%">
>				
>			<js:VContainer width="200" height="250" x="0" y="0">
>				<ns:TextButton text="Show/Hide" click="onBtnClick()" />
>				<js:Panel id="panel1" width="100%" height="100%" title="Test Panel">
>						<js:Label text="I am in Panel" />		
>				</js:Panel>
>			</js:VContainer>
>		</js:View>
>	</js:initialView>
></js:Application>
>
>Problem is when Panel height is zero then Label remains visible. But in
>regular FlexSDK, Label does hide. So  i am not sure that it is a issue or
>not. As this should same as regular FlexSDK so i raise it.
>
>
>
>-----
>Regards,
>Prashant
>--
>View this message in context:
>http://apache-flex-users.2333346.n4.nabble.com/FlexJS-Panel-Issue-tp13495.
>html
>Sent from the Apache Flex Users mailing list archive at Nabble.com.