You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@flex.apache.org by Peter Ent <pe...@adobe.com> on 2017/03/09 15:46:06 UTC
[FlexJS] Panel
Hi,
I'm trying to determine if "chrome" is a necessity as part of Container or if a specialty "ChromedContainer" should be made (or if at all).
Panel is one component that uses chrome (the TitleBar and ControlBar implement IChrome). Is Panel used a lot?
As an alternative, Panel can be re-constructed to look as it does now without the use of chrome simply by using Group for the Panel itself and Group for the TitleBar and ControlBar and a Container with a ScrollingViewport for the content.
Please let me know your thoughts.
Thanks,
Peter Ent
Adobe Systems/Apache Flex Project
Re: [FlexJS] Panel
Posted by Peter Ent <pe...@adobe.com>.
The way things are set up right now, due to the nesting of containers (div
or DisplayObjectContainer), you do get (0,0) at the top. It will usually
be necessary to have nested containers for scrolling purposes if nothing
else.
As I'm going through the code, I don't see that IChrome is actually being
recognized!! It looks like Panel is special-casing it somehow, but right
now Panel is very messed up for me due to changes I've made in my
workspace, so I'm not really certain what is going on it with.
‹peter
On 3/9/17, 2:34 PM, "yishayw" <yi...@hotmail.com> wrote:
>I think it makes sense to start the coordinates axis below the titlebar.
>In
>ExtJS they have the concept of docked components such as toolbars and
>titles. So I think you can do (I changed syntax to pseudo-mxml)
>
><container layout="vbox">
> <Button text="10px below titlebar" margin="10 0 0 0"/>
> <label text="I'm right below button because of vbox layout"/>
> <label text="this is the titlebar which is placed at the top"
>docked="top"/>
></container>
>
>In other words, docked items override the container's layout and change
>the
>coordinates axis point of origin.
>
>
>
>--
>View this message in context:
>http://apache-flex-development.2333347.n4.nabble.com/FlexJS-Panel-tp60285p
>60307.html
>Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS] Panel
Posted by yishayw <yi...@hotmail.com>.
I think it makes sense to start the coordinates axis below the titlebar. In
ExtJS they have the concept of docked components such as toolbars and
titles. So I think you can do (I changed syntax to pseudo-mxml)
<container layout="vbox">
<Button text="10px below titlebar" margin="10 0 0 0"/>
<label text="I'm right below button because of vbox layout"/>
<label text="this is the titlebar which is placed at the top"
docked="top"/>
</container>
In other words, docked items override the container's layout and change the
coordinates axis point of origin.
--
View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-Panel-tp60285p60307.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS] Panel
Posted by Alex Harui <ah...@adobe.com>.
On 3/9/17, 8:49 AM, "Peter Ent" <pe...@adobe.com> wrote:
>The idea of "chrome" is that these are components that do not count as
>regular children and have special locations within the component. The
>TitleBar and ControlBar are considered chrome because if you ask for the
>children of the Panel, they are not listed and if you have so many
>children in the Panel that it requires scrolling, these items do not
>scroll. You can consider the fixed scrollbars in the SWF version to be
>chrome pieces too.
Before we go too far into whether we need Ichrome or separate slots, I'm
curious about what coordinate space expectations folks have as well.
In regular Flex, the pixel below the Panel's titlebar is 0,0 instead of 0,
titlebar.height because the content area is its own container. Who has
used Panel-like UI's in JS and what coordinate space did it use for
content children?
Thanks,
-Alex
Re: [FlexJS] Panel
Posted by Peter Ent <pe...@adobe.com>.
The idea of "chrome" is that these are components that do not count as
regular children and have special locations within the component. The
TitleBar and ControlBar are considered chrome because if you ask for the
children of the Panel, they are not listed and if you have so many
children in the Panel that it requires scrolling, these items do not
scroll. You can consider the fixed scrollbars in the SWF version to be
chrome pieces too.
Let's say you wanted to have a special type of title bar that did have
images and other buttons. If your component implements IChrome, then you
could add it to a container that knew how to handle chrome:
<ChromedContainer>
<MyTitleBar Š left="0" top="0" right="0" height="40"/>
<button or label or input etc etc not chrome />
</ChromedContainer>
Where your MyTitleBar.mxml might be:
<Group implements="IChrome">
<beads>
<HorizontalFlexLayout />
<beads>
<Images or Buttons or Labels />
</Group>
Then the ChromedContainer would place the MyTitleBar at the top of the
container outside of the content area. But you could also do this as:
<Group>
<beads>
<BasicLayout />
</beads>
<MyTitleBar top="0" left="0" right="0" height="40" />
<Container top="40" left="0" right="0" bottom="0">
<beads>
<ScrollingViewport />
</beads>
<Images or Buttons or Labels />
</Container>
</Group>
This would accomplish the same thing. The problem with "chrome" is that
you could put the chrome into the middle of the container and then I'm not
sure how the layout algorithm would handle that.
‹peter
On 3/9/17, 11:16 AM, "PKumar" <pr...@gmail.com> wrote:
>ChromeContainer should be fine. We should be able to modify the panel
>title
>bar style as header corlor , border etc.
>
>Can Panel title bar contain other controls as image , button , check box?
>
>
>On 09-Mar-2017 9:37 PM, "piotrz [via Apache Flex Development]" <
>ml-node+s2333347n60286h78@n4.nabble.com> wrote:
>
>Hi Peter,
>
>Let's say that you reconstructed Panel using new Group container - How can
>we use there Chrome ?
>
>I would go with ChromedContainer.
>
>Piotr
>Apache Flex PMC
>piotrzarzycki21@gmail.com
>
>
>------------------------------
>If you reply to this email, your message will be added to the discussion
>below:
>http://apache-flex-development.2333347.n4.nabble.com/FlexJS-Panel-
>tp60285p60286.html
>To start a new topic under Apache Flex Development, email
>ml-node+s2333347n1h43@n4.nabble.com
>To unsubscribe from Apache Flex Development, click here
><http://apache-flex-development.2333347.n4.nabble.com/template/NamlServlet
>.jtp?macro=unsubscribe_by_code&node=1&code=cHJhc2hha3VtYXJAZ21haWwuY29tfDF
>8LTU0MTcyMzE2NA==>
>.
>NAML
><http://apache-flex-development.2333347.n4.nabble.com/template/NamlServlet
>.jtp?macro=macro_viewer&id=instant_html%21nabble%3Aemail.naml&base=nabble.
>naml.namespaces.BasicNamespace-nabble.view.web.template.NabbleNamespace-na
>bble.view.web.template.NodeNamespace&breadcrumbs=notify_subscribers%21nabb
>le%3Aemail.naml-instant_emails%21nabble%3Aemail.naml-send_instant_email%21
>nabble%3Aemail.naml>
>
>
>
>
>--
>View this message in context:
>http://apache-flex-development.2333347.n4.nabble.com/FlexJS-Panel-tp60285p
>60287.html
>Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS] Panel
Posted by PKumar <pr...@gmail.com>.
ChromeContainer should be fine. We should be able to modify the panel title
bar style as header corlor , border etc.
Can Panel title bar contain other controls as image , button , check box?
On 09-Mar-2017 9:37 PM, "piotrz [via Apache Flex Development]" <
ml-node+s2333347n60286h78@n4.nabble.com> wrote:
Hi Peter,
Let's say that you reconstructed Panel using new Group container - How can
we use there Chrome ?
I would go with ChromedContainer.
Piotr
Apache Flex PMC
piotrzarzycki21@gmail.com
------------------------------
If you reply to this email, your message will be added to the discussion
below:
http://apache-flex-development.2333347.n4.nabble.com/FlexJS-Panel-
tp60285p60286.html
To start a new topic under Apache Flex Development, email
ml-node+s2333347n1h43@n4.nabble.com
To unsubscribe from Apache Flex Development, click here
<http://apache-flex-development.2333347.n4.nabble.com/template/NamlServlet.jtp?macro=unsubscribe_by_code&node=1&code=cHJhc2hha3VtYXJAZ21haWwuY29tfDF8LTU0MTcyMzE2NA==>
.
NAML
<http://apache-flex-development.2333347.n4.nabble.com/template/NamlServlet.jtp?macro=macro_viewer&id=instant_html%21nabble%3Aemail.naml&base=nabble.naml.namespaces.BasicNamespace-nabble.view.web.template.NabbleNamespace-nabble.view.web.template.NodeNamespace&breadcrumbs=notify_subscribers%21nabble%3Aemail.naml-instant_emails%21nabble%3Aemail.naml-send_instant_email%21nabble%3Aemail.naml>
--
View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-Panel-tp60285p60287.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.
Re: [FlexJS] Panel
Posted by piotrz <pi...@gmail.com>.
Hi Peter,
Let's say that you reconstructed Panel using new Group container - How can
we use there Chrome ?
I would go with ChromedContainer.
Piotr
-----
Apache Flex PMC
piotrzarzycki21@gmail.com
--
View this message in context: http://apache-flex-development.2333347.n4.nabble.com/FlexJS-Panel-tp60285p60286.html
Sent from the Apache Flex Development mailing list archive at Nabble.com.