RE: Inherited Styles in Sub Components - Resolved

classic Classic list List threaded Threaded
3 messages Options
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

RE: Inherited Styles in Sub Components - Resolved

Ripgiblet
Hi All,

I have figured out most of my questions answers;] so here they are for
others;]
I am enjoying working with Pivot more and more as I get used to it;] Bit
rough around the edges but a solid product;]

ANSWERS:
1) How do you set the font size for the tab label in a TabPane?
        Using buttonFont:"sansserif,size:48,bold:false"  also here is an
example of most of the things you can set in a tab pane...
tabpane: {
        inactiveTabColor:"#339900",
        borderColor:"#339900",
        padding:{left:0,right:0,top:0,bottom:0},
        activeTabColor:"#F5F0F5",
        buttonColor:"#000000",
        buttonFont:"sansserif,size:48,bold:false",
        buttonPadding:{left:0,right:0,top:0,bottom:0},
        backgroundColor:"#232191"
    },
        Also of not to find out what values to set look up the skins set
methods... for example for this one it is TerraTabPaneSkin... to get values
remove the set and make the first character lowercase...
And you can't seem to set the Style for an individual tab from bxml... so if
you want to have different coloured tabs.. looks like it doesn't handle
it...
If I can't figure out another way to do it maybe I will have to write my own
TabPaneSkin to handle this, and if I get time I will post it back to
Everybody...

2) How to set the background color of a Boxpane?
backgroundColor: "#232191"  
Not sure why I had trouble with this, something to note is don't set the
background of other components for example TextInputs and it does use the
backgroundColor of the BoxPane... So it does seem to have Inherited styles
to some extent;]

3) Does anybody have a fully fleshed out .json file for most components
that we can use as a reference?
Here is some references for others:
radiobutton: {
        font: {
            name: "sansserif",
            size: 28,
            italic: false,
            bold: false
        },
        color: "#FFFFFF"
    },
pushbutton: {
        font: {
            name: "sansserif",
            size: 14,
            bold: true
        },
        color: "#ffffff",
        backgroundColor: "#00ff00"
    },

4) I would recommend using overloaded stylename constructors.
Still would like this since it makes your Json file cleaner and smaller...

Regards,
Mark.
-----Original Message-----
From: Mark R. Chambers [mailto:[hidden email]]
Sent: Tuesday, 28 January 2014 7:12 PM
To: [hidden email]
Subject: RE: Inherited Styles in Sub Components

Hi Sandro,

SUMMARY:
1) How do you set the font size for the tab label in a TabPane?
2) How to set the background color of a Boxpane?
3) Does anybody have a fully fleshed out .json file for most components
that we can use as a reference?
4) I would recommend using overloaded stylename constructors.

DETAILS:
It does seem like some fundamentals still need a bit of work in pivot, I am
continually finding things that don't seem intuitive.
Like for example:
1) How do you set the font size for the label in a TabPane?
2) How to set the background color of a Boxpane?

If anybody has a fully fleshed out .json file for most components that we
can use as a reference? I will finish filling it out and we can post it on
the Wiki somewhere.
Because currently that information is not available, it does not work in the
component explorer, and all of the tutorials and examples only show the
really basic stuff.. like color...

I would recommend using a standard approach to simple things like background
and foreground colors.
Also I would recommend using overloaded style constructors so that you can
add multiple styles to a component. So for example:
<BoxPane orientation="vertical" styleName="applicationstyle"
styleName="boxpanedefaultstyle" styles="{padding:4,
horizontalAlignment:'center'}"> Also since no inheritance allow things like
this:
<bxml:script>
        importClass(java.lang.System);
        var vMainStyle = "applicationstyle"; </bxml:script> <BoxPane
orientation="vertical" styleName="$vMainStyle"
styleName="boxpanedefaultstyle" styles="{padding:4,
horizontalAlignment:'center'}">

So then you .json file would be relatively simple.
Currently you basically need a different .json entry for each component in
your gui fully fleshed out... which makes it almost no improvement in
efficiency.
Also you get a huge number of warnings if you apply a generic fully fleshed
out style sheet to all components.

You would expect to be able to apply some values to every single component
and container. For example color and backgroundcolor...

