Remove border for Portlet component- Sencha GXT in java - gwt

I am trying to remove borders of the portlet as well as the panel.
Below is my code snippet,
public class TestViewImpl extends ViewImpl implements TestViewPresenter.MyView{
private PortalLayoutContainer portal;
#Inject
public TestViewImpl (){
portal = new PortalLayoutContainer(1);
vp = new VerticalLayoutContainer();
portal.getElement().getStyle().setBackgroundColor("white");
portal.setColumnWidth(0, 1);
portal.setBorders(false);
ContentPanel portlet = new Portlet();
portlet.getHeader().setVisible(false);
portlet.setBorders(false);
portlet.setBodyBorder(false);
portlet.add(vp);
portlet.setResize(true);
portlet.setBodyStyle("backgroundColor:white;");
portal.add(portlet, 0);
But somehow the border is always visible.How do I remove the border ? Please help.
Thanks in advance

With that code I can get the borders to disappear (with small alterations to container instantiation). Where are those containers coming from? Are you using UI Binder, if so could you post that code as well.
The blue section that is left is the background from the header. (Hide header hides the text)

If you really need to remove the outline border (which is a background image actually), you can try something like this:
Element e = portlet.getElement().getFirstChildElement();
e.getStyle().setBorderWidth(0, Unit.PX);
Here is the screenshot of the result:
It's not going to be easy, but this is the only way (from what I know and tried already), you going to need developer tools on browser (i.e. firebug) to do inspection, and predict what element to get and what attribute to remove. The code I provide above are just example how we can remove the top outline border, and for the rest you can tried it by yourself. Goodluck :-)

Related

How can I wrap contents of a textbox that's next to a picture control?

I have the following defined in Active Reports 8 (a picture control with a border--shape--next to textbox fields):
I have more textbox fields below the two defined here, but this is just to illustrate my issue.
Anyway, how do I get the first textbox to wrap without overlapping the second textbox like below?
When I get rid of the picture and shape on the left, everything wraps as expected.
This is actually a known issue and is caused when controls are placed adjacent to each other and one side of the control has a larger height as compared to the ones on the other. Considering your example, let's say the top textbox is TextBox1 and the bottom one is TextBox2. You can handle the BeforePrint event of the Detail section and resolve this issue. For example take a look at the code below:
public void Detail_BeforePrint()
{
TextBox2.Top = TextBox1.Top + TextBox1.Height;
}
Hope this helps.

EffectQueue and chaining effects in IceFaces 1.8

I'm currently working with IceFaces 1.8, and have been trying to find an simple way to chain effects on UI Components. For example, I have a "Show Help" link at the top right of the page. When clicked, help text will appear below certain controls for users. I'd like this text to appear by sliding down, then highlighting.
I have a basic isRenderHelp() method on my bean that returns true or false, and use that to render effects using the fire attribute on the <ice:effect> tag, so it looks something like this:
<ice:effect effectType="slidedown" fire="#{myBean.renderHelp}">
<ice:effect effectType="slideup" fire="#{!myBean.renderHelp}">
This works causing the help section to slide in and out as the help link toggles the renderHelp flag in the bean. There is the small exception that renderHelp returns null before the link is clicked for the first time to prevent the slideup animation from firing on the first page render.
Now, I noticed looking through the showcase code for 1.8 that there is an EffectQueue class that extends Effect. This allows me to add mutliple Effects to the queue in my bean, and return the queue from a getEffect method that I can then assign to a panelGroup effect attribute. However, it does not execute the events in the queue, despite having their priorities set. I'm sure I'm not using it properly, and I'm wondering how it should be used.
Normally I'd use jQuery for this type of thing, but the UI uses many partial submits. Our page is displayed via a Liferay portlet, so on any partialSubmit the view is rerendered, undoing any modifications to the DOM by jQuery.
So is there any simple way to chain effects in IceFaces 1.8? Suggestions?
here is how I implemented the effectQueue to appear and fade the text.
private EffectQueue effectQueue;
public Effect getSaveSettingsEffect() {
return effectQueue;
}
public void fireEffect(ActionListener e) {
if(effectQueue == null) {
effectQueue = new EffectQueue("apperAndFade");
Appear appear = new Appear();
appear.setDuration(2);
effectQueue.add(appear);
Fade fade = new Fade();
fade.setDuration(3);
effectQueue.add(fade);
effectQueue.setTransitory(true);
}
effectQueue.setFired(false);
}
facelet:
<ice:commandButton value="fireEffect" action="#{bean.fireEffect}"/>
<ice:outputText value="text" style="display: none;" effect="#{bean.effectQueue}"/>

Widget used in GWT showcase left menu

I would like to develop in GWT a vertical menu similar to the one found on http://gwt.google.com/samples/Showcase/Showcase.html (the left blue menu which first section is "Widgets").
Since it's a GWT showcase, one can assume that left menu is a GWT widget, but which one ?
I have browsed every example and none of them looks like that menu. Any guess ?
Did you know the Showcase sample is open-source? It's even bundled with the GWT SDK.
The code tells use it's a CellTree within a ScrollPanel (within a DockLayoutPanel within a DockLayoutPanel):
The UiBinder template
The code initializing the CellTree
The code initializing the TreeViewModel (including prefetching the split-points for the samples when you expand a category node; and updating the center panel when you select a sample node)
the TreeViewModel itself
It's the CellTree widget!
A demo is actually inside the showcase: CellTree, but in the example, it has a different style applied:
CellTree.Resources res = GWT.create(CellTree.BasicResources.class);
CellTree.Resources res = GWT.create(CellTree.BasicResources.class);
cellTree = new CellTree(
new ContactTreeViewModel(selectionModel), null, res);
(this stlyes makes the +/- buttons and lets it look like a regular tree)
If you don't apply this style the Cell Tree looks like the left menu.
Looks just like a vertical arrangement of DisclosurePanel. Here are the docs.

programmatically change the background color in eclipse

I have a question related to eclipse plugin development. Is there any means
by which I can programmatically change the background color in eclipse.
I am able to change the text foreground color by calling
setTextColor(color, offset, length, controlRedraw) in ITextViewer
but I don't find any function by which I can change the background
color of the text.
If anyone has been through this kindly share your thoughts.
Thanks
arav
I am not sure this can be done easily, short of extending your own version of a Text Editor, here you provide a Configuration Class which inturn accepts a PresentationReconciler Class which is like a Rule Class that tells you if you need to put a Foreground or a Background Color
See this document
PresentationReconciler
IPresentationDamager: define dirty region given a text change
IPresentationRepairer: recreate presentation for dirty region
DefaultDamagerRepairer does both, based on a token scanner
ITokenScanner: parse text into a token stream
RuleBasedScanner uses simple rules
Extract from the presentation
From Text Editor Recipes, Season’s recipes for your text editor
Tom Eicher, IBM Eclipse Team
Here, the null background color means, takes the default system background for that widget. (so here: white).
But you could specify whatever color you want, based on the partitioning of your document and on the rules that would apply.
I know this was asked a while ago, but in case anyone is looking for another solution, I thought I would post the following:
Since you are able to use the setTextColor method, then you should be able to use the changeTextPresentation method as well.
In the case of my plug-in, I have a TextListener that calls the TextChanged method I overwrote. I did the following to add background color using the changeTextPresentation method. In doing so, I was able to get a Green background with Black foreground. Not that I would want this, of course, but just for testing purposes.
public void TextChanged(TextEvent event){
...
TextPresentation presentation = new TextPresentation();
TextAttribute attr = new TextAttribute(new ColorManager().getColor(MyConstants.BLACK),
new ColorManager().getColor(MyConstants.GREEN), style);
presentation.addStyleRange(new StyleRange(startOffset, tokLength, attr.getForeground(),
attr.getBackground());
sourceViewer.changeTextPresentation(presentation, true); //sourceViewer is a global variable passed to my TextListener class constructor.
}

Drawing into an Eclipse editor

I am trying to draw some shapes (boxed ans arrows) into, i.e., "over" the text in an eclipse editor. To get started, I wrote the following code:
IWorkbenchPage activePage = Activator.getDefault().getWorkbench().getActiveWorkbenchWindow().getActivePage();
final Shell shell2 = activePage.getActiveEditor().getSite().getShell();
shell2.addPaintListener(new PaintListener(){
public void paintControl(PaintEvent e){
Rectangle clientArea = shell2.getClientArea();
e.gc.drawLine(0,0,clientArea.width,clientArea.height);
}
});
The problem with this code is twofold: (1) The line is drawn not across the editor but across the entire workbench, i.e., Eclipse window, and (2) the line is drawn behind (!) all other controls like toolbars and editors. This causes the line to be almost invisible: it only shows at some pixels between other controls.
How can I draw a line across a control like a text editor in Eclipse?
The problem that you have is that you are getting the Shell, not the actual component for the editor. The Shell is the whole window where Eclipse is being shown.
I think the only solution is to create your own Editor implementation, and then in the createPartControl() method you can create a text area and then add the paint listener to it.
You can get started with:
http://www.realsolve.co.uk/site/tech/jface-text.php
And then, looking at the source code of AbstractTextEditor, you can find the "real" SWT component that you want to draw to. You would need to override the method that creates the UI components, copy the original code and add your custom painting.
I'm not sure if it works, but you need to extend the TextEditor:
public class MyEditor extends TextEditor {
protected StyledText createTextWidget(Composite parent, int styles) {
StyledText widget = super.createTextWidget( parent, styles );
widget.addPaintListener( <yourPaintlistener> );
return widget;
}
}
That should at least get you the basic text-drawing control of the editor. Still, it's a PITA to work with these classes, as it is very internal stuff from eclipse, and neither documented nor really extensible.
Good luck with that :)