Eclipse Community Forums: Remote Application Platform (RAP) » Change tree / table header background and foreground color

Home » Eclipse Projects » Remote Application Platform (RAP) » Change tree / table header background and foreground color

Show: Today's Messages :: Show Polls :: Message Navigator

Change tree / table header background and foreground color [message #1787189]

Mon, 21 May 2018 16:52

Nicola Zanaga

Messages: 56
Registered: July 2009

Member

Hi,

I'm searching a method to change header background / foreground color of tree and table.

Styling header by css is not suitable, because I need to dinamically change background and foreground.

In the latest release of SWT, there are "setHeaderBackground" and "setHeaderForeground".
It's planned to allineate RAP source with SWT source ?

Alternatively, I tried to change color using "JavaScriptExecutor" using code like below, but I can't access to the header id / background method (if exist) :

                WidgetRemoteAdapter adapter = ((WidgetRemoteAdapter) tree.getAdapter(RemoteAdapter.class));
                String id = adapter.getId();  // header id ??
        
                JavaScriptExecutor service = RWT.getClient().getService(JavaScriptExecutor.class);
                service.execute("rap.getObject('" + id + "').setBackground([0,255,0]);");

Report message to a moderator

Re: Change tree / table header background and foreground color [message #1787205 is a reply to message #1787189]

Tue, 22 May 2018 06:53

Ivan Furnadjiev

Messages: 2426
Registered: July 2009
Location: Sofia, Bulgaria

Senior Member

Hi,
it's too late for adding the new API for the upcoming 3.5 release (in June). We are approaching the RC phases now. Please open an enhancement request and we will add the missing API in 3.6.
Regards,
Ivan

Report message to a moderator

Re: Change tree / table header background and foreground color [message #1787216 is a reply to message #1787205]

Tue, 22 May 2018 08:25

Nicola Zanaga

Messages: 56
Registered: July 2009

Member

Thanks, I've filed a bug at
https://bugs.eclipse.org/bugs/show_bug.cgi?id=534927

Report message to a moderator

Re: Change tree / table header background and foreground color [message #1787222 is a reply to message #1787189]

Tue, 22 May 2018 09:48

Vincenzo Caselli

Messages: 235
Registered: January 2012

Senior Member

Hi Nicola,
CSS styling isn't at all in contrast with dynamic change of background and foreground, even for table headers.

Just define different CSS for your UI status, e.g.

TableColumn {
  color: #0000FF;
    background-image: gradient(
    linear, left top, left bottom,
    from( #ff0000 ),
    to( #ff0000 )
  );
}

TableColumn.other {
  color: #00FF00;
    background-image: gradient(
    linear, left top, left bottom,
    from( #0000FF ),
    to( #0000FF )
  );
}

Then, when you want to change it, do for instance:

                TableColumn[] columns = table.getColumns();
                columns[2].setData( RWT.CUSTOM_VARIANT, "other" );

it works (just tested)

HTH
Vincenzo

Report message to a moderator

Re: Change tree / table header background and foreground color [message #1787289 is a reply to message #1787222]

Wed, 23 May 2018 08:20

Nicola Zanaga

Messages: 56
Registered: July 2009

Member

Hi Vincenzo,

unfortunately styling by css doesn't permit to change color at runtime, but only defines statically (and globally) pre-coded styles, where the css must in any case configured at application startup

In any case, to use css dynamically, maybe if were possible:
1) adding css theming at runtime for example like:

RWT.getUISession().appendCss( "data" );

2) or define css style inline in a control

  columns[0].setData( RWT.CUSTOM_CSS, "TableColumn { color: XXX }" );

will solve the problem

Report message to a moderator

Re: Change tree / table header background and foreground color [message #1787293 is a reply to message #1787289]

Wed, 23 May 2018 09:05

Vincenzo Caselli

Messages: 235
Registered: January 2012

Senior Member

Hi Nicola,
I can assure you that the snippets in my previous post are indeed working, at least if I understood right your needs.
Let me show you.
This is how the table header appears at first
index.php/fa/32890/0/

that's because of the base CSS is the following

TableColumn {
  color: #0000FF;
    background-image: gradient(
    linear, left top, left bottom,
    from( #ff0000 ),
    to( #ff0000 )
  );
}

then, when I click on a button, I do this programmatically

TableColumn[] columns = table.getColumns();
columns[3].setData( RWT.CUSTOM_VARIANT, "other" );

and that's what happens immediately
index.php/fa/32891/0/

thanks to the following CSS

TableColumn.other {
  color: #00FF00;
    background-image: gradient(
    linear, left top, left bottom,
    from( #0000FF ),
    to( #0000FF )
  );
}

If that's not happening to you, the only reason I can think of is that you aren't handling the ServerPushSession (start/stop). In this case, try to do start it, e.g. when creating the composite, with:

ServerPushSession pushSession = new ServerPushSession();
pushSession.start();

(although at some point you should call also .stop())

Let me know what's not working for you.
HTH
Vincenzo

Attachment: Selection_016.png
(Size: 2.45KB, Downloaded 339 times)
Attachment: Selection_017.png
(Size: 2.57KB, Downloaded 320 times)

Report message to a moderator

Re: Change tree / table header background and foreground color [message #1787295 is a reply to message #1787189]

Wed, 23 May 2018 09:33

Ivan Furnadjiev

Messages: 2426
Registered: July 2009
Location: Sofia, Bulgaria

Senior Member

Hi,
Vincenzo is right... Changing widget custom variant at runtime is possible in RAP. You could use it as a workaround for the missing API. Nevertheless, I would like to add support for the new Tree/Table SWT API in the next 3.6 release.
Regards,
Ivan

Report message to a moderator

Previous Topic:	Scroll problem in Safari on iOS11
Next Topic:	Background Image on CoolBar

Goto Forum:

-=] Back to Top [=-

[ Syndicate this forum (XML) ] [

]

Current Time: Tue Apr 16 22:26:15 GMT 2024

.:: Contact :: Home ::.

Breadcrumbs

Sign up to our Newsletter