Regards,
Mark.
-----Original Message-----
From: Sandro Martini [mailto:[hidden email]]
Sent: Friday, 24 January 2014 5:30 AM
To: Users - Apache Pivot
Subject: Re: Inherited Styles in Sub Components

Hi Mark,
styles in Pivot are different than css styles in HTML, this is feature
discussed since the beginning of Pivot :-) .
But the visual appearance of components is handled by the Skin (where for
example there is a pre-defined color palette), and any Component has a
related skin visual counterpart ... there are some global settings (color
palette, fonts, etc) in the skin but components draw themselves.

I agree that we could improve this, so be free to add a JIRA as Improvement,
or write/attach some test/idea/sample code.


Some old discussion here:
http://apache-pivot-users.399431.n3.nabble.com/can-we-use-css-style-sheet-in
-pivot-td3415299.html

Maybe using inline styles could help in your case now, some info here for
example:
http://apache-pivot-users.399431.n3.nabble.com/Apache-pivot-color-scheme-td4
022780.html


Tell us for more info.

Bye,
Sandro


2014/1/22 Ripgiblet <[hidden email]>:

> SUMMARY:
> Should Styles of subcomponents inherit from their parent components in
> Apache pivot?
> If not why not? and can we do this in the future?
>
> DETAILS:
> This is maybe a problem, or maybe a feature request.
>
> Currently my styles don't seem to be inherited to SubComponents, so I
> have to set the styles manually for all sub components... Is this the
> way it is supposed to work?
>
> If this is the case I would recommend adding an inherited style model
> like HTML etc. So all styles are inherited from parent objects, unless
> they are overridden.
>
> regards,
> Mark.
>
>
>
> --
> View this message in context:
> http://apache-pivot-users.399431.n3.nabble.com/Inherited-Styles-in-Sub
> -Components-tp4022835.html Sent from the Apache Pivot - Users mailing
> list archive at Nabble.com.

Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Inherited Styles in Sub Components - Resolved

Sandro Martini
Hi Mark,
first sorry for the big delay but hadn't time since some day ago ...

> I have figured out most of my questions answers;] so here they are for others;]
for sure
> I am enjoying working with Pivot more and more as I get used to it;] Bit rough around the edges but a solid product;]
thank oyu very much, this is our main focus :-) ... but in last months
I had very litle time to work on it, I hope to get some more time now
:-) .

> 1)      How do you set the font size for the tab label in a TabPane?
>         Using buttonFont:"sansserif,size:48,bold:false"  also here is an
> example of most of the things you can set in a tab pane...
> tabpane: {
>         inactiveTabColor:"#339900",
>         borderColor:"#339900",
>         padding:{left:0,right:0,top:0,bottom:0},
>         activeTabColor:"#F5F0F5",
>         buttonColor:"#000000",
>         buttonFont:"sansserif,size:48,bold:false",
>         buttonPadding:{left:0,right:0,top:0,bottom:0},
>         backgroundColor:"#232191"
>     },
For 2.1 maybe we could add these sample settings in one of our examples ...

>         Also of not to find out what values to set look up the skins set
> methods... for example for this one it is TerraTabPaneSkin... to get values
> remove the set and make the first character lowercase...
yes, this is a common practice, like any standard method naming for
Java Bean properties, in our doc on BXML this is written (maybe could
be improved/calrified in the doc) ...

> And you can't seem to set the Style for an individual tab from bxml... so if
> you want to have different coloured tabs.. looks like it doesn't handle
> it...
> If I can't figure out another way to do it maybe I will have to write my own
> TabPaneSkin to handle this, and if I get time I will post it back to
> Everybody...
>
For 2.1 maybe we could add a new style/property for this ... (and if
simple we could even backport to 2.0.x branch).
To not lose things, it would be great if you could add a JIRA issue
for this for 2.1.0 (as improvement) and assign to me. Then, if/when
you want, attach some patch ... but this is an optional step :-) .

