HOW:Custom ListBox in eSWT or LCDUI

[mackrispi]

Hi,

I would like to create custom listbox where ListBoxItems would have 3 rows and they could be custom drawen ...
just like in any other programming languages where you can create custom ListItem that is taking care of its drawing ... I saw LCDUI controls can have paint methods ....
ListBox from eSWT can have max 2 rows ....

I thought implementing PaintListener would work, but is not .... and there is no Paint or Draw method to override ... which would be the best ....

Why I need eSWT is only because Browser can be implemented inside my GUI... and I can control it...

I also found out that mixing LCDUI and eSWT is not possible cause my app on simulator crash ....


So basicly here is my scenario:
- I would like to have table or list that has vertical rows where each selectable row item contains 3 rows like (example for 3 items):

-------------------
Title1 Date
User Name1
Description1
-------------------
Title2 Date
User Name2
Description2
-------------------
Title3 Date
User Name3
Description3
-------------------


NEXT PAGE ->

-----------------------------
* *
* some custom header info *
*---------------------------*
* *
* *
* Browser page *
* *
* *
* *
*----------------------------

When user selects one item(row) next page is displayed and in that page I show Browser with url got from selected table/list item and with some additional info on the top..... I have that page already working 100% but using eSWT

I don't know what to do anymore cause if i want to draw items by my self I need to use LCDUI but if I want to have Browser inside my control I need to use eSWT .... and because I can't mix LCDUI and eSWT I don't know what to do ...

Please any suggestions are welcome....

Thank you
Kris

[gorkem.ercan]

I think my answer also applies to you other thread http://discussion.forum.nokia.com/fo...d.php?t=179287

As you have discovered eSWT/LCDUI mixing is not supported but we are going to address that. See https://bugs.eclipse.org/bugs/show_bug.cgi?id=279443

Unfortunately ListBoxItems on eSWT do not permit you to have custom drawing/layouting defined. They are meant to be model objects only. Although you can define, add paint listener and do custom drawing on any Control (including ListBox) with the PaintListener but experience is it does not provide a good solution.

Judging from your other thread I think you are on the right track. You can use Composite or Canvas(remember Canvas is a Composite) to host other stock Controls like Label to create custom Lists. You can position these stock controls to any place on the Composite(or Canvas). In order to manage the focus on keypad navigation you need to implement traverse listeners. Have a look at the TraverseEvent document for details[1]. On touch devices you can forceFocus on MouseListener events. You may also use GC.drawFocus() depending on your implementation. So it is possible to implement custom lists using eSWT stock widgets and the effort is less than drawing everything yourself.

[1] http://library.forum.nokia.com/index...erseEvent.html

--
Gorkem

[mackrispi]

Hi,

First I would like to thank you for the info ....

Now .... bellow is my class example .... I have implemented TraverseListener listener on my extended Canvas class .... but the method from TraverseListener is never called ...

I have add TraverseListener in constructor ... but looks like this is not all I should add ...

The control looks great, I used ScrollableComposite for scrolling which is also working as it should ...now just movement from one item to another is needed ...

Can you please look at the code .... I took example from ScrollableComposite and this code looks like this:

final ScrolledComposite sc1 = new ScrolledComposite(shell, SWT.H_SCROLL | SWT.V_SCROLL | SWT.BORDER);
sc1.setShowFocusedControl(true);
final Composite c1 = new Composite(sc1, SWT.NONE);
sc1.setContent(c1);
c1.setLayout(new FormLayout());

TableRow oldRow = null;
for (int i=0;i<10;i++)
{

TableRow r = new TableRow(c1,SWT.NONE);
FormData data1 = new FormData();
data1.left = new FormAttachment(0, 0);
.....
.....
r.setLayoutData(data1);
r.layout();
}

c1.setSize(c1.computeSize(display.getBounds().width-10, SWT.DEFAULT));
c1.layout();


public class TableRow extends org.eclipse.swt.widgets.Canvas implements PaintListener, TraverseListener
{
public TableRow(Composite a0, int a1)
{
super(a0,a1);
// TODO Auto-generated constructor stub
this.addPaintListener(this);
this.addTraverseListener(this);
}

public void keyTraversed(TraverseEvent arg0) {
// TODO Auto-generated method stub
System.out.println("TERAV:");
}

}

Thank you.
Kris

[mackrispi]

Hi,

More info .... I found out that by pressing TAB key another control gets selected .... So what do I need to call from KeyListener event to force selection ?

There is also one more ugly thing .... flickering is huge when drawing in PaintControl method ....

is there any other possible was to draw on GC to prevent flickering ? Maybe double buffering somehow ?

Thank you.
Kris

[gorkem.ercan]

Canvas receives all the key events including those are used for traversal. If Canvas does not want to consume those key events that you just set the doit flag of the KeyEvent to false (which is true for Canvas), this will in turn create a TraverseEvent.

--
Gorkem

[mackrispi]

Hi,

I managed to make it work in Canvas but ...

I gave up on performance when using eSWT paint, there was too much flickering ... so I started to do the same thing in LCDUI ... and I managed to create very nice GUI with scrollable list control .... without flicker

BUT ... there are only 3 sizes of Font ....

Is there any other way to create smaller font then FONT_SMALL shows? Or is just emulator showing bigger fonts then they are on the real device, cause i don't have the real device yet

And I can see that emulator GUI uses different fonts ...

BR,
Kris