You are viewing a plain text version of this content. The canonical link for it is here.
Posted to user@pivot.apache.org by Bill van Melle <bi...@gmail.com> on 2011/03/22 03:26:56 UTC

Applying a style to all elements of a control

I'm trying to understand if there's a way to set a common style for all like
elements in a bxml file, e.g., make the text on all the Label controls have
font size = 9, or for all PushButton's to have a grey background.  Or even
cooler, setting the font size for *all* elements that render text (something
WPF lets you do at the top level of a XAML file -- they have a notion of
certain properties being inheritable thru a layout hierarchy).

There's a note in the 2.0 change log about "named styles" (
https://issues.apache.org/jira/browse/PIVOT-553).  I can't tell from the
terse example in the ticket whether the capability I'm looking for exists,
or just how to do it.  Certainly, the example there is not much less wordy
(if at all) than simply repeating the style verbatim if it's a simple style.
 And is there a way to do it without a separate json file, something like

<bxml:define>
  <Style bxml:id="labelStyle" something or other />
</bxml:define>

Re: Applying a style to all elements of a control

Posted by Chris Bartlett <cb...@gmail.com>.
I was just providing a link to an example that used typed & named styles.

On 23 March 2011 02:58, Bill van Melle <bi...@gmail.com> wrote:

> Still, that seems to just be a demonstration of supplying my own global
> style sheet.  Unless you're suggesting there's a way to pass a style sheet
> to the bxml serializer.

Re: Applying a style to all elements of a control

Posted by Bill van Melle <bi...@gmail.com>.
Still, that seems to just be a demonstration of supplying my own global
style sheet.  Unless you're suggesting there's a way to pass a style sheet
to the bxml serializer.

Re: Applying a style to all elements of a control

Posted by Bill van Melle <bi...@gmail.com>.
Oops, you're right -- I was in the demos tree, not the examples tree.

Re: Applying a style to all elements of a control

Posted by Chris Bartlett <cb...@gmail.com>.
I think you are looking at the ColorSchemeBuilder demo.

On 23 March 2011 02:26, Chris Bartlett <cb...@gmail.com> wrote:

>
>
> On 23 March 2011 01:45, Bill van Melle <bi...@gmail.com> wrote:
>
>> On Mon, Mar 21, 2011 at 11:38 PM, Chris Bartlett <cb...@gmail.com>wrote:
>>
>>> On 22 March 2011 09:26, Bill van Melle <bi...@gmail.com> wrote:
>>>
>>>> There's a note in the 2.0 change log about "named styles" (
>>>> https://issues.apache.org/jira/browse/PIVOT-553).  ...
>>>>
>>> I think this example goes with that JIRA ticket on named styles.
>>>
>>> http://svn.apache.org/repos/asf/pivot/trunk/examples/src/org/apache/pivot/examples/styles/
>>>
>>
>> I don't get the connection.  It's a visually complicated demo that as best
>> I can tell is showing a way to experiment with different base colors in the
>> global terra theme.  I don't see named or typed styles anywhere.
>>
>>
>
> Are we looking at the same thing?
>
>
> http://svn.apache.org/repos/asf/pivot/trunk/examples/src/org/apache/pivot/examples/styles/styles.json
>
> http://svn.apache.org/repos/asf/pivot/trunk/examples/src/org/apache/pivot/examples/styles/stylesheet_example.bxml
> java org.apache.pivot.wtk.ScriptApplication
> --src=/org/apache/pivot/examples/styles/stylesheet_example.bxml
> --stylesheet=/org/apache/pivot/examples/styles/styles.json
>

Re: Applying a style to all elements of a control

Posted by Chris Bartlett <cb...@gmail.com>.
On 23 March 2011 01:45, Bill van Melle <bi...@gmail.com> wrote:

> On Mon, Mar 21, 2011 at 11:38 PM, Chris Bartlett <cb...@gmail.com>wrote:
>
>> On 22 March 2011 09:26, Bill van Melle <bi...@gmail.com> wrote:
>>
>>> There's a note in the 2.0 change log about "named styles" (
>>> https://issues.apache.org/jira/browse/PIVOT-553).  ...
>>>
>> I think this example goes with that JIRA ticket on named styles.
>>
>> http://svn.apache.org/repos/asf/pivot/trunk/examples/src/org/apache/pivot/examples/styles/
>>
>
> I don't get the connection.  It's a visually complicated demo that as best
> I can tell is showing a way to experiment with different base colors in the
> global terra theme.  I don't see named or typed styles anywhere.
>
>