> 2)      How to set the background color of a Boxpane?
> backgroundColor: "#232191"
> Not sure why I had trouble with this, something to note is don't set the
> background of other components for example TextInputs and it does use the
> backgroundColor of the BoxPane... So it does seem to have Inherited styles
> to some extent;]
>
I have to check this for 2.1, I still have to close some minor tweaks, see here:
https://issues.apache.org/jira/browse/PIVOT-689
If you want, put some comment/fix needed there ...
Note that with a custom color combination file you can better see
problems with skin drawings.

> 3)      Does anybody have a fully fleshed out .json file for most components
> that we can use as a reference?
> Here is some references for others:
> radiobutton: {
>         font: {
>             name: "sansserif",
>             size: 28,
>             italic: false,
>             bold: false
>         },
>         color: "#FFFFFF"
>     },
> pushbutton: {
>         font: {
>             name: "sansserif",
>             size: 14,
>             bold: true
>         },
>         color: "#ffffff",
>         backgroundColor: "#00ff00"
>     },
>
Thanks for this sample.

> 4)      I would recommend using overloaded stylename constructors.
> Still would like this since it makes your Json file cleaner and smaller...
>
Could you post a sample ?


Thanks for sharing with us all this info/comments.

Bye,
Sandro
Reply | Threaded
Open this post in threaded view
|  
Report Content as Inappropriate

Re: Inherited Styles in Sub Components - Resolved

Roger and Beth Whitcomb
In reply to this post by Ripgiblet
Hi Mark,
     Thanks for this feedback!  We do aim to file down the rough edges
for the 2.1 release (at least), so the feedback is much appreciated.
     Sorry I've been pretty busy the last few weeks getting our own
product out the door ...
     Yes, you are correct that there is no way to set attributes for
individual tab panes, but note that the content of each can be a
different component, so each could have different fonts, colors, etc.  
It's just that the little tab buttons themselves all need to be the same
(currently).  But, if you have suggestions as to how to change that,
please file a new JIRA issue.

~Roger

On 2/12/14 5:45 PM, Mark R. Chambers wrote:

> Hi All,
>
> I have figured out most of my questions answers;] so here they are for
> others;]
> I am enjoying working with Pivot more and more as I get used to it;] Bit
> rough around the edges but a solid product;]
>
> ANSWERS:
> 1) How do you set the font size for the tab label in a TabPane?
> Using buttonFont:"sansserif,size:48,bold:false"  also here is an
> example of most of the things you can set in a tab pane...
> tabpane: {
>          inactiveTabColor:"#339900",
>          borderColor:"#339900",
>          padding:{left:0,right:0,top:0,bottom:0},
>          activeTabColor:"#F5F0F5",
>          buttonColor:"#000000",
>          buttonFont:"sansserif,size:48,bold:false",
>          buttonPadding:{left:0,right:0,top:0,bottom:0},
>          backgroundColor:"#232191"
>      },
> Also of not to find out what values to set look up the skins set
> methods... for example for this one it is TerraTabPaneSkin... to get values
> remove the set and make the first character lowercase...
> And you can't seem to set the Style for an individual tab from bxml... so if
> you want to have different coloured tabs.. looks like it doesn't handle
> it...
> If I can't figure out another way to do it maybe I will have to write my own
> TabPaneSkin to handle this, and if I get time I will post it back to
> Everybody...
>
> 2) How to set the background color of a Boxpane?
> backgroundColor: "#232191"
> Not sure why I had trouble with this, something to note is don't set the
> background of other components for example TextInputs and it does use the
> backgroundColor of the BoxPane... So it does seem to have Inherited styles
> to some extent;]
>
> 3) Does anybody have a fully fleshed out .json file for most components
> that we can use as a reference?
> Here is some references for others:
> radiobutton: {
>          font: {
>              name: "sansserif",
>              size: 28,
>              italic: false,
>              bold: false
>          },
>          color: "#FFFFFF"
>      },
> pushbutton: {
>          font: {
>              name: "sansserif",
>              size: 14,
>              bold: true
>          },
>          color: "#ffffff",
>          backgroundColor: "#00ff00"
>      },
>
> 4) I would recommend using overloaded stylename constructors.
> Still would like this since it makes your Json file cleaner and smaller...
>
> Regards,
> Mark.
> -----Original Message-----
> From: Mark R. Chambers [mailto:[hidden email]]
> Sent: Tuesday, 28 January 2014 7:12 PM
> To: [hidden email]
> Subject: RE: Inherited Styles in Sub Components
>
> Hi Sandro,
>
> SUMMARY:
> 1) How do you set the font size for the tab label in a TabPane?
> 2) How to set the background color of a Boxpane?
> 3) Does anybody have a fully fleshed out .json file for most components
> that we can use as a reference?
> 4) I would recommend using overloaded stylename constructors.
>
> DETAILS:
> It does seem like some fundamentals still need a bit of work in pivot, I am
> continually finding things that don't seem intuitive.
> Like for example:
> 1) How do you set the font size for the label in a TabPane?
> 2) How to set the background color of a Boxpane?
>
> If anybody has a fully fleshed out .json file for most components that we
> can use as a reference? I will finish filling it out and we can post it on
> the Wiki somewhere.
> Because currently that information is not available, it does not work in the
> component explorer, and all of the tutorials and examples only show the
> really basic stuff.. like color...
>
> I would recommend using a standard approach to simple things like background
> and foreground colors.
> Also I would recommend using overloaded style constructors so that you can
> add multiple styles to a component. So for example:
> <BoxPane orientation="vertical" styleName="applicationstyle"
> styleName="boxpanedefaultstyle" styles="{padding:4,
> horizontalAlignment:'center'}"> Also since no inheritance allow things like
> this:
> <bxml:script>
>          importClass(java.lang.System);
>          var vMainStyle = "applicationstyle"; </bxml:script> <BoxPane
> orientation="vertical" styleName="$vMainStyle"
> styleName="boxpanedefaultstyle" styles="{padding:4,
> horizontalAlignment:'center'}">
>
> So then you .json file would be relatively simple.
> Currently you basically need a different .json entry for each component in
> your gui fully fleshed out... which makes it almost no improvement in
> efficiency.
> Also you get a huge number of warnings if you apply a generic fully fleshed
> out style sheet to all components.
>
> You would expect to be able to apply some values to every single component
> and container. For example color and backgroundcolor...
>
> Regards,
> Mark.
> -----Original Message-----
> From: Sandro Martini [mailto:[hidden email]]
> Sent: Friday, 24 January 2014 5:30 AM
> To: Users - Apache Pivot
> Subject: Re: Inherited Styles in Sub Components
>
> Hi Mark,
> styles in Pivot are different than css styles in HTML, this is feature
> discussed since the beginning of Pivot :-) .
> But the visual appearance of components is handled by the Skin (where for
> example there is a pre-defined color palette), and any Component has a
> related skin visual counterpart ... there are some global settings (color
> palette, fonts, etc) in the skin but components draw themselves.
>
> I agree that we could improve this, so be free to add a JIRA as Improvement,
> or write/attach some test/idea/sample code.
>
>
> Some old discussion here:
> http://apache-pivot-users.399431.n3.nabble.com/can-we-use-css-style-sheet-in
> -pivot-td3415299.html
>
> Maybe using inline styles could help in your case now, some info here for
> example:
> http://apache-pivot-users.399431.n3.nabble.com/Apache-pivot-color-scheme-td4
> 022780.html
>
>
> Tell us for more info.
>
> Bye,
> Sandro
>
>
> 2014/1/22 Ripgiblet <[hidden email]>:
>> SUMMARY:
>> Should Styles of subcomponents inherit from their parent components in
>> Apache pivot?
>> If not why not? and can we do this in the future?
>>
>> DETAILS:
>> This is maybe a problem, or maybe a feature request.
>>
>> Currently my styles don't seem to be inherited to SubComponents, so I
>> have to set the styles manually for all sub components... Is this the
>> way it is supposed to work?
>>
>> If this is the case I would recommend adding an inherited style model
>> like HTML etc. So all styles are inherited from parent objects, unless
>> they are overridden.
>>
>> regards,
>> Mark.
>>
>>
>>
>> --
>> View this message in context:
>> http://apache-pivot-users.399431.n3.nabble.com/Inherited-Styles-in-Sub
>> -Components-tp4022835.html Sent from the Apache Pivot - Users mailing
>> list archive at Nabble.com.
>
>

Loading...