Are we looking at the same thing?

http://svn.apache.org/repos/asf/pivot/trunk/examples/src/org/apache/pivot/examples/styles/styles.json
http://svn.apache.org/repos/asf/pivot/trunk/examples/src/org/apache/pivot/examples/styles/stylesheet_example.bxml
java org.apache.pivot.wtk.ScriptApplication
--src=/org/apache/pivot/examples/styles/stylesheet_example.bxml
--stylesheet=/org/apache/pivot/examples/styles/styles.json

Re: Applying a style to all elements of a control

Posted by Chris Bartlett <cb...@gmail.com>.
Yeah, I think your CSS analogy works.  The XHTML side of things would map to
Pivot's Component graph (which may or may not be built or instantiated using
BXML files), and the stylesheets are like the CSS used to style them.

If you dig around in the relevant source, you might be able to rip out the
code to just build your own named style map & typed style map (rather than
using the static ones in Component) and then load and apply those styles as
you required.

You might need to extend or modify BXMLSerializer so that it uses your
named/typed styles in preference to any global ones, and then you would use
that custom BXMLSerializer to load your BXML file and apply the styles that
you need on a file by file basis.  (Or just have the BXMLSerializer look for
a style file matching your naming convention, load that and use it when
building the object graph)

Chris

On 23 March 2011 03:32, Bill van Melle <bi...@gmail.com> wrote:

> Okay, so I guess the interesting part for what I'm thinking about is this
> property styleName.  It doesn't satisfy the desire to change a whole bxml
> file without additional markup, but at least it's cleaner looking than what
> I thought in my earlier speculation was needed.  It also suggests to me that
> I might be thinking about it the wrong way, and that some kind of
> globally-managed styles might actually be more desirable.  Sort of like how
> css files are preferable to lots of markup in html.
>
> Thanks for your help.
>

Re: Applying a style to all elements of a control

Posted by Bill van Melle <bi...@gmail.com>.
Okay, so I guess the interesting part for what I'm thinking about is this
property styleName.  It doesn't satisfy the desire to change a whole bxml
file without additional markup, but at least it's cleaner looking than what
I thought in my earlier speculation was needed.  It also suggests to me that
I might be thinking about it the wrong way, and that some kind of
globally-managed styles might actually be more desirable.  Sort of like how
css files are preferable to lots of markup in html.

Thanks for your help.

Re: Applying a style to all elements of a control

Posted by Chris Bartlett <cb...@gmail.com>.
On 23 March 2011 01:45, Bill van Melle <bi...@gmail.com> wrote:

> If the only way to change the style of, say, a Label is to change the style
> of *all* Labels, then that's pretty useless to me.  That's more of a global
> skinning facility.
>
As the example demonstrates, you can create named styles (heading &
subHeading). or typed styles (Button, RadioButton, PushButton).


> I don't object to having a style name per BXML file, but it's unclear to me
> how I make use of it.  Sorry if I'm being obtuse here.
>
Look at the example.

<Label styleName="heading" text="Heading Text"/>
<Label styleName="subHeading" text="Sub-Heading Text"/>

These named styles exist in the JSON stylesheet.
2 Labels are styled differently by referencing different named styles.


I haven't looked at the internals of the
ApplicationContext.html#applyStylesheet(java.lang.String) method, but you
might be able to have multiple style files and apply them one after another
into the named & typed style maps.  How you choose to build up those maps is
up to you.  ScriptApplication accepts a --stylesheet argument and uses the
JSON file it points to.

You can define the styles in one (or maybe more) stylesheets as named
styles, and use them alter the appearance of relevant Components wherever
they might be.
You could use a naming convention of your choosing if you want to 'bundle' a
group of named styles together for use in a specific BXML file.

Chris

Re: Applying a style to all elements of a control

Posted by Bill van Melle <bi...@gmail.com>.
On Mon, Mar 21, 2011 at 11:38 PM, Chris Bartlett <cb...@gmail.com>wrote:

> On 22 March 2011 09:26, Bill van Melle <bi...@gmail.com> wrote:
>
>> There's a note in the 2.0 change log about "named styles" (
>> https://issues.apache.org/jira/browse/PIVOT-553).  ...
>>
> I think this example goes with that JIRA ticket on named styles.
>
> http://svn.apache.org/repos/asf/pivot/trunk/examples/src/org/apache/pivot/examples/styles/
>

I don't get the connection.  It's a visually complicated demo that as best I
can tell is showing a way to experiment with different base colors in the
global terra theme.  I don't see named or typed styles anywhere.


> Styles can be named or typed and are stored in static maps in Component, so
> I don't think it is possible to scope them.  Of course you could use
> different style names for your different BXML files, but that may not help
> you much.
>
> http://pivot.apache.org/2.0/docs/api/org/apache/pivot/wtk/Component.html#getNamedStyles()
>
> http://pivot.apache.org/2.0/docs/api/org/apache/pivot/wtk/Component.html#getTypedStyles()
> http://pivot.apache.org/2.0/docs/api/org/apache/pivot/wtk/
> ApplicationContext.html#applyStylesheet(java.lang.String)
> You can apply a stylesheet programmatically like this
>
> ApplicationContext.applyStylesheet("/fully/qualified/path/to/my_styles_file.json");
>

If the only way to change the style of, say, a Label is to change the style
of *all* Labels, then that's pretty useless to me.  That's more of a global
skinning facility.

I don't object to having a style name per BXML file, but it's unclear to me
how I make use of it.  Sorry if I'm being obtuse here.  If I have to do
something like this in foo.bxml:

<bxml:define>
  <bxml:include bxml:id="fooStyle" src="foo_styles.json"/>
</bxml:define>

and then throughout foo.bxml have markup that looks like

<Label text="..." styles="$fooStyle.labelStyle"/>

well, that's kind of painful.  I was kind of hoping for something I could
put at the top of the bxml file to set styles for the whole file.  I suppose
there could be a programmatic workaround, if there were a function I could
call in Foo.java to walk the component structure of Foo and apply a set of
styles to each node (though it's always nicer to have all the markup in one
place and not separated like that).

Re: Applying a style to all elements of a control

Posted by Chris Bartlett <cb...@gmail.com>.
On 22 March 2011 09:26, Bill van Melle <bi...@gmail.com> wrote:

> There's a note in the 2.0 change log about "named styles" (
> https://issues.apache.org/jira/browse/PIVOT-553).  I can't tell from the
> terse example in the ticket whether the capability I'm looking for exists,
> or just how to do it.  Certainly, the example there is not much less wordy
> (if at all) than simply repeating the style verbatim if it's a simple style.
>  And is there a way to do it without a separate json file, something like
>
I think this example goes with that JIRA ticket on named styles.
http://svn.apache.org/repos/asf/pivot/trunk/examples/src/org/apache/pivot/examples/styles/

I'm trying to understand if there's a way to set a common style for all like
> elements in a bxml file, e.g., make the text on all the Label controls have
> font size = 9, or for all PushButton's to have a grey background.  Or even
> cooler, setting the font size for *all* elements that render text (something
> WPF lets you do at the top level of a XAML file -- they have a notion of
> certain properties being inheritable thru a layout hierarchy).
>
Styles can be named or typed and are stored in static maps in Component, so
I don't think it is possible to scope them.  Of course you could use
different style names for your different BXML files, but that may not help
you much.
http://pivot.apache.org/2.0/docs/api/org/apache/pivot/wtk/Component.html#getNamedStyles()
http://pivot.apache.org/2.0/docs/api/org/apache/pivot/wtk/Component.html#getTypedStyles()
http://pivot.apache.org/2.0/docs/api/org/apache/pivot/wtk/
ApplicationContext.html#applyStylesheet(java.lang.String)
You can apply a stylesheet programmatically like this
ApplicationContext.applyStylesheet("/fully/qualified/path/to/my_styles_file.json");

You should be able to use named styles to apply font configuration, colors,
background colors etc.  I think it just tries to apply the styles contained
within the named style definition, but will only succeed when the style name
matches.  Therefore if would silently (gracefully?) fail if you tried to set
a style such as ListView's 'alternateItemBackgroundColor' for a Label (via a
named style).

Chris